highstock - Live plot with multiple y axis in highcharts -


i have created live line chart multiple y-axis.on-click of legends,creating y- axis.

here demo http://jsfiddle.net/ashwinp/j7lmp/3/

first thing, not showing scale values on each y axis,just showing title.

second thing,

i used linkedto -- > inheriting primary y axis.

here demo http://jsfiddle.net/ashwinp/j7lmp/4/

here, want each y axis should have own scaling. should not inherit scaling primary y axis.

y axis should scale depending upon value of own series.

for example : series1 values falls between 1 100 may go beyond 100 time should auto scale. series2 : 200- 500 , series3: 600 1000

in case: yaxis1 min 1 , max 100 , y axis2 : 200-500 y axis3:600-1000

i used min , max , tick interval auto re-sizing when values goes beyond.used setextrem workaround solution.

thanks in advance

$(function () {     $(document).ready(function () {             rawdatachartwithmultiyaxis();       });    });   function addaxes(name, visiblity, index) {     var chart = $('#container').highcharts(); if (visiblity == "hidden") {     chart.addaxis({         id: name,         title: {             text: name         },                     linewidth: 2,         linecolor: '#08f',         labels: {             format: '{value} ' + chart.series[index].tooltipoptions.valuesuffix,             style: {                 color: '#4572a7'             }         },         opposite: false,         linkedto:0     });    } else {     chart.get(name).remove();   } }   function rawdatachartwithmultiyaxis() {     var = 0;     new highcharts.chart({     chart: {         renderto: 'container',         type: 'line',         alignticks: true,         animation: highcharts.svg, // don't animate in old ie         events: {             load: function () {                 // set updating of chart each second                                     var series = this.series[0];                 var series1 = this.series[1];                 var series2 = this.series[2];                                   setinterval(function () {                                            var shift = series.data.length > 10;                                             var x = a++, // current time                                                               y = parsefloat(math.random());                     y1 = parsefloat(math.random() * 100);                     y2 = parsefloat(math.random() * 1000);                     series.addpoint([x, y], true, shift);                     series1.addpoint([x, y1], true, shift);                     series2.addpoint([x, y2], true, shift);                 }, 1000);             }         }     }, plotoptions: {         series: {             animation: true,             events: {                 click: function () {                 },                 legenditemclick: function (event) {                     var visibility = this.visible ? 'visible' : 'hidden';                     addaxes(this.name, visibility, this.index);                 }             }         }     },     tooltip: {         shared: true     },     yaxis: {         title: {             text: 'x1'         },         linewidth: 2,         linecolor: '#f33'     },     legend: {         enabled: true     },     series: [{         name: 'x1',         data: [],         tooltip: { valuesuffix: " qsu" }     }, {         name: 'x2',         data: [],         visible: false,         tooltip: { valuesuffix: " ms/cm" }     }, {         name: 'x3',         data: [],         visible: false,         tooltip: { valuesuffix: " celcius" }     }] });   } 

scale not displayed because serie not related axis. in other words, have scale, need have linked serie yaxis

http://api.highcharts.com/highcharts#series.yaxis


Comments

Popular posts from this blog

javascript - Count length of each class -

What design pattern is this code in Javascript? -

hadoop - Restrict secondarynamenode to be installed and run on any other node in the cluster -