Highchart.js variabler Länge Eingabe funktioniert nicht

Question

Dieser Eingang mit highcharts funktionieren würde:

data1 = [[2, 3, 3.5, 4], [1, 1.5, 2, 3]] 

aber das wird nicht:

data2 = [[2, 3, 3.5, 4, 4.5], [1, 1.5, 2, 3]] 

Hier ist der einzige Unterschied ist, dass in der ersten Element, gibt es einen weiteren Datenpunkt. Warum würde Highchart keinen Boxplot daraus machen? Ich denke, alles, was man braucht, um einen Boxplot wie Median, Quartile und Minimum und Maximum zu erzeugen, ist auch im zweiten Datensatz vorhanden.

Dies ist mein Code:

dt = [ 
    [760, 801, 848, 895, 930], 
    [733, 853, 939, 980, 1080], 
    [714, 762, 817, 870, 918], 
    [724, 802, 806, 871, 950], 
    [834, 836, 864, 882, 910] 
]; 


Highcharts.chart('boxcontainer', { 

    chart: { 
    type: 'boxplot' 
    }, 

    title: { 
    text: 'Highcharts box plot styling' 
    }, 

    legend: { 
    enabled: false 
    }, 

    xAxis: { 
    categories: ['1', '2', '3', '4', '5'], 
    title: { 
     text: 'Experiment No.' 
    } 
    }, 

    yAxis: { 
    title: { 
     text: 'Observations' 
    } 
    }, 

    plotOptions: { 
    boxplot: { 
     fillColor: '#F0F0E0', 
     lineWidth: 2, 
     medianColor: '#0C5DA5', 
     medianWidth: 3, 
     stemColor: '#A63400', 
     stemDashStyle: 'dot', 
     stemWidth: 1, 
     whiskerColor: '#3D9200', 
     whiskerLength: '20%', 
     whiskerWidth: 3 
    } 
    }, 

    series: [{ 
    name: 'Observations', 
    data: dt 
    }] 

}); 

Wie kann ich dieses Problem lösen?

Answer 1

Highcharts akzeptiert Eingabedaten in zwei Formaten

1. Array von Zahlen
2. Array von Objekten

Insbesondere wenn es um die Graphen kommt wie boxplot, die mehrere Werte müssen auf einen einzigen Punkt plotten Die Grafik diese Ansätze werden Ihnen helfen, das zu erreichen, was wir brauchen.

Hier sind die 2 Möglichkeiten für Boxplot. 1. Ein Array von Arrays mit 6 oder 5 Werten. In diesem Fall entsprechen die Werte x, niedrig, q1, Median, q3, hohe

data: [ 
    [0, 3, 0, 10, 3, 5], 
    [1, 7, 8, 7, 2, 9], 
    [2, 6, 9, 5, 1, 3] 
] 

2. Ein Array von Objekten mit dem Namen Werten.

   data: [{ 
   x: 1, 
   low: 4, 
   q1: 9, 
   median: 9, 
   q3: 1, 
   high: 10, 
   name: "Point2", 
   color: "#00FF00"},{ 
   x: 1, 
   low: 5, 
   q1: 7, 
   median: 3, 
   q3: 6, 
   high: 2, 
   name: "Point1", 
   color: "#FF00FF"}] 
   

So im ersten Ansatz, wenn ein Mehrwert erscheint in der Anordnung verzerrt und daher ist Ihr Diagramm.

Wenn Sie in den Daten, die für das Plotten nicht benötigt werden, jedoch zusätzliche Werte benötigen, aber wichtig sind, können Sie mit dem zweiten Ansatz fortfahren.

Hier sind die Links für Ihre ref: API: https://api.highcharts.com/highcharts/series.boxplot.data Exaample: http://jsfiddle.net/fzwu1ods/