MQTT Button plugin


#1

Hi everyone,

So my goal is to create panel plugin that is just a simple button that on click sand MQTT massage to broker. Because I am total beginner I started by modifying grafana-clock-panel. I made changes in /dist/module.html (i changed clock display to button and added some java script code.) Code that I added was same as here: http://www.hivemq.com/blog/build-javascript-mqtt-web-application.

Problem that I have is how to us library for MQTT (in this case mqttws31.js). If I am doing this wrong pleas correct me.


#2

You will have to include the mqttws31.js file in the src directory. Create a sub directory called libs (or something similar) copy the js file in there and then import it like this in your controller:

import * as mqtt from './libs/mqttws31';

Here are some examples from other plugins: Worldmap, D3Gauge, Diagram panel

P.S. You should not be making your changes in the dist folder - that’s for generated (transpiled) code. I wrote a blog post about writing the Clock plugin that describes how to build it: https://grafana.com/blog/2016/04/08/timing-is-everything.-writing-the-clock-panel-plugin-for-grafana-3.0/

There is also some documentation on plugin development.


#3

It is a great idea. Do you have any progres in creation of MQTT client plugin?