echarts 标尺相关参数(visualMap属性设置)

简介: echarts 标尺相关参数(visualMap属性设置)

echarts 标尺相关参数(visualMap属性设置)


一、效果图

二、设置代码

visualMap: {
                min: 0,
                max: 350,
                text: ['High', 'Low'],//两端的文本
                realtime: false,
                calculable: true,
                itemWidth: 20, //图形的宽度,即长条的宽度。
                itemHeight: 90, //图形的高度,即长条的高度。
                align: "auto", //指定组件中手柄和文字的摆放位置.可选值为:‘auto’ 自动决定。‘left’ 手柄和label在右。‘right’ 手柄和label在左。‘top’ 手柄和label在下。‘bottom’ 手柄和label在上。
                left: "80%", //组件离容器左侧的距离,‘left’, ‘center’, ‘right’,‘20%’
                top: "40% ", //组件离容器上侧的距离,‘top’, ‘middle’, ‘bottom’,‘20%’
                right: "auto", //组件离容器右侧的距离,‘20%’
                bottom: "auto", //组件离容器下侧的距离,‘20%’
                orient: "vertical", //图例排列方向
                inRange: {
                    color: ['lightskyblue', 'yellow', 'red']
                }
相关文章
echarts设置单位的偏移
echarts设置单位的偏移
|
14天前
Echarts visualMap属性记录
这篇文章是关于ECharts中visualMap属性的详细记录。文中首先定义了visualMap的作用,即进行数据到视觉元素的映射。接着,通过一系列详细的配置参数,如类型、显示控制、数据范围、样式和格式化工具等,介绍了如何配置连续型和分段型visualMap组件。最后,作者通过具体代码示例,说明了如何将这些配置应用于实际的ECharts图表中,以实现数据的视觉编码效果。
15 0
Echarts visualMap属性记录
echarts如何设置滚动条(dataZoom),实现横向或纵向滚动
echarts如何设置滚动条(dataZoom),实现横向或纵向滚动
echarts如何设置滚动条(dataZoom),实现横向或纵向滚动
|
5月前
|
数据可视化 前端开发 定位技术
echarts 关于折线统计图常用的属性设置--超详细(附加源码)
echarts 关于折线统计图常用的属性设置--超详细(附加源码)
99 0
|
5月前
Echarts图表设置x轴y轴均随滚轮滚动缩+放 区域缩放
Echarts图表设置x轴y轴均随滚轮滚动缩+放 区域缩放
486 0
|
5月前
|
JavaScript 数据可视化 前端开发
ECharts 的配置语法:配置选项、数据格式、样式设置
ECharts 的配置语法:配置选项、数据格式、样式设置
425 1
echarts设置多条折线不是你想的那样简单
echarts设置多条折线不是你想的那样简单
echarts去掉y轴线、设置x轴线的颜色、x轴文字颜色
echarts去掉y轴线、设置x轴线的颜色、x轴文字颜色
echarts设置暂无数据
echarts设置暂无数据
|
5月前
|
API Windows
解决echarts.apache.org官网不能访问的问题(主要是用于查看配置项API参数细节说明)
解决echarts.apache.org官网不能访问的问题(主要是用于查看配置项API参数细节说明)

热门文章

最新文章