echarts visualMap 无数据处理,为null置灰.

//gt:大于 gte:大于等于 lt：小于 lte：小于等于

function creatArr(cor, arr) {

    var result = [];

    var currentColor = cor;

    var previousValue = null;

    var nullCount = 0; // 新增计数器，用于跟踪连续null的数量



    for (var i = 0; i < arr.length; i++) {

        if (arr[i]) { // 如果当前元素不是 null

            if (nullCount > 0) { // 如果之前有连续的null

                if (previousValue) {

                    result.push({ "gte": previousValue, "lte": previousValue, "color": cor });

                }

                nullCount = 0; // 重置计数器

            }



            var currentValue = arr[i][0];

            if (previousValue !== null && previousValue + 1 !== currentValue) {

                currentColor = "#ccc";

                result.push({ "gt": previousValue, "lt": currentValue, "color": currentColor });

            } else {

                currentColor = cor;

                result.push({ "gte": previousValue, "lte": currentValue, "color": currentColor });

            }



            previousValue = currentValue;

        } else {

            nullCount++; // 当前元素为null，增加计数器

        }

    }



    return result;

}



var highArr = [[1, 110], null, null, [4, 110], null, [6, 178], [7, 158], [8, 158], [9, 158], [10, 158], null, null, [13, 158], [14, 127,], null, null, [17, 180], [18, 178], [19, 158], [20, 158], [21, 158], [22, 158], [23, 158], [24, 180], [25, 178], [26, 158], [27, 158], [28, 158], [29, 158], [30, 158]]

var lowArr = [[1, 70], null, null, [4, 100], null, [6, 158], [7, 138], [8, 148], [9, 128], [10, 188], null, null, [13, 128], [14, 147,], null, null, [17, 160], [18, 198], [19, 178], [20, 198], [21, 128], [22, 148], [23, 178], [24, 130], [25, 148], [26, 178], [27, 198], [28, 128], [29, 118], [30, 158]]

var piecesOne = creatArr('#0A84FF', dataArrLow)

var piecestwo = creatArr('#00C7BE', dataArrHigh)

myChart.setOption({

    visualMap: [{

        show: false,

        dimension: 0,

        seriesIndex: 0,

        pieces: piecesOne,

        backgroundColor: "red",

    }, {

        show: false,

        dimension: 0,

        seriesIndex: 1,

        pieces: piecestwo,

    }]

});