Geek asks and answers

Adding Y-axis dynamically

Can I add a new y axis to the Highstock diagram? I tried adding it to the parameters and redrawing, but this does not work.

The documentation for HighCharts contains the addAxis () function for the chart object, but this function does not exist in HighStock. Any alternatives?

+5
source share
3 answers

Please take a look at the example http://jsfiddle.net/wvaGt/

$('#container').highcharts('StockChart',{


    yAxis: {
        title: {
            text: 'Temperature'
        },
        lineWidth: 2,
        lineColor: '#F33'
    },

    series: [{
        name: 'Temperature',
        data: [7.0, 6.9, 9.5, 14.5, 18.2, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6],
        color: '#F33'   
    }]
});

// the button handlera
var chart = $('#container').highcharts();
$('#add').click(function() {
    chart.addAxis({ // Secondary yAxis
        id: 'rainfall-axis',
        title: {
            text: 'Rainfall'
        },
        lineWidth: 2,
        lineColor: '#08F',
        opposite: true
    });
    chart.addSeries({
        name: 'Rainfall',
        type: 'column',
        color: '#08F',
        yAxis: 'rainfall-axis',
        data: [49.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]
    });
});
+8
source

corresponding jsfiddle

yAxis: [{
        labels: {
            format: '{value} %'
        },
        min: 0,
        max: 60,
        opposite: false
}],
+2
source

The newest version of HighStock, currently 1.3.0, has added support for addAxis. It was released on March 22, 2013.

0
source

More articles:


All Articles