动态更改Highcharts数据系列类型

时间:2022-06-17 15:41:16

I have Highcharts with multiple series and 'select' for each series. My aim is to change series type via 'select'.

我有多个系列的Highcharts和每个系列的“选择”。我的目标是通过'select'改变系列类型。

$('#ChType').change(function () {
    var series = chart.series[0]
    var newType = $('#ChType').val();
    changeType(series, newType);
})

$('#ChType2').change(function () {
    var series = chart.series[1]
    var newType = $('#ChType2').val();
    changeType(series, newType);
})

function changeType(series, newType) {
    var dataArray = [],
        points = series.data;
    series.chart.addSeries({
        type: newType,
        name: series.name,
        color: series.color,
        data: series.options.data
    }, false);
    alert(series.name);
    series.remove();
}

I understand that every time the type gets changed, series will get removed from it's current position in an array and added to the end. Currently I'm able to change only the series that is in the position series[0].

据我所知,每次更改类型时,系列都会从数组中的当前位置移除并添加到结尾。目前我只能更改位置系列[0]中的系列。

How can I change any other series and not just the series[0]?

如何更改任何其他系列而不仅仅是系列[0]?

I did see the similar question here but couldn't quite get it to work.

我确实在这里看到了类似的问题但却无法让它发挥作用。

My sample code in jsFiddle.

我在jsFiddle中的示例代码。

2 个解决方案

#1


16  

You can use v3.0 highcharts included series.update() method, which allows to change type of chart, dynamically.

您可以使用包含series.update()方法的v3.0 highcharts,它允许动态更改图表类型。

http://jsfiddle.net/8Sg8K/1

http://jsfiddle.net/8Sg8K/1

chart.series[0].update({
                type: "column"
            });

#2


0  

Why didn't you include the loop that you linked to in the similar question?

为什么不在相似的问题中包含您链接的循环?

 $('#ChType').change(function(){
     var series;

     for ( i = 0 ; i < chart.series.length ; i++ ) {
            if ( chart.series[i].name == 'MyData1' ) {
                series = chart.series[i];

            }                
        } 
                 //var series = chart.series[0]
                 var newType = series.type == $('#ChType').val() ? $('#ChType').val()

Put that in place for each type - http://jsfiddle.net/waBck/5/

把它放在每种类型的位置 - http://jsfiddle.net/waBck/5/

#1


16  

You can use v3.0 highcharts included series.update() method, which allows to change type of chart, dynamically.

您可以使用包含series.update()方法的v3.0 highcharts,它允许动态更改图表类型。

http://jsfiddle.net/8Sg8K/1

http://jsfiddle.net/8Sg8K/1

chart.series[0].update({
                type: "column"
            });

#2


0  

Why didn't you include the loop that you linked to in the similar question?

为什么不在相似的问题中包含您链接的循环?

 $('#ChType').change(function(){
     var series;

     for ( i = 0 ; i < chart.series.length ; i++ ) {
            if ( chart.series[i].name == 'MyData1' ) {
                series = chart.series[i];

            }                
        } 
                 //var series = chart.series[0]
                 var newType = series.type == $('#ChType').val() ? $('#ChType').val()

Put that in place for each type - http://jsfiddle.net/waBck/5/

把它放在每种类型的位置 - http://jsfiddle.net/waBck/5/