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可变长度的输入不起作用

回答

相关问题