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: 'logmsline',
renderAt: 'chart-container',
width: '550',
height: '400',
dataFormat: 'json',
dataSource: {
"chart": {
"caption": "Results by Scenario",
"subCaption": "",
"xAxisName": "Percentile",
"yAxisName": "PEC",
"paletteColors": "#008ee4,#6baa01,#e44a00",
"bgAlpha": "0",
"borderAlpha": "20",
"canvasBorderAlpha": "0",
"LegendShadow": "0",
"legendBorderAlpha": "0",
"showXAxisLine": "1",
"showValues": "0",
"showBorder": "0",
"showAlternateHgridColor": "0",
"base": "10",
"axisLineAlpha": "10",
"divLineAlpha": "10",
//"yAxisMinValue": "0.0001",
"yAxisValueDecimals": "5",
"toolTipColor": "#ffffff",
"toolTipBorderThickness": "0",
"toolTipBgColor": "#000000",
"toolTipBgAlpha": "80",
"toolTipBorderRadius": "2",
"toolTipPadding": "5",
//"minimizeTendency": "0"
},
"categories": [
{
"category": [
{
"label": "0",
"showverticalline": "1"
},
{
"label": "10",
"showlabel":"0",
...