中国地图原来这么简单就可以写出来了

上一篇的博客讲了Echarts，接下来我们的地图就是用Echars来完成的
首先我们先来获取china.js文件
文件引入链接：百度网盘
提取码：1122

 .warpper{width: 1000px;height: 600px;}

<script src="js/echarts.js"></script>
<!--注意echars文件一定要放在最前面，不然地图是出不来的-->
<!--地图最重要的就是这个js文件-->
<script src="js/china.js"></script>
<script src="js/jquery.js"></script>
<div class="warpper"></div>

     //写个随机数据function random(){return Math.floor(Math.random()*2000);}// 基于准备好的dom，初始化echarts实例var mychart = echarts.init($('.warpper').get(0));var mydata = [{ name: '北京', value: random() },{ name: '天津', value: random() },{ name: '上海', value: random() },{ name: '重庆', value: random() },{ name: '河北', value: random() },{ name: '河南', value: random() },{ name: '云南', value: random() },{ name: '辽宁', value: random() },{ name: '黑龙江', value: random() },{ name: '湖南', value: random() },{ name: '安徽', value: random() },{ name: '山东', value: random() },{ name: '新疆', value: random() },{ name: '江苏', value: random() },{ name: '浙江', value: random() },{ name: '江西', value: random() },{ name: '湖北', value: random() },{ name: '广西', value: random() },{ name: '甘肃', value: random() },{ name: '山西', value: random() },{ name: '内蒙古', value: random() },{ name: '陕西', value: random() },{ name: '吉林', value: random() },{ name: '福建', value: random() },{ name: '贵州', value: random() },{ name: '广东', value: random() },{ name: '青海', value: random() },{ name: '西藏', value: random() },{ name: '四川', value: random() },{ name: '宁夏', value: random() },{ name: '海南', value: random() },{ name: '台湾', value: random() },{ name: '香港', value: random() },{ name: '澳门', value: random() }];// 指定图表的配置项和数据mychart.setOption({visualMap:{//类型为分段型。type : 'piecewise',//最小值min : 0,//最大值max : 2000,//对于连续型数据，自动平均切分成几段。默认为5段。 连续数据的范围需要 max 和 min 来指定。splitNumber : 5,//自定义每一段的范围，以及每一段的文字，以及每一段的特别的样式。pieces : [{min : 1500,color : '#921AFF'},{min : 1000,max : 1500,color : '#0f0'},{min : 500,max : 1000,color : '#0ff'},{min : 200,max : 500,color : '#FF4500'},{max : 200,color : '#FF0080'}],//图例列表的布局朝向。orient : 'horizontal',//图例组件离容器左侧的距离。left : 'center'},//系列列表。每个系列通过 type 决定自己的图表类型series: [{//地图主要用于地理区域数据的可视化，//这个type是你想要什么图就写什么图的值type: 'map',//自定义地区的名称映射mapType: 'china',//数据数组data : mydata}]});

下面来看看效果图

中国地图原来这么简单就可以写出来了相关推荐

echarts 山东地图_用Python画中国地图，实现各省份数据可视化
第一步:安装pyecharts pyecharts是一款将python与echarts结合的强大的数据可视化工具,本文使用了0.1.9.4版本 pip install pyecharts==0.1.9 ...
用Python画中国地图，实现各省份数据可视化！可视化简直了！
第一步:安装pyecharts pyecharts是一款将python与echarts结合的强大的数据可视化工具,本文使用了0.1.9.4版本 pip install pyecharts==0.1.9 ...
可视化：中国地图R/ggplot2
实际工作中,很多时候有画地图的需求,只要一出现就是全ppt最靓的图了.这里介绍一下如何在R中用ggplot2画出好看的中国地图,是很多年前写的代码了,运行了一下发现还没有过时.下一篇介绍在python ...
代码写好了怎么在php里裕兴_8 行代码用Python画一个中国地图
源 / SegmentFault Jupyter 首先,第一神器是Jupyter.如果你是第一次使用,可能搞不清楚它的开发者做这么个鬼东西出来干什么,说它是博客系统也不像,说它是web服务器也不像,但 ...
[Echarts可视化] 一.入门篇之简单绘制中国地图和贵州地区
最近发生了很多事情,去到了一个新环境学习.但是不论在哪里,我都需要不忘初心,坚持做自己喜欢的事情,在CSDN写博客.教学.爱娜.生活等等. 这篇文章主要是通过Echarts可视化介绍入 ...
excel做地图热力图_如何简单快速的做出一个中国地图热力图 (数据随机虚构)
如何简单快速的做出一个中国地图热力图: 用 Echarts 即可以简单快速的写出: 除导入 echarts.js 外,还需要导入中国的 JSON 或是 js(现在官方不提供下载,需要自行下载,也可以 ...
使用echarts简单制作中国地图
网站需要一张中国地图,并且鼠标经过某个省份,该省份的省份名字显示,而且该省份的地区会变色显示. 第一种方法: 将每个省份的图片定位(先隐藏),拼合成一张中国地图,然后再定位省份名称,鼠标经过省份名字, ...
echarts+vue实现简单的中国地图且数据下钻（简洁适合小白版）
首先,在实现地图之前,需要实现地图的json文件(包含各省份和整个中国地图),文件可从阿里云可视化数据平台下载网址:http://datav.aliyun.com/portal/school/atla ...
ditu 最简单的中国地图
2安装指定版本4.8.0 npm install echarts@4.8.0 --save 然后 //地图参数配置 getMapOpt(place) { let option = { visualMa ...

中国地图原来这么简单就可以写出来了

中国地图原来这么简单就可以写出来了相关推荐

最新文章

热门文章