FusionCharts - Angular Gauge (Speedometer or Dial Chart) in JavaScript Example

Created using FusionCharts Suite XT - www.fusioncharts.com

by mhctoledo

HTML

<script src="http://static.fusioncharts.com/code/latest/fusioncharts.js"></script>
<script src="http://static.fusioncharts.com/code/latest/fusioncharts.widgets.js"></script>
<script src="http://static.fusioncharts.com/code/latest/themes/fusioncharts.theme.fint.js"></script>
<div id="chart-container">FusionCharts will render here</div>

JavaScript

var FichasChart = new FusionCharts("AngularGauge.swf", "fichas_trabajadas01", "680", "480", "0", "1");
FichasChart.setXMLData('<chart manageResize="1"  origW="400" origH="200" lowerLimit="0" upperLimit="100" numberSuffix="%" chartTopMargin="0"  chartBottomMargin="20" showBorder="0" basefontColor="000000" toolTipBgColor="FFFFFF" bgcolor="FFFFFF"><colorRange><color minValue="0" maxValue="75" code="FF654F"/><color minValue="75" maxValue="90" code="F6BD0F"/><color minValue="90" maxValue="100" code="8BBA00"/></colorRange><dials><dial value="92" rearExtension="10"/></dials></chart>');
FichasChart.setTransparent(false);
FichasChart.configure("ChartNoDataText", "No Hay Datos");
FichasChart.render("chart-container");