Highchart.js可變長度的輸入不起作用

此輸入將與highcharts工作得很好：Highchart.js可變長度的輸入不起作用

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

但這不會：

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

這裏唯一的區別是，在第一項目，還有一個數據點。爲什麼highchart無法從中創建boxplot？我想所有它需要生成像中值，四分位數和最小值和最大值的箱形圖也都在第二個數據集中。

這是我的代碼：

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

});

我怎樣才能解決這個問題？

來源

2017-11-11 Hasan Iqbal Anik

你能不能跟我們分享一些代碼嗎？ – Core972

我把你的代碼粘貼到jsfiddle。看起來'data1'不能在boxplot和'data2'中工作：http://jsfiddle.net/kkulig/yv8zdycg/ –

Highcharts接受兩種格式

號碼

陣列輸入數據
陣列對象

的特別是當它涉及到的圖像箱線圖，其需要多個值上繪製一個單個點這些方法圖將幫助您實現我們所需的。

以下是爲Boxplot做的兩種方式。 1.具有6或5個值的數組陣列。在這種情況下，值對應於X，低，Q1，中位數，Q3，高

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

與名爲值的對象的數組。

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"}]

所以在第一種方法，當一個額外的值出現在陣列被扭曲的，因此是你的圖。

如果您希望在繪圖中不需要的數據中具有額外的值，但是很重要，則可以使用第二種方法。

以下是您參考鏈接： API：https://api.highcharts.com/highcharts/series.boxplot.data Exaample：http://jsfiddle.net/fzwu1ods/

來源

2017-11-13 11:02:59 Strikers

Highchart.js可變長度的輸入不起作用

回答

相關問題