FusionCharts - Thermometer

Created using FusionCharts Suite XT - www.fusioncharts.com

by Nabajeet Sonowal

HTML

<script src="http://static.fusioncharts.com/code/latest/fusioncharts.js"></script>
<script src="http://static.fusioncharts.com/code/latest/fusioncharts.charts.js"></script>
<script src="http://static.fusioncharts.com/code/latest/themes/fusioncharts.theme.fint.js"></script>
<!-- Configuring background color in Column2D chart using: Attribute: # bgColor - Set to #DDDDDD # bgAlpha - Set to 50 Deviation from theme: # canvasBgAlpha - Set to 0 as the purpose of the chart to show background cosmetics. -->
<div id="chart-container">FusionCharts will render here</div>

CSS

body {
    padding: 10px;
}

JavaScript

FusionCharts.ready(function () {
     var myChart = new FusionCharts({
         "type": "thermometer",
             "renderAt": "chart-container",
             "id": "temp-monitor",
             "width": "120",
             "height": "400",
             "dataFormat": "json",
             "dataSource": {
             "chart": {
                 "caption": "Central cold storage",
                     "subcaption": "Bakersfield Central",
                     "subcaptionFontBold": "0",
                     "numberPrefix": "$",
                     "bgColor": "#ffffff",
                     "showBorder": "0",
                     "thmFillColor": "#008ee4",
                     "upperLimit": "1000000",
                     "lowerLimit": "5000",
                     "thmBulbRadius": "30"
             },
                 "value": "4000000"
         },
             "events": {}
     }).render();
 });