Echarts 在盒须图上显示错误数据答案

【问题标题】：Echarts shows wrong data on box and whisker plotEcharts 在盒须图上显示错误数据
【发布时间】：2021-06-17 06:21:05
【问题描述】：

我正在尝试使用 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);

请帮我解决这个问题。谢谢

【问题讨论】：

标签： javascript echarts

【解决方案1】：

最大值没有错，它是由这个公式计算的：最大值 = Q3 + (1.5 * IRQ) 并且 IRQ 是 (Q3 - Q1)。高于此计算最大值的其余值是异常值。此外，最小值的计算公式为：Q3 - (1.5 * IRQ)，其余低于计算最小值的值为异常值。

【讨论】：