echarts的地图省份颜色自适应变化
在使用echarts的地图的时候省份的颜色可能随着数据的多少显示不同的颜色,但是当后台返回的数据的变化较大时可能就不好控制了,所以需要设置根据后台的数据进行自适应
将后台返回的数据中的value放入一个新的数组中,然后取出数组中的最大值来设置给echarts的visulMap的max属性,并将最小值设置给min属性,当后台没有数据返回的时候会报错,所以要进行一下判断
这里取最大值和最小值使用的是扩展运算符配合Math.max/Math.min来实现的
//data是后台返回的数据
var lengedarr = []for (var i = 0; i < data.length; i++) {
lengedarr.push(data[i].value)
}
map_flow_provice.series[0].data = dataList;
if(lengedarr.length){
map_flow_provice.visualMap.max = Math.max(...lengedarr)
map_flow_provice.visualMap.min = Math.min(...lengedarr)
}else {
map_flow_provice.visualMap.max = 0
map_flow_provice.visualMap.min = 200
}
echarts的地图省份颜色自适应变化的更多相关文章
- Echarts 设置地图上文字大小及颜色
Echarts 设置地图上文字大小及颜色,效果如下: 上代码:关键代码用红色 series: [ { //name: '香港18区人口密度', type: 'map', mapType: 'jiang ...
- vue 下实现 echarts 全国到省份的地图下钻
vue 下实现 echarts 全国到省份的地图下钻 项目地址:https://github.com/cag2050/vue_echarts_v3_demo
- ECharts 实现地图散点图上(转载)
转载来源:https://efe.baidu.com/blog/echarts-map-tutorial/ ECharts 实现地图散点图(上) 小红 2016-04-28 ECharts, 教 ...
- 数据视化Echarts+百度地图API实现市县区级下钻
开始 这两天公司有个页面需要做数据可视化的展示,数据视化采用的是Echarts+百度地图API做展示,需要用到县级区级下钻的一个联动效果发现网上关于Echarts做到县区级下钻的资料很少,有的话也不是 ...
- echarts的地图点击事件
1.echarts的地图展示,有时候展示出的数据,虽然鼠标点击上去某个省份或者某个地方会有数据显示,但是点击一下地图没有任何动态效果,如何添加地图点击效果呢,这里自己也是坐下笔记,方便以后使用. 参考 ...
- echarts中国地图散点涟漪效果
echarts中国地图例子:http://gallery.echartsjs.com/editor.html?c=effectScatter-map 代码: var data = [{ name: ' ...
- echarts map 地图在react项目中的使用
需求 展示海南省地图,点击市高亮展示,并在右侧展示对应市的相关数据. 准备工作 Echarts 海南地图json 效果图 代码 index.tsx import React, { useRef, us ...
- 图像处理------颜色梯度变化 (Color Gradient)
有过UI设计经验的一定对2D图形渲染中的Color Gradient 或多或少有些接触,很多编程 语言也提供了Gradient的接口,但是想知道它是怎么实现的嘛? 本文介绍三种简单的颜色梯度变化算法, ...
- echarts中国地图
echarts中国地图效果图: =================== 需要引入echarts的js文件:(1.echarts.min.js:2.china.js) 下载地址: echarts.min ...
随机推荐
- gitlab的搭建和使用(转)
工作当中常用的GitHub比较好用,但是安全性不是太强,因为github完全开源的,安全性不高 有空搞一下,先记录几个博客 https://yq.aliyun.com/articles/44531 h ...
- python 操作目录
每天写一点,总有一天我这条咸鱼能变得更咸 python 中对文件及目录的操作基本依赖与os,shutil模块,其中以os模块为主,最主要的几个方法实例如下: 1.判断文件/目录是否存在(os.path ...
- springCloud学习1
传统项目架构 传统项目分为三层架构,将业务逻辑层.数据库访问层.控制层放入在一个项目中. 优点:适合于个人或者小团队开发,不适合大团队开发. 分布式项目架构 根据业务需求进行拆分成N个子系统,多个子系 ...
- cube.js 最近的一些更新
cube.js 是一个和不错的数据分析框架,最近又有了一些新的功能支持,以下是一些简单的 总结 基于web socket 的预览支持 react hooks api 支持 支持基于reecharts ...
- 修改了celery任务老是执行失败,跟shell中调试的结果不同
因为没有重启celery,没有删除celerybeat-schedule,导致使用的task任务一直是原来缓存的,所以代码一直无法生效,也是日了狗了
- selenium--更改标签的属性值
前戏 在进行web自动化的时候,我们有时需要获取元素的属性,有时需要添加,有时需要删除,这时候就要通过js来进行操作了 实战 from selenium import webdriver import ...
- Spring Boot 构造器参数绑定,越来越强大了!
在之前的文章:Spring Boot读取配置的几种方式,我介绍到 Spring Boot 中基于 Java Bean 的参数绑定,在一个 Java Bean 类上用 @ConfigurationPro ...
- java语言总结
优点: 安全(废弃指针) 任何一个学过C或者C++的人都知道指针的操作对于他们是很重要的,指针能够支持内存的直接操作,这样的直接操作能够带来的是效率上的提高.但是任何一个东西都是有副作用的,指针给程序 ...
- 接口性能指标TP90
TP90,即,Top percentile 90, 前90%的意思. 这是一个常用于网站性能监控的指标.tp90是一个时间值,例如tp90=3ms,其含义是90%的请求,在3ms之内,可以得到响应. ...
- Solr7.x学习(4)-导入数据
导入配置可参考官网:http://lucene.apache.org/solr/guide,http://lucene.apache.org/solr/guide/7_7/ 1.数据准备(MySQL8 ...