Echarts标识出曲线中坐标重合的点（找出json中重复的值）

问题描述：单独标出每个图中坐标重合的点，便于H5端查看

• 绘制图表工具：Echarts

• Echarts官方文档：echarts.apache.org/zh/index.ht…

• 最终效果预览：

• 解决思路：将多个数组合并到同一数组中，再遍历出x与y完全相等的坐标点，添加到数组中，最后将所有坐标点一同添加到series中 =>

• 关键代码：

//找出JSON中重复项关键代码
function getRepeatData(data) {
    if (data) {
        let result = [];
        let obj = {};
        for (let i = 0; i < data.length; i++) {
            const el = data[i];
            for (let y = i + 1; y < data.length; y++) {
                const val = data[y];
                    if (el.x == val.x && el.y == val.y) {//找出x与y值均重复的对象
                    if (!obj[el.id]) {
                        result.push(el)
                        obj[el.id] = true
                    }
                    if (!obj[val.id]) {
                        result.push(val)
                        obj[val.id] = true
                    }
                }
            }
        }
        return result
    }
}

//处理接口返回的JSON数组数据lineNameList
  lineNameList.forEach((e, index) => {
        let dataList = [];
        let crossArr = [];
        for (let i in curveChartData) {
            if (i.includes(e)) {
                //坐标点汇总
                dataList.push(curveChartData[i])
                //合并数组
                crossArr.push.apply(crossArr, curveChartData[i]);
            }
        }
        //获取坐标重合点
        let crosspoints = getRepeatData(crossArr);
        //将重合点坐标添加到dataList中
        dataList.push(crosspoints);
        console.log(dataList);
        console.log(crossArr);
         let option = {
            //标题	
            title: {
                text: e,
                left: 5,
                top: 5,
            },
            tooltip: {
                trigger: 'item',
                axisPointer: {
                    type: 'cross',
                    label: {
                        backgroundColor: '#6a7985'
                    }
                },
            },
            grid: {
                show: true,
                width: '85%',
                height: '70%',
            },
            toolbox: {
                feature: {
                    saveAsImage: {
                        title: "保存"
                    }
                }
            },
            xAxis: {
                type: 'value',
                splitNumber: 8,
                axisLabel: { rotate: 30 },
                scale: true,
                splitLine: {
                    show: true,
                    lineStyle: {
                        color: '#333333'
                    }
                }
            },
            yAxis: {
                type: 'value',
                splitNumber: 8,
                scale: true,
                splitLine: {
                    show: true,
                    lineStyle: {
                        color: '#333333'
                    }
                }
            },
            series: [
            ],
            backgroundColor: "#EAEBF0"
        };
        let len = dataList.length;
        dataList.forEach((item, index) => {
            option.series.push({
            //重合的坐标点放在最后，只显示点type设置为effectScatter，不显示线
                type: index == len - 1 ?'effectScatter':'line',
                smooth: true,
                name: PageBomObj.scheme === "常规泵" ? item.lineChildName : e,
            })
            option.series[index].data = item.map(item => { return [item.x, item.y] });
        })
       
        //创建dom容器
        $(".curve-chart").append(`<div id=curve-chart-main-${index} ></div>`);
        //获取dom容器
        let myChart = echarts.init(document.getElementById("curve-chart-main-" + index));
        // 使用指定的配置项和数据显示图表
        myChart.setOption(option);
    })

• 若要绘制线相交的点 网上参考：blog.csdn.net/qq_35436516…