highcharts堆叠列和样条曲线混淆了yAxis显示

时间:2013-08-01 21:26:42

标签: highcharts stacked

我有一个带有堆叠列和2个样条的高图。主要yAxis重新表示堆叠列的y值,次要yAxis表示2个样条。看一下demo,其中一个样条曲线的y值未正确显示。如果将鼠标悬停在样条曲线上的点上,则可以看到数据正确但显示的y比例不正确。如果我注释掉“stacking:normal”设置,则样条线会正确显示。

http://jsfiddle.net/chicmob/w2Tux/

这是一个highcharts错误还是我忽略了一些其他设置?

        chart: {
        type: 'column'
    },
    xAxis: {
        categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
    },

    plotOptions: {
        series: {
            stacking: 'normal'
        }
    },
    yAxis: [{ // Primary yAxis
        min: 0,
        max: 400,
        tickInterval:100,
    }, { // Secondary yAxis
        min: -40,
        max: 100,
        tickInterval: 20,
        opposite : true,
    }],        

    series: [{
        yAxis : 0,
        data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]
    }, {
        yAxis : 0,
        data: [144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4, 29.9, 71.5, 106.4, 129.2]
    }, {    
        yAxis : 1,
        type : 'spline',
        data: [35, 60, 77, 56.7, 34, 55, 66, 72, 90, 45, 56, 60]
    } , {    
        yAxis : 1,
        type : 'spline',
        data: [24.3, 12, 41.2, 12.1, 4, 45, 31, 21.5, 9.3, 7.7, 13, 22]
    }]

1 个答案:

答案 0 :(得分:1)

您正在对所有系列应用堆叠:'正常'。当真的,你只想将它应用到第一个2系列。采取堆叠:plotOptions中的“正常”并将其放入第1个2系列中:

$('#container').highcharts({
    chart: {
        type: 'column'
    },
    xAxis: {
        categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
    },

    yAxis: [{ // Primary yAxis
        min: 0,
        max: 400,
        tickInterval:100
    }, { // Secondary yAxis
        min: -40,
        max: 100,
        tickInterval: 20,
        opposite : true
    }],        

    series: [{
        yAxis : 0,
        stacking: 'normal',
        data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]
    }, {
        yAxis : 0,
        stacking: 'normal',
        data: [144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4, 29.9, 71.5, 106.4, 129.2]
    }, {    
        yAxis : 1,
        type : 'spline',
        data: [35, 60, 77, 56.7, 34, 55, 66, 72, 90, 45, 56, 60]
    } , {    
        yAxis : 1,
        type : 'spline',
        data: [24.3, 12, 41.2, 12.1, 4, 45, 31, 21.5, 9.3, 7.7, 13, 22]
    }]
});

http://jsfiddle.net/w2Tux/2/