Convert FusionCharts Single Series Data to MultiSeries
HTML
<script src="http://static.fusioncharts.com/code/xt/5416/FusionCharts.js"></script>
<p>Single Series Data:</p>
<p><textarea id="srcdata" style="width: 420px; height: 240px"><chart caption='Monthly' xAxisName='Month' yAxisName='Revenue' numberPrefix='$' showValues='0'>
<set label='Jan' value='420000' />
<set label='Feb' value='910000' />
<set label='Mar' value='720000' />
<set label='Apr' value='550000' />
<set label='May' value='810000' />
<set label='Jun' value='510000' />
<set label='Jul' value='680000' />
<set label='Aug' value='620000' />
<set label='Sep' value='610000' />
<set label='Oct' value='490000' />
<set label='Nov' value='530000' />
<set label='Dec' value='330000' />
</chart></textarea>
</p>
<p><input type="button" value="Convert to Multi-Series" onClick="document.getElementById('outdata').value = explodeSeries(document.getElementById('srcdata').value)" /></p>
<p><textarea id="outdata" style="width: 420px; height: 240px"></textarea></p>
CSS
body {
font-family: "Verdana";
font-size: 12px;
}
p {
margin-top: 12px;
margin-bottom: 6px;
}
JavaScript
var explodeSeries = (function () {
var XML = "XML",
JSON = "JSON",
ZERO = "0",
COMMA = ",",
colors = ["#AFD8F8", "#F6BD0F", "#8BBA00", "#FF8E46", "#008E8E",
"#D64646", "#8E468E", "#588526", "#B3AA00", "#008ED6",
"#9D080D", "#A186BE", "#CC6600", "#FDC689", "#ABA000",
"#F26D7D", "#FFF200", "#0054A6", "#F7941C", "#CC3300",
"#006600", "#663300", "#6DCFF6"],
colorCount = colors.length;
return function (dataSource, dataFormat, outputFormat) {
var dataJSON,
plotGradientColor = ",FFFFFF",
categories,
dataset,
data,
set,
i,
l;
// Validate parameters and set defaults to XML data format
(!dataFormat) && (dataFormat = XML);
(!outputFormat) && (outputFormat = XML);
// Transcode data to JSON format
dataJSON = FusionCharts.transcodeData(dataSource, dataFormat,
JSON);
// Procure reference to single-series data and
// populate output JSON
data = dataJSON.data || [];
dataJSON.dataset = (dataset = [{
showInLegend: ZERO,
data: data
}]);
// Normalize color difference
if (dataJSON.chart.plotgradientcolor) {
plotGradientColor = COMMA +
dataJSON.chart.plotgradientcolor;
}
// Add multiseries categories
dataJSON.categories = [{
category: (categories = [])
}];
for (i = 0, l = data.length; i < l; i++) {
set = data[i];
categories[i] = {
label: set.label
};
set.color = colors[i % colorCount] + plotGradientColor;
delete set.label;
}
// Cosmetic modifications
dataJSON.chart.showlegend = "0"; // Hide Legend
...