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動態更改圖表類型

回答

相關問題