Echarts 在盒须图上显示错误数据
Echarts shows wrong data on box and whisker plot
我正在尝试用 Echarts 框架制作一个盒须图,我想在绘图的第一个盒子上显示这个数组:
disorderValuesArray = [0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0.13 ,0.13 ,0.13 ,0.13 ,0.13 ,0.13 ,0.13 ,0.13 ,0.13 ,0.13 ,0.13 , 0.13 , 0.13 , 0.13 , 0.13 , 0.13 , 0.13 , 0.13 , 0.13 , 0.13 , 0.13 , 0.13 , 0.13 , 0.13 , 0.13 , 0.13 , 0.13 , 0.13 , 0.13 , 0.13 , 0.13 , 0.13 , 0.13 , 0.13 , 0.25 , 0.25 , 0.25 , 0.25 , 0.25 , 0.25 , 0.25 , 0.25 , 0.25 , 0.25 , 0.25 , 0.25 , 0.25 , 0.25 , 0.25 , 0.25 , 0.25 , 0.25 , 0.25 , 0.25 , 0.25 , 0.25 , 0.25 , 0.25 , 0.25 , 0.25 , 0.25 , 0.25 , 0.25 , 0.25 , 0.25 , 0.25 , 0.25 , 0.25 , 0.25 , 0.38 , 0.38 , 0.38 , 0.38 , 0.38 , 0.38 , 0.38 , 0.38 , 0.38 , 0.38 , 0.38 , 0.38 , 0.38 , 0.38 , 0.38 , 0.38 , 0.38 , 0.38 , 0.38 , 0.5 , 0.5 , 0.5 , 0.5 , 0.5 , 0.5 , 0.5 , 0.5 , 0.5 , 0.5 , 0.5 , 0.5 , 0.5 , 0.5 , 0.5 , 0.5 , 0.5 , 0.5 , 0.5 , 0.5 , 0.5 , 0.5 , 0.63 , 0.63 , 0.63 , 0.63 , 0.63 , 0.63 , 0.63 , 0.63 , 0.63 , 0.63 , 0.63 , 0.63 , 0.75 , 0.75 , 0.75 , 0.75 , 0.75 , 0.75 , 0.75 , 0.75 , 0.75 , 0.75 , 0.88 , 0.88 , 0.88 , 0.88 , 0.88 , 0.88 , 1 , 1 , 1 , 1 , 1 , 1 , 1 , 1 , 1.13 , 1.13 , 1.13 , 1.13 , 1.13 , 1.13 , 1.13 , 1.13 , 1.13 , 1.25 , 1.25 , 1.25 , 1.25 , 1.25 , 1.38 , 1.38 , 1.38 , 1.38 , 1.38 , 1.5 , 1.5 , 1.5 , 1.5 , 1.5 , 1.5 , 1.57 , 1.63 , 1.75 , 1.75 , 1.75 , 1.75 , 2 , 2 , 2 , 2 , 2.38 , 2.5 , 2.5 , 2.5 , 2.5 , 2.63];
问题是工具提示中的最大值为 1.57,而顶部胡须在位置 1.57 处结束,而我在 disorderValuesArray 中的最大值为 2.63,但中线位置是正确的,它是 0.25。
disorderValuesArray box plot
所以我尝试使用这个数组:
testArray = [0, 0, 0, 1, 1, 2, 3, 4, 4, 4, 5, 6, 7, 7, 7, 7];
在这种情况下,绘图是正确的,它在工具提示中显示正确的最大值,最大位置也是正确的。
testArray box plot
这是我的代码:
function makeData() {
var data = [];
for (var i = 0; i < 9; i++) {
var cate = [];
for (var j = 0; j < 276; j++) {
cate.push(Math.random() * 4);
}
cate.sort(function(a,b) { return a-b;});
data.push(cate);
}
return data;
}
var data0 = makeData();
var data1 = makeData();
var data2 = makeData();
data0[0] = disorderValuesArray;
option = {
title: {
text: 'Multiple Categories',
left: 'center'
},
dataset: [{
source: data0
}, {
source: data1
}, {
source: data2
}, {
fromDatasetIndex: 0,
transform: { type: 'boxplot' }
}, {
fromDatasetIndex: 1,
transform: { type: 'boxplot' }
}, {
fromDatasetIndex: 2,
transform: { type: 'boxplot' }
}],
legend: {
top: '10%'
},
tooltip: {
trigger: 'item',
axisPointer: {
type: 'shadow'
}
},
grid: {
left: '10%',
top: '20%',
right: '10%',
bottom: '15%'
},
xAxis: {
type: 'category',
boundaryGap: true,
nameGap: 30,
splitArea: {
show: true
},
splitLine: {
show: false
}
},
yAxis: {
type: 'value',
name: 'Value',
min: 0,
max: 7,
splitArea: {
show: false
}
},
series: [{
name: 'category0',
type: 'boxplot',
datasetIndex: 3
}, {
name: 'category1',
type: 'boxplot',
datasetIndex: 4
}, {
name: 'category2',
type: 'boxplot',
datasetIndex: 5
}]
};
var chartDom = document.getElementById('disorder-box-plot');
var myChart = echarts.init(chartDom);
myChart.setOption(option);
请帮我解决这个问题。谢谢
最大值没有错是用这个公式计算出来的:
最大值 = Q3 + (1.5 * IRQ)
IRQ 是 (Q3 - Q1)。其余高于此计算最大值的值是异常值。此外,最小值的计算公式为:Q3 - (1.5 * IRQ),其余低于计算出的最小值的值是异常值。
我正在尝试用 Echarts 框架制作一个盒须图,我想在绘图的第一个盒子上显示这个数组:
disorderValuesArray = [0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0.13 ,0.13 ,0.13 ,0.13 ,0.13 ,0.13 ,0.13 ,0.13 ,0.13 ,0.13 ,0.13 , 0.13 , 0.13 , 0.13 , 0.13 , 0.13 , 0.13 , 0.13 , 0.13 , 0.13 , 0.13 , 0.13 , 0.13 , 0.13 , 0.13 , 0.13 , 0.13 , 0.13 , 0.13 , 0.13 , 0.13 , 0.13 , 0.13 , 0.13 , 0.25 , 0.25 , 0.25 , 0.25 , 0.25 , 0.25 , 0.25 , 0.25 , 0.25 , 0.25 , 0.25 , 0.25 , 0.25 , 0.25 , 0.25 , 0.25 , 0.25 , 0.25 , 0.25 , 0.25 , 0.25 , 0.25 , 0.25 , 0.25 , 0.25 , 0.25 , 0.25 , 0.25 , 0.25 , 0.25 , 0.25 , 0.25 , 0.25 , 0.25 , 0.25 , 0.38 , 0.38 , 0.38 , 0.38 , 0.38 , 0.38 , 0.38 , 0.38 , 0.38 , 0.38 , 0.38 , 0.38 , 0.38 , 0.38 , 0.38 , 0.38 , 0.38 , 0.38 , 0.38 , 0.5 , 0.5 , 0.5 , 0.5 , 0.5 , 0.5 , 0.5 , 0.5 , 0.5 , 0.5 , 0.5 , 0.5 , 0.5 , 0.5 , 0.5 , 0.5 , 0.5 , 0.5 , 0.5 , 0.5 , 0.5 , 0.5 , 0.63 , 0.63 , 0.63 , 0.63 , 0.63 , 0.63 , 0.63 , 0.63 , 0.63 , 0.63 , 0.63 , 0.63 , 0.75 , 0.75 , 0.75 , 0.75 , 0.75 , 0.75 , 0.75 , 0.75 , 0.75 , 0.75 , 0.88 , 0.88 , 0.88 , 0.88 , 0.88 , 0.88 , 1 , 1 , 1 , 1 , 1 , 1 , 1 , 1 , 1.13 , 1.13 , 1.13 , 1.13 , 1.13 , 1.13 , 1.13 , 1.13 , 1.13 , 1.25 , 1.25 , 1.25 , 1.25 , 1.25 , 1.38 , 1.38 , 1.38 , 1.38 , 1.38 , 1.5 , 1.5 , 1.5 , 1.5 , 1.5 , 1.5 , 1.57 , 1.63 , 1.75 , 1.75 , 1.75 , 1.75 , 2 , 2 , 2 , 2 , 2.38 , 2.5 , 2.5 , 2.5 , 2.5 , 2.63];
问题是工具提示中的最大值为 1.57,而顶部胡须在位置 1.57 处结束,而我在 disorderValuesArray 中的最大值为 2.63,但中线位置是正确的,它是 0.25。 disorderValuesArray box plot 所以我尝试使用这个数组:
testArray = [0, 0, 0, 1, 1, 2, 3, 4, 4, 4, 5, 6, 7, 7, 7, 7];
在这种情况下,绘图是正确的,它在工具提示中显示正确的最大值,最大位置也是正确的。 testArray box plot 这是我的代码:
function makeData() {
var data = [];
for (var i = 0; i < 9; i++) {
var cate = [];
for (var j = 0; j < 276; j++) {
cate.push(Math.random() * 4);
}
cate.sort(function(a,b) { return a-b;});
data.push(cate);
}
return data;
}
var data0 = makeData();
var data1 = makeData();
var data2 = makeData();
data0[0] = disorderValuesArray;
option = {
title: {
text: 'Multiple Categories',
left: 'center'
},
dataset: [{
source: data0
}, {
source: data1
}, {
source: data2
}, {
fromDatasetIndex: 0,
transform: { type: 'boxplot' }
}, {
fromDatasetIndex: 1,
transform: { type: 'boxplot' }
}, {
fromDatasetIndex: 2,
transform: { type: 'boxplot' }
}],
legend: {
top: '10%'
},
tooltip: {
trigger: 'item',
axisPointer: {
type: 'shadow'
}
},
grid: {
left: '10%',
top: '20%',
right: '10%',
bottom: '15%'
},
xAxis: {
type: 'category',
boundaryGap: true,
nameGap: 30,
splitArea: {
show: true
},
splitLine: {
show: false
}
},
yAxis: {
type: 'value',
name: 'Value',
min: 0,
max: 7,
splitArea: {
show: false
}
},
series: [{
name: 'category0',
type: 'boxplot',
datasetIndex: 3
}, {
name: 'category1',
type: 'boxplot',
datasetIndex: 4
}, {
name: 'category2',
type: 'boxplot',
datasetIndex: 5
}]
};
var chartDom = document.getElementById('disorder-box-plot');
var myChart = echarts.init(chartDom);
myChart.setOption(option);
请帮我解决这个问题。谢谢
最大值没有错是用这个公式计算出来的: 最大值 = Q3 + (1.5 * IRQ) IRQ 是 (Q3 - Q1)。其余高于此计算最大值的值是异常值。此外,最小值的计算公式为:Q3 - (1.5 * IRQ),其余低于计算出的最小值的值是异常值。