This week’s assignment involved creating an application that we could use for our final project. As I’m building a PM 2.5 sensor, I decided to build the live temperature / pollution concentration level chart that would be regularly updated online.
I decided to look online to see what sorts of libraries already existed that did the plotting for me. I knew about D3.js, but it didn’t seem to be easy to support live plotting. However, I found Canvas.js supported live charts with some very nice functionality. I would be able to use a set of these charts that interacted with a simple Python server to pull data and still look very presentable. Here’s an example of a live chart that is randomly generating data to plot:
This is the code that is being used to generate the chart:
The code right now just generats random values on the line
yVal = yVal + Math.round(5 + Math.random() *(-5-5)); but this could be switched to be an AJAX request to the server that would then return the data we would be looking for, and we could push that onto
dps so that it keeps having the new data as it comes in.