Plotly JS file to display real time data

[Giriraj Pawar]

How can we use plotly.js to display real-time data in the canvas? 

Has anyone tried plotly?

Can we use it like chart.js?

Please let me know. 

https://plot.ly/settings#/

[TimAI2]

Probably too high brow (html5/CSS etc) for the AI2 webviewer - can't see how you would display in the canvas ?

[SteveJG]

Why do you want to export a plotly.js  graph to a Canvas?   The plotly.js graph is displayed as an image in a WebViewer or a browser.  The grapht contains no data that can be exported or displayed simultaneously with generation of the graph data to Canvas coordinates. You want to plot data in real time.  Why not plot directly to the Canvas coordinates?

Tim's comments are very appropriate   If you can use plotly.js to real time graph, you should do it in the WebViewer.   Is that possible?   What have you tried?

Here are some examples of using native Blocks to plot directly to the Canvas:

https://groups.google.com/forum/#!msg/mitappinventortest/fNQVDN-GPIY/7LskU2RZCQAJ;context-place=forum/mitappinventortest    ... a line graph

https://groups.google.com/forum/#!msg/mitappinventortest/VtOxig2EDlo/iIHxqjWm0WMJ;context-place=forum/mitappinventortest   ... a pie and a donut graph

ECG circuit(analog data)-Hc06- Arduino-Chart  ... scaled line graph / multiple data plots

Using a Canvas and Sprites

https://groups.google.com/forum/#!searchin/mitappinventortest/bar$20graph$20steve%7Csort:date/mitappinventortest/VCeTNbPCHz0/_gzxHZtkCgAJ

Using Buttons

https://groups.google.com/forum/#!searchin/mitappinventortest/bar$20graph%7Csort:relevance/mitappinventortest/-_m3Qe90ZiY/Jd7pOePTkpUJ

Using javascript

https://puravidaapps.com/pie.php  

https://groups.google.com/forum/#!category-topic/mitappinventortest/apps-tips--tricks/_K59AYPlUQk

http://kio4.com/appinventor/169D_javascript_graficos.htm  

Monitor this thread.  Someone might know something we are not aware of to use plotly.js in conjunction with the Canvas.

You might also consider using the ChartMaker extension.  The Chart extension  no longer works with App Inventor on some versions of Android  ChartMaker works on my 7.0 and 8.1 but does not work on my 4.2.2 Tablet.

Regards,

Steve

[Giriraj Pawar]

I tried using plotly.js, I got a little bit of success, but not sure, where the screenshots captured are getting saved, if you launch an application top right corner there is the button to take the screenshot. 

[SteveJG]

Glad you basically got the real time data to plot using plotly.js Giriaj.   When you take a screen capture using most Android devices (if not all), the image is saved to the Gallery on the device.  You should 

find the screen capture using your device's Gallery app.    Is that where it is.

You should also be able to use an extension to take a screen shot.  See Taifun's extension https://puravidaapps.com/screenshot.php  and it will be stored in the directory indicated in his tutorial.

-- Steve

[ABG]

(added to Charts and Graphs section of FAQ)

https://groups.google.com/forum/#!msg/mitappinventortest/wqJin0qO8M0/8xUafdROAgAJ

ABG