Chart JS - 气泡图重叠

问题描述

我正在使用图表 js（气泡图）。在某些情况下，坐标（x，y）彼此重叠。 我尝试并找到了许多解决方案。我发现的一种解决方案是由插件（抖动效果插件）完成的，但只有当两个气泡重叠时才有效。 这是两个气泡重叠时的代码。

var jitterEffectPlugin = {
    beforeDatasetDraw: function (ctx,args) {
        if (ctx.animating) {
            var _args = args,dataIndex = _args.index,Meta = _args.Meta;
            var points = Meta.data.map(function (el) {
                return {
                x: el._model.x,y: el._model.y
                };
            });
            var dsLength = ctx.data.datasets.length;
            var adjustedMap = []; // keeps track of adjustments to prevent double offsets

            for (var datasetIndex = 0; datasetIndex < dsLength; datasetIndex += 1) {
                if (dataIndex !== datasetIndex) {
                var datasetMeta = ctx.getDatasetMeta(datasetIndex);
                datasetMeta.data.forEach(function (el) {
                    var overlapFilter = points.filter(function (point) {
                    return point.x === el._model.x && point.y === el._model.y;
                    });

                    var overlap = false;
                    var overObj = JSON.parse(JSON.stringify(overlapFilter));
                    for (var i = 0; i < overObj.length; i++) {
                        if(overObj[i]['x'] === el._model.x && overObj[i]['y'] === el._model.y){
                        overlap = true;
                        break;
                        }
                    }
                    if (overlap) {
                    var adjusted = false;
                    var adjustedFilter = adjustedMap.filter(function (item) {
                        return item.datasetIndex === datasetIndex && item.dataIndex === dataIndex;
                    });
                    var adjObj = JSON.parse(JSON.stringify(adjustedFilter));
                        for (var i = 0; i < adjObj.length; i++) {
                            if(adjObj[i]['datasetIndex'] === datasetIndex && adjObj[i]['dataIndex'] === dataIndex){
                            adjusted = true;
                            break;
                            }
                        }

                    if (!adjusted && datasetIndex % 2) {
                        el._model.x += 15;
                    } else {
                        el._model.x -= 15;
                    }

                    adjustedMap.push({
                        datasetIndex: datasetIndex,dataIndex: dataIndex
                    });
                    }
                });
                }
            }
        }
    }
}

Chart.pluginService.register(jitterEffectPlugin);

如果有两个以上的气泡重叠，有什么解决办法吗？

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）