HighCharts dynamisch Diagrammtyp ändern

Question

Verwenden von HighCharts 2.2.3 in einer ASP.NET-Site. Siehe http://jsfiddle.net/wergeld/TDLvc/ für Codebeispiel. Meine Website-Setup ist ein wenig anders als das, was die jsFiddle zeigt. Meine Funktion zum Ändern der Serie existiert in einer eingeschlossenen JS-Datei und der Aufruf der Funktion ist nicht "in-line" mit dem Chart-Erstellungs-JS-Code (obwohl er immer noch in eine Dokument-bereit-Jquery verpackt ist).

Ich habe zwei Probleme und eine davon kann in der JsFiddle gesehen werden. 1) Beim Ändern des Diagrammtyps sieht es so aus, als ob die yAxis-Bezeichnung verloren geht. Sie sehen, dass ich ursprünglich 2 yAchsen habe und nachdem Sie den Diagrammtyp geändert haben, hat die obere Achse keine Wertelabels mehr (dh, die Diagrammdaten verwenden nur die untere Achse (erstes yAchse)). 2) Wenn dies unter FF oder IE läuft bekomme ich einen Fehler auf der Linie, die ruft:

data: serie.options.data 

Der Fehler ist: c Linie 55 in highcharts.js kein Konstruktor ist (dies ist die min -ed-Datei).

Mit highcharts.src.js Ich kann jetzt sehen, dass der Fehler ist: typeclass kein Konstruktor ist

Diese auf der Leitung 8789 in den src.js: serie = new typeclass();

Siehe aktualisiert jsFiddle: Wählen Sie Punkt als Diagrammtyp: http://jsfiddle.net/wergeld/nS4Ny/1/. Dies wird diesen Fehler auslösen.

Answer 1

Dieses Problem ist die Kapitalisierung unserer Drop-Down-Werte. Geändert die Überprüfung zu tun:

newType = newType.toLowerCase(); 

Jetzt Diagrammtyp Änderungen große Wirkung. Vollständige Code:

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

Für alle, die quer durch diese stolpert ... Sie müssen die Kartenserie von den letzten entfernen, um zuerst. Denken Sie auch daran, auf der letzten Serie neu zu zeichnen oder Ihre Änderungen werden nicht angezeigt :)

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