FusionCharts - 100% Stacked Column 2D Chart in JavaScript

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.charts.js"></script>
<script src="http://static.fusioncharts.com/code/latest/themes/fusioncharts.theme.fint.js"></script>
<center>    
    <p id="chart-container">Loading chart. Please wait...</p>
</center>

<!--colores
4c9d2a
f6b002
009cdf
e7692f
dd007f
973089
-->

CSS

body {
    font-family: Verdana, Arial;
    font-size: 12px;
    line-height: 18px
}
p {
    margin-top: 12px;
    margin-bottom: 18px;
}

JavaScript

var chartObjetivos = new FusionCharts("swf/HBullet.swf", "chart", "500", "75", "0", "0");
    chartObjetivos.setDataXML("<chart palette='1' lowerLimit='0' upperLimit='200' caption='Autos' subcaption='(Objetivo: 0 - Hoy: 0)' numberPrefix='' numberSuffix='%' showValue='1' plotFillColor='009CDF' targetColor='000000' formatNumber='1' decimalSeparator=',' thousandSeparator=' ' plotfillpercent='50' targetFillPercent='80' ><colorRange><color minValue='{_valor_minimo_}' maxValue='{_tramo01_}' code='911200'/><color minValue='0' maxValue='200' code='FFFFFF'/></colorRange><value>130</value><target>100</target></chart>");
    chartObjetivos.render("chart-container");

/*
FusionCharts.ready(function () {
    var revenueChart = new FusionCharts({
        type: 'HBullet',
        renderAt: 'chart-container',
        width: '500',
        height: '75',
        dataFormat: 'json',
        dataSource: {
              "chart": {
                "lowerlimit": "0",
                "upperlimit": "200",
                "caption": "Autos",
                "subcaption": "(Objetivo: 0 - Hoy: 0)",
                "numberprefix": "",
                "numbersuffix": "%",
                "showvalue": "1",
                "plotFillColor":'009cdf',
                "targetColor":'000000',
                "plotfillpercent": "50",
                "targetFillPercent": "80"
              },
              "colorrange": {
                "color": [
                  {
                    "minvalue": "0",
                    "maxvalue": "200",
                    "code": "FFFFFF"
                  }
                ]
              },
              "value": "130",
              "target": "100"
            }
    });
    revenueChart.render();
});*/