I am trying to get an example to work in my application. The theme does not work. There is no error message or anything, it just does not apply. I have tried a few themes and none of them work at all. Any advice?
More info: it is an older app that has a lot of other JS libraries that it uses. I just finished fixing an error where prototype.js broke something in fusion charts so the charts wouldn't render at all. Are there any known libraries that would somehow break the themes that I should look for?
<%-- Step 1 - Include the fusioncharts core library --%>
<script type="text/javascript" src="https://cdn.fusioncharts.com/fusioncharts/3.18.0/fusioncharts.js"></script>
<!-- Include fusion theme -->
<script type="text/javascript" src="https://cdn.fusioncharts.com/fusioncharts/3.18.0/themes/fusioncharts.theme.fusion.js"></script>
<script type="text/javascript">
//STEP 2 - Chart Data
var chartData = [{
"label": "Venezuela",
"value": "290"
}, {
"label": "Saudi",
"value": "260"
}, {
"label": "Canada",
"value": "180"
}, {
"label": "Iran",
"value": "140"
}, {
"label": "Russia",
"value": "115"
}, {
"label": "UAE",
"value": "100"
}, {
"label": "US",
"value": "30"
}, {
"label": "China",
"value": "30"
}];
//STEP 3 - Chart Configurations
var chartConfig = {
type: 'column2d',
renderAt: 'chart-container',
width: '100%',
height: '400',
dataFormat: 'json',
dataSource: {
// Chart Configuration
"chart": {
"caption": "Countries With Most Oil Reserves [2017-18]",
"subCaption": "In MMbbl = One Million barrels",
"xAxisName": "Country",
"yAxisName": "Reserves (MMbbl)",
"numberSuffix": "K",
"theme": "fusion",
},
// Chart Data
"data": chartData
}
};
FusionCharts.ready(function(){
var fusioncharts = new FusionCharts(chartConfig);
fusioncharts.render();
});
</script>
<div id="chart-container">FusionCharts XT will load here!</div>
