刚刚收到一封园友求助echart湖北地图的邮件，现在将湖北地图的所有代码贴到这里，希望可以帮助到更多朋友。

1、首先你得到echarts官网下载js，很多人说找不到，可以到我的git下载（https://github.com/wanghuihui2013/echarts3/tree/master/node_modules/echarts/map/js/province）

2、把echarts.js和hubei.js根据你的路径引对，然后就可以copy我的代码咯

3、如果你需要改变地图的颜色或轮廓线的颜色，请参考我的第一篇文章 http://www.cnblogs.com/hhw3/p/6252677.html

4、如果你还需要其他省份的地图可以copy这个代码，然后根据我文本中红色注释去改即可。

<html>

<head>

<meta charset="utf-8">

<meta http-equiv="X-UA-Compatible" content="IE=edge">

</head>

<body>

    <div id="main" style="100%; height: 100%;"></div>

</body>

<script src="js/echarts.js"></script>

<script src="js/map/js/province/hubei.js"></script>    //如果需要其他省份的地图只要引入对应省份的js

<script>

    var myChart = echarts.init(document.getElementById('main'));

    var option = {

        title: {

            text : '湖北地图',

            subtext : '-。-'

        },

        tooltip : {

            trigger: 'item',

            formatter: function(a){

                return a[2];

            }

        },

        legend: {

            orient: 'vertical',

            x:'right',

            data:['数据名称']

        },

        dataRange: {

            min: 0,

            max: 1000,

            color:['orange','yellow'],

            text:['高','低'],           // 文本，默认为数值文本

            calculable : true

        },

        series : [

            {

                name: '数据名称',

                type: 'map',

                mapType: '湖北',        //改成对应省份名

                selectedMode : 'single',

                itemStyle:{

                    normal:{label:{show:true}},

                    emphasis:{label:{show:true}}

                },
　　　　　　　　　　//这里的data是辅助改变某个地区颜色的，如果你不需要完全可以不加

                data:[

                    {name: '十堰市',value: Math.round(Math.random()*1000)},

                    {name: '襄樊市',value: Math.round(Math.random()*1000)},

                    {name: '随州市',value: Math.round(Math.random()*1000)},

                    {name: '神农架林区',value: Math.round(Math.random()*1000)},

                    {name: '恩师土家族苗族自治州',value: Math.round(Math.random()*1000)},

                    {name: '宜昌市',value: Math.round(Math.random()*1000)},

                    {name: '荆门市',value: Math.round(Math.random()*1000)},

                    {name: '天门市',value: Math.round(Math.random()*1000)},

                    {name: '潜江市',value: Math.round(Math.random()*1000)},

                    {name: '荆州市',value: Math.round(Math.random()*1000)},

                    {name: '仙桃市',value: Math.round(Math.random()*1000)},

                    {name: '武汉市',value: Math.round(Math.random()*1000)},

                    {name: '黄冈市',value: Math.round(Math.random()*1000)},

                    {name: '鄂州市',value: Math.round(Math.random()*1000)},

                    {name: '咸宁市',value: Math.round(Math.random()*1000)},

                    {name: '黄石市',value: Math.round(Math.random()*1000)},

                ]

            }

        ]

    };

    myChart.setOption(option);

</script>

</html>

如果我有帮助到你请点个赞鼓励一下我吧！

上述内容是参照echarts官网http://echarts.baidu.com/,若有侵权请联系，谢谢！

作者：BlancheWang 
出处：http://www.cnblogs.com/hhw3
本文版权归作者和博客园共有，欢迎转载，但未经作者同意必须保留此段声明，且在文章页面明显位置给出原文连接。

echart3 湖北地图及如何创建其他省份地图的更多相关文章

  1. 创建用户故事地图(User Story Mapping)的8个步骤

    ［小编］上周六了解了用户故事地图后,小编又查阅了一些资料,找到了以下这篇关于如何组织用户故事地图规划的文章,分享给大家.也希望大家如果有好的实践,也可以留言一起交流. 原文地址:http://winn ...

  2. 【百度地图API】如何快速创建带有标注的地图？——快速创建地图工具+如何标注商家

    原文:[百度地图API]如何快速创建带有标注的地图?--快速创建地图工具+如何标注商家 摘要: 如果你不会程序,如果你不想写代码. 如果你想拥有一张自己的地图,如果你想在该地图上标注出你商店的位置. ...

  3. OpenCV——识别各省份地图轮廓

    好久没有发OpenCV的博客了,最近想到了一个识别地图轮廓的方案,就写来试试.(识别中国的28个省份地图轮廓,不考虑直辖市) 首先,我的基本思路是  用最小的矩形将地图的轮廓圈出来,可以根据长方形的长 ...

  4. jQuery中国各个省份地图分部代码

    jQuery中国各个省份地图分部代码 在线演示本地下载

  5. javascript 百度地图无秘钥（appkey）创建marker标记地图

    创建简单的marker地图不一定需要去百度地图申请key,简单代码实现marker地图,效果如图: html代码如下,代码中的baidu.api.js参考后面的隐藏代码: <!DOCTYPE h ...

  6. Android基于mAppWidget实现手绘地图（六）–如何展示地图对象

    为了展示选中的点,你需要完成以下步骤: 1.创建或者获得一个已经存在的图层 2.创建代表选中点的地图对象 3.把地图对象添加到图层 创建新图层 使用以下代码片段创建图层 int COFFEE_SHOP ...

  7. 百度地图学习（Ⅰ）-Android端地图的显示及简单应用

    ps:(1.地图应用一定要在真机测试: 2.Design By:Android Stdio: 3.百度地图官方参考链接(http://developer.baidu.com/map/index.php ...

  8. 【百度地图API】如何制作商圈地图？行政地图？

    原文:[百度地图API]如何制作商圈地图?行政地图? 摘要: 想要显示某一个区域,并且鼠标放上去,该区域就会变色.这时,你就需要巧用多边形覆盖物,和它的鼠标事件了! 快来看看去哪儿网的实例吧:http ...

  9. 【iOS】7.4 定位服务->3.1 地图框架MapKit 功能1：地图展示

    > 本文并非最终版本,如果想要关注更新或更正的内容请关注文集,联系方式详见文末,如有疏忽和遗漏,欢迎指正. --- > 本文相关目录: ================== 所属文集:[[ ...

随机推荐

  1. Oracle等待事件之等待事件详解

    一． 等待事件的相关知识:1.1 等待事件主要可以分为两类:即空闲(IDLE)等待事件和非空闲(NON-IDLE)等待事件.1). 空闲等待事件指ORACLE正等待某种工作,在诊断和优化数据库的时候, ...

  2. Convolution and polynomial multiplication

    https://www.mathworks.com/help/matlab/ref/conv.html?s_tid=gn_loc_drop conv Convolution and polynomia ...

  3. Qt::浅谈信号槽连接，参数在多线程中的使用

    Qt的信号槽有五种连接方式定义在enum Qt::ConnectionType,下面简单介绍 Qt::AutoConnection:自动判断连接方式,如果信号发送对象和执行槽对象在同一线程,那么等于Q ...

  4. logging.basicConfig参数简介

    通过logging.basicConfig函数对日志的输出格式及方式做相关配置 import logging logging.basicConfig(level=logging.DEBUG, form ...

  5. （2.16）Mysql之SQL基础——函数

    (2.16)Mysql之SQL基础——函数 关键词:mysql函数,mysql自定义函数,mysql聚合函数,mysql字符串函数,mysql数值函数 1.自定义函数 -- (1)一般形式 creat ...

  6. django基础之FBV与CBV，ajax序列化补充，Form表单

    目录: FBV与CBV ajax序列化补充 Form表单(一) 一.FBV与CBV 1.什么是FBV.CBV? django书写view时,支持两种格式写法,FBV(function bases vi ...

  7. POJ2891：Strange Way to Express Integers（解一元线性同余方程组）

    写一下自己的理解,下面附上转载的:若a==b(modk);//这里的==指的是同余,我用=表示相等(a%k=b)a-b=kt(t为整数)以前理解的错误思想:以前认为上面的形式+(a-tb=k)也是成立 ...

  8. 4.1 Routing -- Introduction

    一.Routing 1. 当用户与应用程序交互时,它会经过很多状态.Ember.js为你提供了有用的工具去管理它的状态和扩展你的app. 2. 要理解为什么这是重要的,假设我们正在编写一个Web应用程 ...

  9. 排序问题Java

    package zhuzhuangtu; import java.util.*; import java.io.*; public class Main{ public static void mai ...

  10. LFD,非官方的Windows二进制文件的Python扩展包

    LFD,非官方的Windows二进制文件的Python扩展包 LFD,非官方版本.32和64位.Windows.二进制文件.科学开源.Python扩展包 克里斯托夫·戈尔克(by Christoph ...