Search the Community

I am reading temperature and humidity from an API and displaying the temperature using Thermometer widget. But it is not rendering right (image attached). Appreciate any help. HTML and Script files attached. Using "version": "3.1.0" index.html script.txt

I have installed thermometer gauge, The default fill colour is blue #008ee4. is it possible that this colour can change as the thermometer fills up, for example from #008ee4 to #ff6600 to #ff0000 at different levels? here is the code I have in, (have tried different code to get the colour to change but to no avail. FusionCharts.ready(function () { var chart = new FusionCharts({ type: 'thermometer', renderAt: 'chart-container2', id: 'temp-monitor', width: '100', height: '220', dataFormat: 'json', manageResize: '1', dataSource: { "chart": { "caption": "Staff", "subcaption": "", "subcaptionFontBold": "0", "lowerLimit": "1", "upperLimit": "40", "numberSuffix": " S", "bgColor": "#ffffff", "showBorder": "0", "thmFillColor": "#008ee4", "showhovereffect": "1", }, "value": "0" I am using V3.7.0

I'm trying to implement a simple Thermometer Widget. I have referenced the fusioncharts.widgets.js in my html page and have the code to generate the chart as following. I have made sure that the XML is there at the specified relative location. Am I missing somethig here? I don't get any error message. If I add the reference to FusionCharts.js file, then I get the chart type not supported message. Please assist!! Thanks <div id="PC_pnlChart"> <script type="text/javascript"> FusionCharts.ready(function () { var myChart = new FusionCharts({ "type": "thermometer", "renderAt": "PC_pnlChart", "width": "500", "height": "300" }); myChart.setXMLUrl("../ChartXML/thermo.xml"); myChart.render(); }); </script> </div>