I've got 6 gauges that I'm trying to realtime update using the "dataStreamUrl" method and it doesn't seem to work with dial ID's despite instructions to the contrary. I have a php page that outputs the following string of data that I want to use to update 6 gauges. The page outputs the following string:
&pvvolt=18.33&pvamp=0&pvpower=0&batvolt=13.93&batamp=0&batpower=0&chargertemp=21.21&battemp=20.16
According to the documentation I should be able to set "id": "pvvolt" in the dial section that it should pick out the 18.33 value from the string and populate it. But it doesn. it only works if I change &pvvolt= to &value= (and hide the rest of the string).
is it possible to update several gauges from 1 output string or am I going about this wrong?
the code from my test page is below this line. the "id": "pvvolt" is in the correct location so I don't know why it doesn't behave. help?
<html>
<head>
<title>My first chart using FusionCharts Suite XT</title>
<script type="text/javascript" src="http://static.fusioncharts.com/code/latest/fusioncharts.js"></script>
<script type="text/javascript" src="http://static.fusioncharts.com/code/latest/themes/fusioncharts.theme.fint.js?cacheBust=56"></script>
<script type="text/javascript">
FusionCharts['debugger'].outputTo(function (message) {
console.log(message);
});
FusionCharts['debugger'].enable(true);
FusionCharts.ready(function(){
var fusioncharts = new FusionCharts({
type: 'angulargauge',
renderAt: 'chart-container',
id: 'pvvoltage',
width: '400',
height: '300',
dataFormat: 'json',
dataSource: {
"chart": {
"caption": "PV Voltage",
"lowerLimit": "0",
"upperLimit": "50",
"numberSuffix": "v",
"dataStreamUrl": "./getsolarstats-mppt1.php",
"refreshInterval": "7",
"theme": "fint",
"showValue": "1",
"valueBelowPivot": "1",
"majorTMNumber": "9",
"minorTMNumber": "5",
},
"colorRange": {
"color": [{
"minValue": "0",
"maxValue": "90",
"code": "#71ef1c"
}, {
"minValue": "91",
"maxValue": "100",
"code": "#e44a00"
}]
},
"dials": {
"dial": [{
"id": "pvvolt",
"value": "0",
"tooltext": "$value"
}]
}
}
}
);
fusioncharts.render();
});
</script>
</head>
<body>
<div id="chart-container">FusionCharts XT will load here!</div>
</body>
</html>