HighCharts Cambia dinámicamente el tipo de gráfico

Question

Usando HighCharts 2.2.3 en un sitio ASP.NET. Ver http://jsfiddle.net/wergeld/TDLvc/ para el ejemplo de código. La configuración de mi sitio es un poco diferente de lo que muestra el jsFiddle. Mi función para cambiar la serie existe en un archivo JS incluido y la llamada a la función no está "en línea" con el código JS de creación de gráfico (aunque todavía está envuelto en un documento listo jquery).

Tengo dos problemas y uno de los cuales se puede ver en el jsFiddle. 1) Al cambiar el tipo de gráfico, parece que la designación yAxis se pierde. Puedes ver que originalmente tengo 2 ejes y después de cambiar el tipo de gráfico, el eje superior ya no tiene etiquetas de valores (significa que los datos del gráfico solo usan el eje inferior (primer eje y)). 2) Cuando se ejecuta esta por debajo de FF o IE me sale un error en la línea que llama:

data: serie.options.data 

El error es: c no es un constructor Línea 55 en highcharts.js (este es el mínimo archivo -ed).

Uso de highcharts.src.js ahora puedo ver que el error es: clase de tipos no es un constructor

Esto está en línea 8789 en los src.js: Serie = new clase de tipos();

Ver actualizado jsFiddle: seleccione Punto como tipo de gráfico: http://jsfiddle.net/wergeld/nS4Ny/1/. Esto lanzará ese error.

Answer 1

Este problema es la capitalización de nuestros valores desplegables. Cambió el cheque para hacer:

newType = newType.toLowerCase(); 

Ahora el tipo de gráfico cambia el efecto de la gran toma. código completo:

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); 
      } 
     } 
    } 

Answer 2

Para cualquier persona que se tropieza al otro lado de esta ... debe quitar la serie de cartas del último al primero. Recuerde también volver a dibujar en la última serie o sus cambios no se mostrarán :)

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; 
}