IoT Realtime Telemetry Dashboard

Hi,

I’m working on a project using Meteor. Meteor is very well suited for this kind of use case and I’m willing to share my experience and ask some questions about some things.

First part : UI.

I’m looking for a set of widgets made for IoT to display realtime data feeds like gauges for example.
I know there are many libraries like D3.js C3.js Highcharts and many others, but they are too heavy for what is really needed for IoT and don’t have all the widgets and components I want.
ThingStudio have exactly what I want but it’s like propietary and can’t get all the source code of the UI they generate (they use some sort of templating engine which hides the Javascript logic that binds the data to the UI).

Do you know any kind of library of small and easy to use widgets or components looking like those made by ThingStudio ?

1 Like

Second part : Handling the data in the Meteor backend.

There’s one case that could be very heavy for the Meteor server and makes the latency higher if we use the classic pub/sub: Receiving data that changes each second or less (speed for example).

Here’s a solution that I found :

  • Using a custom publication function receiving the data from MQTT or any other medium, pushing it to the clients and then saving it in the DB asynchronously.

This is a code snippet that can very useful and reused for publishing realtime data from external sources without sacrifying performance.

 //Used to keep history and make statistics
    Speeds = new Mongo.Collection('speeds');
    
    if(Meteor.isServer){
    	
    	mqttClient  = mqtt.connect('mqtt://yourdomain.com');
    	
    	Meteor.publish("speed", function () {
    	
    	  mqttClient.subscribe('speed');
    	  
    	  mqttClient.on('message', Meteor.bindEnvironment(function callback(topic, message) {        
    		if(topic === 'speed'){
    			var speed = {_id: Meteor.uuid(), value: message};
    			subscription.added("speed", speed._id, speed);
    			console.log("realtime speed pushed : "+ EJSON.stringify(speed));
    			//Unblock the publication so the data can be published already and afterward saved in the DB
    			//Needs the following package : meteorhacks:unblock
    			this.unblock();
    			Speeds.insert(speed);
    		}    
    	  });
    
    	  this.ready();
    	  this.onStop(function(){
    		mqttClient.unsubscribe();
    	  });
    	});	
    	
    }
1 Like

tunguska:gauge is a compact package for realtime gauges. Disclaimer: I’m the author.

1 Like