1.导入 world.china.js  这个js是将world.js 文件 以及china.js文件进行合并 (网上一些中国地图勾勒的身份曲线感觉很飘  所以自己加工了一下china.js中的数据, 然后合并到了word.js中)

(可以在这里进行下载  https://github.com/a1115040996/MyHTML/blob/master/world-china.js)

2.现在echarts.js源码

3.生成地图

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<div id="box" style="width: 1000px;height: 1000px;"></div>
<script src="js/echarts.js" type="text/javascript" charset="utf-8"></script>
<script src="js/world-china.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
var myCharts = echarts.init(document.getElementById('box'));
myCharts.setOption({
visualMap: {
min: 0,
max: 1000000,
text:['High','Low'],
realtime: false,
calculable: true,
color: ['orangered','yellow','lightskyblue']
},
series: [{
name: 'chinaMap',
type: 'map',
map: 'world',
roam: true,
itemStyle:{
emphasis:{label:{show:true}}
},
center: [115.97, 29.71],
zoom: 12,
label: {
normal: {
show: true,
position: 'center',
formatter: '{b}'
}
},
data: [
{name: '山东省', value: '1000'}
],
zlevel: 3
}]
});
</script>
</body>
</html>

  

预览图

echarts 如何在世界地图中绘制中国地图的更多相关文章

  1. 【可视化】Echarts3 在世界地图中绘制中国各省份的轮廓

    要在世界地图展现出来的情况下绘制中国省份的轮廓,根据现有的echarts-api是不可行的. 但好在echarts也提供了自定义地图的方式,使用echarts.registerMap();来实现 第一 ...

  2. vue+vuex+axios+echarts画一个动态更新的中国地图

    一. 生成项目及安装插件 # 安装vue-cli npm install vue-cli -g # 初始化项目 vue init webpack china-map # 切到目录下 cd china- ...

  3. 用matlab绘制中国地图

    reference:https://jingyan.baidu.com/article/870c6fc36fdacfb03ee4be58.html shp: http://muchong.com/ht ...

  4. Android 绘制中国地图

    最近的版本有这样一个需求: 有 3 个要素: 中国地图 高亮省区 中心显示数字 面对这样一个需求,该如何实现呢? 高德地图 因为项目是基于高德地图来做的,所以很自然而然的想到了高德.但是当查阅高德地图 ...

  5. 用echarts绘制中国地图

    在项目中运用到图形展示数据太常见了,echarts是一款使用率非常高的插件工具,很多大平台都是使用echarts: 一般运用到条形.折线.扇形图,今天说一说在中国地图上展示各地数据: 首先要准备中国地 ...

  6. Javascript实战开发:教你使用raphael.js绘制中国地图

    最近的数据统计项目中要用到中国地图,也就是在地图上动态的显示某个时间段某个省份地区的统计数据,我们不需要flash,仅仅依靠raphael.js以及SVG图像就可以完成地图的交互操作.在本文中,我给大 ...

  7. R绘制中国地图,并展示流行病学数据

    流行病学的数据讲究“三间分布”,即人群分布.时间分布和空间分布.其中的“空间分布”最好是在地图上展示,才比较清楚.R软件集统计分析与高级绘图于大成,是最适合做这项工作了.关于地图的绘制过程,谢益辉.邱 ...

  8. D3.JS V4 绘制中国地图

    参考:http://bl.ocks.org/almccon/fe445f1d6b177fd0946800a48aa59c71 http://blog.csdn.net/lzhlzz/article/d ...

  9. 基于D3JS绘制中国地图

    仿照D3JS官网上的美国地图制作了一个中国版的地图. D3JS官网上的版本: http://bl.ocks.org/NPashaP/a74faf20b492ad377312 中国版的地图效果: 如要制 ...

随机推荐

  1. Mac mysql 忘记root密码的解决方法

    1.执行命令以安全模式启动MySQL cd /usr/local/mysql/bin sudo ./mysqld_safe --skip-grant-tables 2.同上面目录下执行 '\) whe ...

  2. 解决IDEA中导入新的maven依赖后Language Level自动重置问题

    问题: 弄了个测试项目,因为有涉及JDK1.8的代码,所以将IDEA中默认的Language Level 5(即对应JDK1.5),修改为了8(即对应JDK1.8),但是每次引入新的maven依赖,自 ...

  3. Android studio配置国内镜像源

    Android studio配置国内镜像源 不使用镜像也是可以的,据说谷歌在中国搭建了服务器 如果直接使用有问题,不妨使用镜像试试.有自动探测代理配置和手动代理配置. https://blog.csd ...

  4. Spring-boot2X基于sharding-jdbc3.x分表分库

    ShardingSphere是一套开源的分布式数据库中间件解决方案组成的生态圈,它由Sharding-JDBC.Sharding-Proxy和Sharding-Sidecar(计划中)这3款相互独立的 ...

  5. solr添加中文IK分词器,以及配置自定义词库

    Solr是一个基于Lucene的Java搜索引擎服务器.Solr 提供了层面搜索.命中醒目显示并且支持多种输出格式(包括 XML/XSLT 和 JSON 格式).它易于安装和配置,而且附带了一个基于H ...

  6. (CSDN迁移) jFinal无法启动_JFinalDemoGenerator问题解决办法

    Eclipse -> 项目右键 -> Build Path -> Config Build Path -> Source -> Add Folder, 将a_little ...

  7. (转)IntelliJ IDEA 插件 阿里巴巴Java开发手册(Alibaba Java Coding Guidelines)

    背景:idea安装插件,学习使用阿里巴巴开发插件. 在线和离线的安装方式. IntelliJ IDEA 插件 阿里巴巴Java开发手册(Alibaba Java Coding Guidelines) ...

  8. Redis实现实时热点查询

    Redis内存淘汰 定义: 指的是用户存储的一些键被可以被Redis主动地从实例中删除,从而产生读miss的情况 机制存在原因: Redis最常见的两种应用场景为缓存和持久存储 首先要明确的一个问题是 ...

  9. 单点登录(SSO)解决方案介绍

    一.单点登录的介绍 单点登录(Single Sign On),简称为 SSO,是目前比较流行的企业业务整合的解决方案之一.SSO的定义是在多个应用系统中,用户只需要登录一次就可以访问所有相互信任的应用 ...

  10. ubuntu 使用阿里云镜像源快速搭建kubernetes 1.15.2集群

    一.概述 搭建k8s集群时,需要访问google,下载相关镜像以及安装软件,非常麻烦. 正好阿里云提供了k8s的更新源,国内用户就可以直接使用了. 二.环境介绍 操作系统 主机名 IP地址 功能 配置 ...