Echarts 设置visualMap.inRange后，解决地图颜色显示不全的问题

最新推荐文章于 2024-08-08 18:06:31 发布
最新推荐文章于 2024-08-08 18:06:31 发布
阅读量1.8w 收藏 42
点赞数 8
分类专栏： 前端 文章标签： Echarts 地图颜色显示不全 visualMap pieces inRange
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_42512937/article/details/104390901
版权

一、当前遇到的问题

1.1、需求：使用 Echarts 绘制中国地图，通过每个省份的 value 值不同，用渐变色区分

 

2.2、查询 Echarts 官方API，通过设置属性 visualMap.pieces 和 visualMap.inRange ，即可显示渐变色的地区

 

2.3、但是呢，效果总是不尽人意，本项目中设置的颜色都是蓝色系列，可是数据渲染出现，偶尔会有几个省份会出现白色（即颜色显示不全）

  • 此时设置的 visualMap.pieces 和 visualMap.
最低0.47元/天 解锁文章
窩窩頭
关注
专栏目录
echarts 默认显示图例_echarts设置图例颜色和地图底色的方法实例
weixin_39718083的博客
12-20 2608
前言本来想写echarts初始化函数的，但最近因为要写一个地图与柱状图的混合方式，也就是每个省的地图上要有柱状图显示。于是仔细使用了一下地图。1、地图的一些基本属性就不介绍了，还是那些style2、地图数据的获取以及Series的加载和其他没有什么大的差异。地图数据都在map.js中，都可以自己看，也可以自己根据格式获取响应的数据。这里主要想处理的是图例颜色与地图底图颜色怎么设置的问题。1、图例的...
Echarts动态获取数据颜色丢失的问题
qq_45670042的博客
04-19 1914
问题描述： 使用Echarts饼图从后台请求数据时，请求成功后图表颜色丢失，变成纯黑色了。 问题原因： visualMap: { show: false, min: 0,// 数据最小值的颜色明暗度 max: 600,// 数据最大值的颜色明暗度 inRange: { colorLightness: [0,1] // 表示颜色的明暗程度 } }, 出现纯黑的情况是因为
ECharts 设置地图(map)值变化颜色(visualMap)
热门推荐
soindy
06-01 5万+
ECharts 设置地图(map)值变化颜色(visualMap):visualMap: { min: 800, max: 50000, inRange: { color: ['lightskyblue','yellow', 'orangered'] } }
echarts的visualMap与其他类型颜色冲突
素味平生的博客
01-25 7056
最近个人开发大屏用了echarts，遇到一个visualMap颜色冲突的问题，一个比较复杂的echarts图，会由好几个类型不同的图表组成，但如果你用了颜色渐变visualMap的话，会发现一个问题，他覆盖了你其他type图的颜色，这时，只需要加上visualMap：false即可。 注：要加在你的数据后面，否则无效。代码如下，亲测有效 ...
Echarts绘制动态折线图，分段绘制不同颜色
最新发布
tsunami_______的博客
08-08 786
接收实时数据绘制曲线图，并且能够根据选中项绘制多个图表，固定区间使用红色线段。
visualMap属性
ʚ菲菲的博客ɞ
09-30 2051
视觉映射组件，用于进行『视觉编码』，也就是将数据映射到视觉元素。视觉元素可以是： symbol: 图元的图形类别。 symbolSize: 图元的大小。 color: 图元的颜色。 colorAlpha: 图元的颜色的透明度。 opacity: 图元以及其附属物（如文字标签）的透明度。 colorLightness: 颜色的明暗度。 colorSaturation: 颜色的饱和度。 colorHue: 颜色的色调。 visualMap=[ { show:true,
echart中的inRange
qq_31135027的博客
03-21 6322
我做了尝试上面这个图的inRange设置为visualMap: { min: 0, max: 200, calculable: true, inRange: { color: ['#50a3ba', '#eac736', '#d94e5d'] }, textStyle: { ...
echarts地图map设置visualMap按照不同数值显示区域颜色，（自定义数值区间/自动取色）
Xiang_Gong_Ya_的博客
12-19 2984
【代码】echarts地图map设置visualMap按照不同数值显示区域颜色，（自定义数值区间/自动取色）
echarts地图设置边界线颜色显示不全
writeBUG123的博客
10-13 619
求解决方案? { // 省份城市名称 name: '湖北', itemStyle: { borderColor: 'red', borderWidth: 2, }, }
【删繁就简】Echarts 视觉映射组件中国地图分段颜色显示，选中范围内外颜色设置策略
追寻上飞的博客
03-09 2763
在前端项目开发过程中，需要在大屏模块模块中按照项目在各省份分部的数量进行可视化显示，该功能对应`Echarts`的视觉映射组件`VisualMap`，设置完成后，出现的效果如图所示。当项目量为0的省份是透明的。
echarts visualmap parallel不映射问题
weixin_47147912的博客
10-22 434
echarts viasulmap parallel 视觉映射
echarts地图文字重叠解决方案_echarts map 阴影（重叠）
weixin_42128537的博客
01-17 1391
export const dfOption = {tooltip: {formatter: function(params, ticket, callback) {return params.name + "：" + params.value;} // 数据格式化},visualMap: {min: 0,max: 100,right: 10,top: "bottom",itemWidth: 10,...
vue + echarts+地图实现功能，实现地图上数据显示，四川省地图echarts地市数据案列
qq_41180882的博客
03-20 2687
1、首先需要下载对应的地图，如果是联网的可以直接下载一个，实现下钻，可自行去搜索或者实现，本文主要为离线地图2、下载需要的对应地图包后，进入下一步编辑3、还需要拿到各个地区的经纬度，可以到网上去经纬度地方上去搜然后点击后获取，也可以在我们做的echarts地图上点击获取
echarts Map visualMap颜色覆盖itemStyle color
Griner_的博客
11-15 710
3.设置‘离岛、大埔' 地区值为负数，不在visualMap[min,max]范围内，负数地区显示红色。1.对应地区series里添加。visualMap 取值范围。echarts 官网原码。
echarts图表展示地图指定区域
羽筠的博客
03-22 2337
echarts地图展示指定区域 指定区域获取方式： 城市范围选择器：http://datav.aliyun.com/portal/school/atlas/area_selector echarts地图展示指定区域及经纬度设置展示标注
echarts使用visualMap，使折线图在某个刻度线上区分颜色,
AspirinZero的博客
06-27 640
分段型视觉映射组件（visualMapPiecewise）
.net 地图取点
qq_41409185的博客
09-15 542
<%--地图--%> <script type="text/javascript" src="//api.map.baidu.com/api?v=2.0&ak=8YVG4aI4EbO1ex1IS5NjZkDEehNRhe8a"></script> <script src="//libs.baidu.com/jquery/1.9.0/jquery.js"></script> <scrip...
使用Pyecharts构建Map对象无法显示颜色--解决
CCSco4355
05-21 862
可视化图例设置的上限为100人， 那么500不在0-100之间，就不会可视化出来。2. 地图内国家名称、省市区等名称是否符合pyecharts规范（内部定义的）内蒙古---内蒙古自治区。我们在做数据可视化的过程中，可能需要使用到地图作为数据可视化的工具；1. 设置的数据区间未达到可视化数据的范围。比如： 北京人口：500人。比如：北京----北京市。包括世界地图、国家地图、省市区地图等；这是两种最长出现的问题。
visualMap.inRange
05-31
visualMap.inRange 是ECharts图表库中用于设置视觉映射组件中的数据范围的属性。该属性可以通过设置数组中的两个元素来确定数据范围的最小值和最大值，例如: ``` visualMap: { type: 'continuous', min: 0, max: 100, inRange: { color: ['#ff3333', 'yellow', 'lime'] } } ``` 在上述代码中，visualMap.inRange 的最小值为0，最大值为100。当数据值在这个范围内时，将使用颜色数组中的颜色进行渲染。
评论 11
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值