Customizing Charts - Setting Gradients

Setting Gradients in area chart data plot

by sanjuktamukherjee

HTML

<script src="http://static.fusioncharts.com/code/latest/fusioncharts.js"></script>
<script src="http://static.fusioncharts.com/code/latest/fusioncharts.charts.js"></script>
<div id="chart-container">FusionCharts will render here</div>
<!-- 
Using gradients fill in area chart data plot using attribute: 
    # usePlotGradientColor: Set to 1
-->

JavaScript

FusionCharts.ready(function () {
    var salesChart = new FusionCharts({
        type: 'doughnut2d',
        renderAt: 'chart-container',
        width: '600',
        height: '300',
        dataFormat: 'json',
        dataSource: {
  "chart": {
    "caption": "Company Revenue",
    "showpercentagevalues": "1"
  },
  "data": [
    {
      "label": "Services",
      "value": "26"
    },
    {
      "label": "Hardware",
      "value": "32"
    },
    {
      "label": "Software",
      "value": "42"
    }
  ]
}
    });

    salesChart.render();
});