FusionCharts - Gallery Example - Scroll Column 2D Chart in JavaScript
Created using FusionCharts Suite XT - www.fusioncharts.com
HTML
<script src="http://static.fusioncharts.com/code/latest/fusioncharts.js"></script>
<script src="http://static.fusioncharts.com/code/latest/fusioncharts.charts.js"></script>
<!--
A Scroll Column 2D Chart showing sales trend for last two years.
-->
<div id="chart-container">FusionCharts will render here</div>
JavaScript
FusionCharts.ready(function () {
var revenueChart = new FusionCharts({
type: 'scrollColumn2d',
renderAt: 'chart-container',
width: '550',
height: '350',
dataFormat: 'json',
dataSource: {
"chart": {
"caption": "<SCRIPT>alert-"_fusion&@$@^",
"subcaption": "FY 2012 - FY 2013",
"xaxisname": "Month",
"yaxisname": "Revenue",
"showvalues": "1",
"placeValuesInside" : "1",
"rotateValues": "1",
"valueFontColor" : "#ffffff",
"numberprefix": "$",
//Cosmetics
"baseFontColor" : "#333333",
"baseFont" : "Helvetica Neue,Arial",
"captionFontSize" : "14",
"subcaptionFontSize" : "14",
"subcaptionFontBold" : "0",
"showborder": "0",
"paletteColors" : "#0075c2",
"bgcolor": "#FFFFFF",
"showalternatehgridcolor": "0",
"showplotborder": "0",
"labeldisplay": "WRAP",
"divlinecolor": "#CCCCCC",
"showcanvasborder": "0",
"linethickness": "3",
"plotfillalpha": "100",
"plotgradientcolor": "",
"numVisiblePlot" : "12",
"divlineAlpha" : "100",
"divlineColor" : "#999999",
"divlineThickness" : "1",
"divLineIsDashed" : "1",
"divLineDashLen" : "1",
"divLineGapLen" : "1",
"scrollheight" : "10",
"flatScrollBars" : "1",
"scrollShowButtons" : "0",
"scrollColor" : "#cccccc",
"showHoverEffect" : "1",
},
"categories": [
{
"category": [
{...