在 ECharts 中,分段型视觉映射组件(visualMap 的 type 为 'piecewise')也可以配置控制器(controller)来提供用户交互功能。控制器通常是一个用于选择分段区间的组件,例如滑动条。以下是一个分段型视觉映射组件配置控制器的示例:
option = {
    // 其他配置项...
    visualMap: {
        type: 'piecewise',  // 分段型 visualMap
        pieces: [
            { min: 0, max: 20, label: '0-20', color: 'blue' },
            { min: 20, max: 50, label: '20-50', color: 'green' },
            { min: 50, max: 80, label: '50-80', color: 'yellow' },
            { min: 80, max: 100, label: '80-100', color: 'red' }
        ],
        controller: {
            inRange: {
                color: ['blue', 'green', 'yellow', 'red']  // 控制器选定范围内的颜色映射
            },
            outOfRange: {
                color: ['gray']  // 控制器未选定范围内的颜色映射
            },
            show: true,  // 是否显示控制器
            orient: 'horizontal',  // 控制器的布局方向
            itemWidth: 20,  // 控制器项的宽度
            itemHeight: 10,  // 控制器项的高度
            // 其他控制器配置项...
        },
        // 其他配置项...
    },
    series: [{
        type: 'scatter',  // 其他系列配置...
        data: [
            { value: 10, name: 'A' },
            { value: 30, name: 'B' },
            { value: 60, name: 'C' },
            // 其他数据...
        ]
    }],
    // 其他配置项...
};

在上述示例中,controller 属性用于配置控制器的相关参数,包括选定范围内的颜色映射、未选定范围内的颜色映射、是否显示控制器、布局方向、控制器项的宽度和高度等。你可以根据实际需要调整这些配置项。

确保查看你所使用的 ECharts 版本的文档,获取准确的配置信息。此外,分段型视觉映射组件的控制器配置可能会在不同的 ECharts 版本中有所不同。


转载请注明出处:http://www.pingtaimeng.com/article/detail/5299/ECharts