Javascript Highcharts Builder-Funktion

Question

Ich versuche, eine Funktion zu erstellen, die Highcharts Charts dynamisch basierend auf Parametern erstellt wird. Ich mache es folgendermaßen:

function makeChart(name, title, series) 
{ 
    var options = { 
    chart: { 
     type: 'areaspline', 
     renderTo: name 
    }, 
    credits: { enabled: false },   
    legend: { enabled: true }, 
    title: { 
     text: title 
    }, 
    xAxis: { 
     type: 'datetime' 
    }, 
    yAxis: {    
     gridLineDashStyle: 'dot',    
     title: {    
     text: 'Quantity' 
     } 
    }, 
    plotOptions: { 
     areaspline: {    
      animation: false,    
      stacking: '',    
      lineWidth: 1,    
      marker: { enabled: false }    
     } 
    }, 
    series: [] //chart does not display except title. It will draw if I paste the data here manually 
}; 
this.chart = new Highcharts.Chart(options); 
for (index = 0; index < series.length; ++index) { 

options.series[index] = {'name':series[index][0], 'data':series[index][1], 'color':series[index][2], 'fillOpacity': .3}; 
    } 
} 
makeChart('container2', 'second chart', [['thisisname1', [20,21,22,23,24,25,26,27,28], '#d8d8d8']]);//calling function with test parameters 

Aber alles, was ich sehen kann, ist der Titel der Charts. Ich schätze, das Problem besteht darin, Daten zum Serien-Array hinzuzufügen. Ich habe versucht, es mit mehreren Möglichkeiten hinzuzufügen, aber es hat nicht funktioniert, obwohl ich sehe, dass die Daten hinzugefügt wurden, wenn ich console.log (options.series). Irgendwelche Ideen wie das zu beheben? Vielen Dank.

Answer 1

Platz this.chart = new Highcharts.Chart(options); nach der for Schleife.

Sie fügen die Daten hinzu, nachdem das Diagramm initialisiert wurde. Um auf diese Weise zu arbeiten, müssen Sie HighCharts mitteilen, sich neu zu zeichnen. Einfachere Möglichkeit besteht darin, nach der Schleife zu initialisieren. :)