FusionCharts - Log MS Line Chart in JavaScript
Created using FusionCharts Suite XT - www.fusioncharts.com
by Ayan Bhadury
HTML
<script src="http://static.fusioncharts.com/code/latest/fusioncharts.powercharts.js"></script>
<script src="http://static.fusioncharts.com/code/latest/fusioncharts.js"></script>
<script src="http://static.fusioncharts.com/code/latest/fusioncharts.charts.js"></script>
<!-- This example showcases Logrithmic line chart and plots total number of footfalls vs online visits for last year -->
<div id="chart-container">FusionCharts will render here</div>
JavaScript
FusionCharts.ready(function () {
var visitChart = new FusionCharts({
id: "mychart",
type: 'msline',
renderAt: 'chart-container',
width: '550',
height: '400',
dataFormat: 'json',
dataSource: {
"chart": {
"caption": "logchartCaption",
"subCaption": "",
"xAxisName": "Percentile (%)",
"yAxisName": "PEC (µg/l)",
"paletteColors": "#e44a00",
"captionFontSize": "16",
"baseFontColor": "#333333",
"baseFont": "Trebuchet MS",
"baseFontSize": "12",
"bgAlpha": "0",
"canvasBorderAlpha": "0",
"LegendShadow": "0",
"legendBorderAlpha": "0",
"showXAxisLine": "1",
"showValues": "0",
"showBorder": "0",
"decimals": "5",
"labelDisplay": "none",
"base": "10",
"axisLineAlpha": "10",
"divLineAlpha": "10",
"yAxisValueDecimals": "5",
"yAxisMinValue": "0",
"yAxisMaxValue": "0.02",
"showLegend": "0"
},
"categories": [
{
"category": [
{ "label": "0", "showverticalline": "1" },
{ "label": "1", "showlabel": "0", "showverticalline": "0" },
{ "label": "2", "showlabel": "0", "showverticalline": "0" },
{ "label": "3", "showlabel": "0", "showverticalline": "0" },
{ "label": "4",...