在 ECharts 中,涟漪特效散点图的标域(visualMap)可以通过 visualMap 属性进行配置。VisualMap 用于映射数据到视觉元素,例如颜色,以便更清晰地表达数据信息。以下是一个包含涟漪特效的散点图以及 visualMap 的配置示例:
option = {
    title: {
        text: '涟漪特效散点图标域'
    },
    xAxis: {
        type: 'value',
        scale: true
    },
    yAxis: {
        type: 'value',
        scale: true
    },
    series: [
        {
            name: '散点图',
            type: 'scatter',
            data: [
                [10, 20, 50],
                [20, 50, 80],
                [30, 70, 120],
                [40, 30, 40],
                [50, 40, 90],
                // 更多数据点...
            ],
            symbolSize: 10,
            itemStyle: {
                color: 'blue'
            },
            emphasis: {
                label: {
                    show: true,
                    formatter: '{a}'
                }
            },
            // 涟漪动画配置
            rippleEffect: {
                period: 4,
                scale: 4,
                brushType: 'stroke'
            }
        }
    ],
    visualMap: {
        min: 0,
        max: 120,
        calculable: true,
        inRange: {
            color: ['blue', 'green', 'yellow', 'red'] // 颜色范围,可以根据实际需求调整
        },
        seriesIndex: 0 // visualMap 要映射的系列索引,这里是第一个系列
    }
};

在这个例子中,visualMap 用于配置映射规则:

  •  min: 映射的最小值。

  •  max: 映射的最大值。

  •  calculable: 是否显示拖拽用于调整映射值的控件。

  •  inRange: 颜色范围,可以根据实际需求调整。

  •  seriesIndex: visualMap 要映射的系列索引,这里是第一个系列。


这样,涟漪特效的散点图就根据数据的大小映射到了颜色上,提供了更直观的视觉体验。


转载请注明出处:http://www.zyzy.cn/article/detail/5412/ECharts