FusionCharts - Gallery Example - Pie 2D Chart
Created using FusionCharts Suite XT - www.fusioncharts.com
by prathik
HTML
<script src="http://static.fusioncharts.com/code/latest/fusioncharts.charts.js"></script>
<script src="https://static.fusioncharts.com/code/latest/fusioncharts.js"></script>
<script src="https://static.fusioncharts.com/code/latest/fusioncharts.charts.js"></script>
<!-- Basic sample for Pie 2D chart -->
<div id="chart-container">FusionCharts will render here</div>
JavaScript
FusionCharts.ready(function () {
var ageGroupChart = new FusionCharts({
type: 'pie2d',
renderAt: 'chart-container',
width: '650',
height: '300',
dataFormat: 'json',
dataSource: {
"chart": {
"caption": "Asset Mix",
"paletteColors": "#0075c2,#1aaf5d,#f2c500,#f45b00,#8e0000",
"bgColor": "#ffffff",
"showBorder": "0",
"use3DLighting": "0",
"showShadow": "0",
"enableSmartLabels": "0",
"showLabels":"0",
"showValues":"0",
"startingAngle": "0",
"showPercentValues": "1",
"showPercentInTooltip": "0",
"decimals": "1",
"captionFontSize": "14",
"subcaptionFontSize": "14",
"subcaptionFontBold": "0",
"toolTipColor": "#ffffff",
"toolTipBorderThickness": "0",
"toolTipBgColor": "#000000",
"toolTipBgAlpha": "80",
"toolTipBorderRadius": "2",
"toolTipPadding": "5",
"showHoverEffect":"1",
"chartLeftMargin":"0",
"chartRightMargin":"300",
"showLegend": "1",
"legendBgColor": "#ffffff",
"legendBorderAlpha": '0',
"legendShadow": '0',
"legendItemFontSize": '10',
"legendItemFontColor": '#666666',
"legendNumColumns":"3"
},
"data": [
{
"label": "US1",
"value": "1250400"
},
{
"label": "US2",
"value": "1463300"
},
{
"label": "US3",
"value": "1050700"
},
...