Please Note This forum exists for community support for the Mango product family and the Radix IoT Platform. Although Radix IoT employees participate in this forum from time to time, there is no guarantee of a response to anything posted here, nor can Radix IoT, LLC guarantee the accuracy of any information expressed or conveyed. Specific project questions from customers with active support contracts are asked to send requests to support@radixiot.com.
Build a Mango Dashboard Tutorial (Mango 2.x)
-
Hi,
First things first, I'm completely new to mango automation and my goal is to create a simple dashboard with a chart that shows some measurement data. The video here and the manual are very informative, but only after you have managed to set up your dashboard which I couldn't do since I don't know where I'm supposed to start at.
So what I'm asking is, you had a text file in the video that included the code for the dashboard I presume, but where is it saved? and is the dashboard instantly created after creating the text file? Also, can you use the mango management interface to manipulate your dashboard layout or do you only do it by editing the text file?
Some step-by-step guide where you start with absolutely nothing and build the dashboard "from scratch" (for example by copying a template) would be absolutely marvelous.
Thank you in advance.
-
Hi Nyoa,
I'm not sure it's exactly what you're seeking, but have you looked at the example pages in the Custom Dashboards module? Check Mango/web/modules/dashboards/web/public and Mango/web/modules/dashboards/web/private?
-
This post is deleted! -
Are the tutorials located in "/web/modules/dashboards/web/private/pointHierarchyExamples" still relevant? I tried to create a chart based on "realtimeSerialChart.shtm", but for some reason only the legend is visible, while the rest of the chart doesn't appear. I have basically copied all the code and only made changes to div id:s and matchAttribute so it would correspond with my data point.
I also tried to view the example (realtimeSerialChart.shtm) it seems to have the same problem with only the legend being visible and rest of the chart not appearing.
-
Many definitely are but some may not be. Most of the examples will let you specify an XID to see what the page is doing, but others are hardcoded to a point with the xid 'voltage'. You can click around through any you question the working-ness of after you click the 'Custom Dashboards' icon in the Mango interface.
-
Thanks for the fast reply.
Here is the code I use http://pastebin.com/MtFgArsN
The console gives me this error: "This file is deprecated. Please use RealtimeDataProvider.js instead." and the source is "RealtimePointValueDataProvider.js".
Here is the console output
Thanks for any help you can offer. I'm a total newbie at Mango Automation but am eager to learn the basics!
-
Honestly I haven't engaged the API to any great extent; I've been getting back into the swing of things. Perhaps @terrypacker knows. I tried to use RealtimeDataProvider as a drop in replacement, but it didn't work. Those example pages in the private/pointHierarchyExamples/ directory were marked legacy, so it is what it is. The tutorial examples are the preferred version of things.
Also, isn't that just a warning?
-
I tried to use a different tutorial (dataPointChart.shtm), which was a working example. However, to be able to get a data point the tutorial uses "MangoAPI.defaultApi.queryPoints($('#query').val())" where the query returns "limit(10)' by default.
This function then does a query to data points and limits the amount of returned objects to 10. I would like to make a query based on xid, but am not able to find any documentation.
-
nyoa,
You can query data points by XID with the = operator like this:
xid=DP_00001or to collect multiple points you can do this
xid=DP_009050|xid=DP_549302This query language is RQL and is described here: https://github.com/persvr/rql
-
There is a tutorial file in the custom dashboards folder with some examples: You should find it here: http://yourmangoip/mango-api-docs/tutorial-dataPointQuery.shtm
-
JoelHaggar and terrypacker
Thank you both for your help. Do you happen to know if there is documentation about how to modify "timePresetPicker"? I would like to have three buttons (HH, WW, MM) that would make the chart represent the data in their respective time frame, but with timePresetPicker I have to use a dropdown menu that is populated with lots of values I don't want.
Is there possibly different types of timePickers than timePresetPicker?
Also do you happen to know why "providerManager.refreshProviders();" under:
$('#presetPicker').on('change', function() { providerManager.refreshProviders(); }But if I want to call it in somewhere else when the document loads it gives an error "this.amChart.validateData is not a function"
