Cool-looking dashboard for connected devices

This was posted on hacker news today and it seems like it might be of interest to Spark users.

https://freeboard.io/

6 Likes

Interesting, thanks for sharing! :slight_smile:

This is amazing. I can already hear someone way back in the audience bellowing, “Freeeee Boooooaaaard!”

2 Likes

I can’t get past the full-page animated background… :open_mouth:

Okay… I got past the background. It convinced me to click “Start Now”.

We’ve been using Leftronic for nice dashboards here at work, but they are very pricey, even for simple personal use. Then there’s the famous Panic Status Board (made famous by their blog post), but it’s a mobile-only app. I’ve also worked on and off on a personal solution using Graphite + Faye (Node.JS PubSub) + HighCharts, but programming the UI for building dashboards is a real pain.

Maybe one of these days, I’ll get the free time and motivation to finish up that package and release the whole concept (code, architecture, glue, etc) to the world.

4 Likes

Internally we’ve been using https://metrics.librato.com/ to track a number of metrics, and I think I’ve seen other community members posting from their core to that service, seems nice so far and not expensive. :slight_smile: And I think some people may be using https://plot.ly/

edit: I’m sure a bunch of people would like to see your graphite+node+highcharts solution as well, since rolling your own dashboard is indeed a pain. :slight_smile:

Thanks!
David

2 Likes

It looks like Freeboard has open-sourced their UI! This could be my missing link!

I’ve been wanting to roll my own dashboard package/service for a long time now. Mostly because I’m sick of paying too much or being rate limited on free accounts. I’m a bit of a data whore, so I like 1-second resolution,(whether I use it or not) and long retention. I like being in control of my data and not have someone limit me to what they think is best.

I have a big work deadline due tomorrow that was just handed to me yesterday. I have no time for these distractions. Agh!! :smile:

But, seriously, this has made my year so far! And that probably extends back to November 2012 when I first embarked on this passion.

4 Likes

These are the same folks that did the interesting service dweet.io which allows you store data on their cloud, up to one entry every 2.88 minutes (500 per day). A Spark could easily “dweet” but the functionality is somewhat similar to Spark.publish(). The way they appear to make money is by “locking” the dweets from things, that is providing privacy. It doesn’t say if that also allows more storage or high rates, but that would make some sense.

My first reaction is GREAT THAT’S AWEXOME! Really this is just what we need and have been wanting for the Spark Core.

The more I look at it though I kind of wish they had come up with their own unique javascript gauge since it is a pretty heavily used item. Nothing wrong with it, it’s just recognizable as a http://justgage.com/ and would be cool if they gave it their own style, maybe something more like an outlined version of the gauge with a transparent background, and a single color representing the data value. Since I’m talkin’ smack, here’s my photoshop rendition. New style at the top, old at the bottom.

1 Like

That’s another reason I’ve wanted to roll my own system for a while, but nothing can be everything for everyone!

Is that a still in your “CAM 1” picture? :wink:

@BDub What would be a way to post data from a :spark:core to this cool dashboard ? Would that be the JSON interface and can you share a suggestion how this would go ?
Thanks,

You would definitely use the JSON interface and pull from a variable exposed using Spark.variable(). I’ll see if I can’t do a quick write-up with sample code tonight. Anyone else can feel free to beat me to the punch, as it will probably be after 11:00 PM Eastern before I can really get to it. :-/

<UPDATE> I was going to take a little 15-minute break from work and try to write up an example. Instead, I accidentally flashed the wrong (bad) code, so I can’t build an example until I can factory reset the Core. Oops! </UPDATE>

3 Likes

This dashboard looks nice - now, the only thing missing is being able to define interaction between the devices though the dashboard

I have set up a Spark Core with a TMP36 (temperature sensor) and an LDR (photoresistor). The firmware for that is in this gist. It uses the elapsedMillis library graciously made available by @peekay123. The code exposes 4 variables using Spark.variable(): snsTempF, snsTempC, snsTempK, and snsLight (“sns” being short for “sensor”). These values get update on the Core every 5 seconds.

To get the data into Freeboard, I added a JSON data source and used https://api.spark.io/v1/devices/MY_DEVICE_ID/snsTempF?access_token=WOULDNT_YOU_LIKE_TO_KNOW for the URL. I also added another data source for snsLight. The “Refresh Every” is set to 30 seconds (you can increase or decrease this as you like). I left “Load as JSONP” set to “NO”.

Here’s what it looks like:

After I added my two data sources, I created a pane. Within the pane, I created two sparkline graphs. It looks like Freeboard already does an initial pull to get the JSON response from the Spark Cloud. Next to the Value field, click on the “+ Data Source” button to the right. It should present a dropdown of your data sources. Select the appropriate one and then select result immediately afterwords. Depending on the graph type you chose, your screen should look similar to this:

Your resulting Freeboard may look a little something like mine. It’s not much with only two sensor values, but this is only a 15-minute write-up. I can’t tell if it’s being properly updated, though. If I load the Freeboard in incognito/private browsing mode, I see space for the graphs, but don’t see any data. It seems to show up fine when I’m logged in and editing the page, so it seems to be a Freeboard issue (and not the Spark Cloud or Core).

Hopefully this is what you were looking for!

5 Likes

When I surf to your Freeboard, I see a frame with “Cold Frame” and “Temperature” and “Light” but no actual data, just as you suggested above.

There is however a clone button at the bottom of the Freeboard page that looks like it would be really useful!

Very nice!

Which means my access token has been compromised. Yippee!

This looks like a great dashboard solution.
I’ve been thinking of ways to integrate http://atomiot.com with other dashboards like cyfe or geckoboard but hesitant because their cost makes people shy away.

I don’t like the idea of a dashboard being the keeper of my data. That prevents me from using the data elsewhere.

My service already logs variables and function results on a schedule. It can be the data hub and provide outputs to other systems, exports, etc…

Is there interest in a feature where the data is forwarded on to freeboard?

I am afraid your token is visible when I view source on that page. You can revoke it, of course–been there done that! I published one of mine briefly with the Spark.publish() tutorials.

@kareem613 - Although I’m not a user of Atomiot, I don’t like the idea of a single dashboard being the keeper of my data. I like the idea of a data storage/hub that lets me access my data anywhere, and maybe has a cool dashboard on their own.

@bko - Feel free to try and use that access token. I reset it about 15 seconds after I read your post about the clone option. It helps that I had the Sparkulator open in a another tab. :wink:

1 Like

We were in the same boat! I started building my own solution and then a colleague found Cyfe. It comes with 50+ pre-built widgets and for $14 it was well worth it. Building my own would have cost me a ton of time plus ongoing maintenance.