javascript - vue3+echart散点图？

Question

请问大佬们，当鼠标移动echarts散点图某个点的时候，当两个点数据重合了的时候，如何能够正确的将重合的点数据全部显示出来呢？
我通过tooltip下的formatter函数这样写的，但是显示出来的数据有错误？

错误显示：

正确的显示应该是 BDS：5,81,33。GALILEO：5,81,33。
请大佬们指点指点，谢谢！！！

Answer 1

formatter数据输出问题，再末尾加上
换行就OK

Answer 2

首先，你需要确保你的 ECharts 配置正确。在散点图（scatter）中，当两个点数据重合时，ECharts 默认是不会进行特殊处理的。你需要通过修改 series 配置中的 itemStyle 来改变点的形状或大小，使其能够区分出重合的点。

至于 tooltip 的显示问题，你应该是在 formatter 函数中对数据的处理有误。你可能需要检查你的 formatter 函数，确保它能够正确地处理你的数据。

以下是一个基本的 ECharts 散点图配置示例：

option = {    tooltip: {        trigger: 'axis',        formatter: function(params) {            var res = params[0].name;            for (var i = 0, l = params.length; i < l; i++) {                res += '<br/>' + params[i].seriesName + ' : ' + params[i].value;            }            return res;        }    },    legend: {        data:['A','B']    },    xAxis: {},    yAxis: {},    series: [{        name: 'A',        type: 'scatter',        coordinateSystem: 'xy',        data: [[1, 'A1'], [2, 'A2'], [3, 'A3']],        symbolSize: 20, // 这里可以设置点的大小，防止重合        itemStyle: {            normal: {                color: 'red', // 这里可以设置点的颜色，使其在视觉上有所区分            }        },    }, {        name: 'B',        type: 'scatter',        coordinateSystem: 'xy',        data: [[1, 'B1'], [2, 'B2'], [3, 'B3']], // 请确保你的数据格式正确，比如这里的 'B1' 等字符串需要对应到实际的数值    }]};

这是一个基本的示例，你需要根据你的具体需求进行修改。例如，你可能需要调整点的颜色、大小，或者调整 tooltip 的显示格式等。如果你还有任何问题，欢迎继续提问。