HighCharts动态更改图表类型

在ASP.NET网站中使用HighCharts 2.2.3。代码示例请参阅http://jsfiddle.net/wergeld/TDLvc/。我的网站设置与jsFiddle显示的有点不同。我的函数改变序列存在于一个包含的JS文件中，并且对该函数的调用与图表创建JS代码（尽管它仍然包装在一个准备好的jquery文档中）并不是“在线”的。HighCharts动态更改图表类型

我有两个问题，其中一个可以在jsFiddle中看到。 1）更改图表类型时，看起来yAxis标识会丢失。您可以看到我最初有2个yAxis，并且在更改图表类型后，顶部轴不再具有值标签（意味着图表数据仅使用底部轴（第一个yAxis））。 2）当FF或IE下运行此我得到调用线一个错误：

data: serie.options.data

错误是： c不是一个构造 55线在highcharts.js（这是分-ed文件）。

使用highcharts.src.js现在我可以看到，错误的是：类型类是不是构造

这是在src.js线8789：意甲=新类型类（）;

查看更新jsFiddle：select Point as chart type：http://jsfiddle.net/wergeld/nS4Ny/1/。这将抛出该错误。

来源

2012-05-18 wergeld

此问题是我们下拉值的大小写。更改要做的检查：

newType = newType.toLowerCase();

现在图表类型的变化很大的生效。全码：

function changeType(chart, series, newType) { 
     newType = newType.toLowerCase(); 
     for (var i = 0; i < series.length; i++) { 
      series = series[0]; 
      try { 
       series.chart.addSeries({ 
        type: newType, 
        stack: series.stack, 
        yaxis: series.yaxis, 
        name: series.name, 
        color: series.color, 
        data: series.options.data 
       }, 
       false); 
       series.remove(); 
      } catch (e) { 
       alert(newType & ': ' & e); 
      } 
     } 
    }

来源

2012-05-21 13:43:48 wergeld

如果您已共享更新的小提琴，那本来就不错。是饼图可能的选项。 – Rinzler

饼图可能是可能的 - 不是我们关心的，因为我们从来没有使用饼图。更新小提琴是没有必要的 - 因为我回答了我自己的问题，并在我的答案中给出了固定代码。 – wergeld

亚那好，但它会有所帮助，如果我可以切换饼图和柱状图与一些事件,, – Rinzler

对于任何人绊倒翻过这... 必须从过去的先删除图表系列。另外请记住在最后一个系列上重绘，否则您的更改将不会显示:)

function changeChartType(chart, type, redraw) { 
    var seriesOptions = new Array(chart.series.length); 
    for (var i = 0; i < chart.series.length; i++) { 
     var series = chart.series[i]; 
     seriesOptions[i] = { 
      type: type, 
      name: series.name, 
      color: series.color, 
      dashStyle: series.options.dashStyle, 
      lineWidth: series.options.lineWidth, 
      marker: series.options.marker, 
      dataLabels: series.options.dataLabels, 
      enableMouseTracking: series.options.enableMouseTracking, 
      data: series.options.data, 
      isRegressionLine: series.options.isRegressionLine 
     }; 
    } 
    for (var i = chart.series.length - 1; i >= 0; i--) { 
     chart.series[i].destroy(); 
    } 
    for (var i = 0; i < seriesOptions.length; i++) { 
     var newSeries = chart.addSeries(seriesOptions[i], redraw && i == seriesOptions.length - 1); 
    } 
    chart.currentType = type; 
}

来源

2015-03-11 15:10:34

HighCharts动态更改图表类型

回答

相关问题