学习使用echart设置visualMap各个属性的值

本文详细整理了Echarts中visualMap组件的各种属性设置,包括颜色映射、连续性、离散型以及如何自定义视觉元素等,帮助读者更好地理解和使用visualMap进行数据可视化。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

学习使用echart设置visualMap各个属性的值

visualMap属性值整理

visualMap=[
//视觉映射组件,用于进行『视觉编码』,也就是将数据映射到视觉元素。视觉元素可以是:symbol: 图元的图形类别。symbolSize: 图元的大小。color: 图元的颜色。
 // colorAlpha: 图元的颜色的透明度。opacity: 图元以及其附属物(如文字标签)的透明度。colorLightness: 颜色的明暗度。colorSaturation: 颜色的饱和度。colorHue: 颜色的色调。
    {
   
        show:true, //是否显示 visualMap-continuous 组件。如果设置为 false,不会显示,但是数据映射的功能还存在
        type: 'continuous', // 定义为连续型 viusalMap
        min:10,  //指定 visualMapContinuous 组件的允许的最小值
        max:100, //指定 visualMapContinuous 组件的允许的最大值
        range:[15, 40],//指定手柄对应数值的位置。range 应在 min max 范围内
        calculable:true,  //是否显示拖拽用的手柄(手柄能拖拽调整选中范围)
        realtime:true,//拖拽时,是否实时更新
        inverse:false,//是否反转 visualMap 组件
        precision:0,  //数据展示的小数精度,默认为0,无小数点
        itemWidth:20, //图形的宽度,即长条的宽度。
        itemHeight:140,//图形的高度,即长条的高度。
        align:"auto", //指定组件中手柄和文字的摆放位置.可选值为:'auto' 自动决定。'left' 手柄和label在右。'right' 手柄和label在左。'top' 手柄和label在下。'bottom' 手柄和label在上。
        text:['High', 'Low'],  //两端的文本
        textGap:10, //两端文字主体之间的距离,单位为px
        dimension:2,  //指定用数据的『哪个维度』,映射到视觉元素上。『数据』即 series.data。 可以把 series.data 理解成一个二维数组,其中每个列是一个维度,默认取 data 中最后一个维度
        seriesIndex:1,//指定取哪个系列的数据,即哪个系列的 series.data,默认取所有系列
        hoverLink:true,//鼠标悬浮到 visualMap 组件上时,鼠标位置对应的数值 在 图表中对应的图形元素,会高亮
        inRange:{
     //定义 在选中范围中 的视觉元
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值