# echarts_map

**Repository Path**: im-not-happy/echarts_map

## Basic Information

- **Project Name**: echarts_map
- **Description**: echarts地图数据
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 9
- **Created**: 2024-12-02
- **Last Updated**: 2024-12-02

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# echarts_map

#### 介绍
收集整理的 echarts 地图数据

#### 文件说明
一共收集了3份地图数据如下：
1. geometryProvince 是中国各省的 json 数据。
   geometryCouties 是中国各市区的 json 数据。
   china.json 是中国地图数据。

2. china-map-geojson.min.js 是中国+中国各省地图数据。等同上面的 china.json + geometryProvince。

3. js 和 json 文件夹中的是最新的世界地图，中国地图，中国各市区地图的两种文件类型。


#### 使用说明
**示例1**
```html
<div id="main" style="width:600px;height:400px;"></div>
<script src="echarts.min.js"></script>
<script src="china-map-geojson.min.js"></script>
<script>
var obj = window['china-map-geojson'];
var json = obj.ChinaData;                 //中国地图数据
var myChart = echarts.init(document.getElementById('main'));

echarts.registerMap('china', json);       //在echarts 中注册中国地图  
var option = {
    baseOption: {
        //地图整个背景设置
        backgroundColor: '#000',
        geo: {
            // center:[121.487899,31.249162], //视角的中心点为上海
            roam: true,                       //缩放平移
            scaleLimit: {
                min: 0.5,
                max: 10,
            },
            map: 'china',
            itemStyle: {
                areaColor: '#666',
                borderColor: '#aaa',
            },
            emphasis: {
                itemStyle: {
                    areaColor: 'lightblue',
                    shadowColor: '#fff',
                    shadowBlur: 10
                },
                label: {
                    show: false
                }
            },
            regions: [{
                name: '湖北',
                itemStyle: {
                    areaColor: 'orange'
                },
                emphasis: {
                    itemStyle: {
                        areaColor: 'red',
                        shadowColor: '#fff',
                        shadowBlur: 10
                    },
                }
            }],
        }
    }
}
myChart.setOption(option);
</script>
```
![输入图片说明](https://images.gitee.com/uploads/images/2020/0605/112618_37b53e5f_1805492.png "1591327517(1).png")


**示例2**
```html
<div id="main" style="width:600px;height:400px;"></div>
<script src="echarts.min.js"></script>
<script src="js/china.js"></script>
<script>
var myChart = echarts.init(document.getElementById('main'));
var option = {
    baseOption: {
        backgroundColor: '#000',
        geo: {
            map: 'china',  //在china.js中已注册中国地图数据，对应键值为china
        }
    }
}
myChart.setOption(option);
</script>
```
![输入图片说明](https://images.gitee.com/uploads/images/2020/0605/114302_c3591d65_1805492.png "1591328471(1).png")

**示例3**
```html
<div id="main" style="width:600px;height:400px;"></div>
<script src="echarts.min.js"></script>
<script src="js/province/hubei.js"></script>
<script>
var myChart = echarts.init(document.getElementById('main'));
var option = {
    baseOption: {
        backgroundColor: '#000',
        geo: {
            map: '湖北', //在hubei.js中已注册湖北省地图数据，对应键值为'湖北'
        }
    }
}
myChart.setOption(option);
</script>
```
![输入图片说明](https://images.gitee.com/uploads/images/2020/0605/113912_cf72d493_1805492.jpeg "1591328298(1).jpg")

**5.示例**
```html
<div id="main" style="width:600px;height:400px;"></div>
<script src="echarts.min.js"></script>
<script src="js/china-cities.js"></script>
<script>
//随州市的地图数据
var data = {"type": "FeatureCollection", "features": [{"type":"Feature","properties":{"name":"广水市","id":"421381"},"geometry":{"type":"MultiPolygon","coordinates":[[[[114.097345,31.793843],[114.097345,31.803843],[114.107345,31.803843],[114.107345,31.793843],[114.097345,31.793843]]],[[[114.097345,31.793843],[114.104334746094,31.7752419257812],[114.089193144531,31.7072267890625],[114.128033476563,31.6749636054688],[114.101803007813,31.629165265625],[114.103682890625,31.6107106757812],[114.083026152344,31.5557375312501],[114.103363066406,31.538843],[114.091883574219,31.5293044257812],[114.082806425781,31.5183815742188],[114.071795683594,31.5092336250001],[114.072894316406,31.498452375],[114.060855742188,31.488452375],[114.063765898438,31.4599025703126],[114.047345,31.4338430000001],[114.024088164063,31.4436110664063],[114.01033328125,31.4236891914063],[113.968011503906,31.4331764960938],[113.975767851563,31.3985720039063],[113.931861601563,31.3873024726563],[113.927345,31.3938430000001],[113.93197390625,31.39921409375],[113.943197050781,31.4088845039063],[113.899947539063,31.43847190625],[113.881651640625,31.4172365546875],[113.853590117188,31.449809796875],[113.820787382813,31.4377638984375],[113.802345,31.4392458320312],[113.792066679688,31.4384181953125],[113.77271609375,31.4492140937501],[113.718616972656,31.47335471875],[113.66271609375,31.40847190625],[113.619840117188,31.3893386054687],[113.598089628906,31.4145876289063],[113.587345,31.423843],[113.569449492188,31.4509255195312],[113.576827421875,31.483843],[113.571224394531,31.5088430000001],[113.573746367188,31.5200905585938],[113.549176054688,31.5556740546876],[113.530103789063,31.568843],[113.543646269531,31.5781935859376],[113.531043730469,31.6294924140626],[113.544483671875,31.6387721992188],[113.553465605469,31.678843],[113.551160917969,31.6891213203126],[113.565179472656,31.72249534375],[113.549176054688,31.7456740546876],[113.529132109375,31.7595143867188],[113.533465605469,31.7788430000001],[113.527345,31.8061452460938],[113.573260527344,31.8179274726563],[113.582991972656,31.8439333320313],[113.604105253906,31.85851096875],[113.6239075,31.8889235664062],[113.601112089844,31.9183376289063],[113.603465605469,31.9288430000001],[113.600186796875,31.9434743476563],[113.619598417969,31.9715895820313],[113.661007109375,32.000180890625],[113.681429472656,32.0297585273438],[113.693260527344,32.0379274726563],[113.705513945313,32.0856740546876],[113.717345,32.093843],[113.722064238281,32.0885622382813],[113.783961210938,32.0402834296875],[113.748179960938,31.9941139960937],[113.803238554688,31.9688430000001],[113.801405058594,31.9380837226563],[113.832718535156,31.9101076484375],[113.831451445313,31.8888430000001],[113.832642851563,31.868843],[113.831507597656,31.8497878242188],[113.879598417969,31.8469216132813],[113.892625761719,31.8585622382813],[113.916812773438,31.8856301093751],[113.932064238281,31.8685622382813],[113.953221464844,31.8496584296876],[113.939881621094,31.8251076484376],[113.952064238281,31.7985622382812],[113.962625761719,31.7791237617188],[113.976168242188,31.7496193671876],[114.012064238281,31.7691237617188],[114.058685332031,31.7799709296876],[114.097345,31.793843]]]]}},{"type":"Feature","properties":{"name":"曾都区","id":"421302"},"geometry":{"type":"MultiPolygon","coordinates":[[[[113.757345,32.283843],[113.769537382813,32.2804201484375],[113.760767851563,32.2716506171875],[113.757345,32.283843]]],[[[113.597345,32.363843],[113.585152617188,32.3672658515626],[113.593922148438,32.3760353828125],[113.597345,32.363843]]],[[[113.757345,32.363843],[113.760767851563,32.3760353828125],[113.769537382813,32.3672658515626],[113.757345,32.363843]]],[[[113.597345,32.363843],[113.613260527344,32.3679274726563],[113.645804472656,32.416255109375],[113.682183867188,32.4244118476562],[113.707345,32.413843],[113.724166289063,32.4106642890625],[113.730523710938,32.3970217109375],[113.750340605469,32.3877883125001],[113.738638945313,32.3673781562501],[113.757345,32.363843],[113.743648710938,32.3326100898438],[113.757345,32.323843],[113.763543730469,32.3090822578126],[113.757345,32.283843],[113.7388684375,32.2914357734376],[113.743333769531,32.2688430000001],[113.737230253906,32.2379567695313],[113.759244414063,32.2072414375],[113.781519804688,32.2116432929687],[113.773170195313,32.1880178046876],[113.761519804688,32.1696681953126],[113.750797148438,32.1161843085937],[113.718651152344,32.1225368476563],[113.723455839844,32.0982228828126],[113.717345,32.093843],[113.705513945313,32.0856740546876],[113.693260527344,32.0379274726563],[113.681429472656,32.0297585273438],[113.661007109375,32.000180890625],[113.619598417969,31.9715895820313],[113.600186796875,31.9434743476563],[113.603465605469,31.9288430000001],[113.601112089844,31.9183376289063],[113.6239075,31.8889235664062],[113.604105253906,31.85851096875],[113.582991972656,31.8439333320313],[113.573260527344,31.8179274726563],[113.527345,31.8061452460938],[113.533465605469,31.7788430000001],[113.529132109375,31.7595143867188],[113.549176054688,31.7456740546876],[113.565179472656,31.72249534375],[113.551160917969,31.6891213203126],[113.553465605469,31.678843],[113.544483671875,31.6387721992188],[113.531043730469,31.6294924140626],[113.543646269531,31.5781935859376],[113.530103789063,31.568843],[113.549176054688,31.5556740546876],[113.573746367188,31.5200905585938],[113.571224394531,31.5088430000001],[113.576827421875,31.483843],[113.569449492188,31.4509255195312],[113.587345,31.423843],[113.522110625,31.3930666328125],[113.471112089844,31.4308766914063],[113.404190703125,31.4209889960938],[113.382345,31.4078102851563],[113.36298953125,31.4194875312501],[113.333182402344,31.42819846875],[113.32298953125,31.3681984687501],[113.317345,31.343843],[113.294329863281,31.3347951484375],[113.28298953125,31.3494875312501],[113.245213652344,31.360005109375],[113.22978640625,31.3577248359376],[113.196951933594,31.4002638984375],[113.181954375,31.3980471015625],[113.16298953125,31.40948753125],[113.140611601563,31.4186452460938],[113.160091582031,31.4336818671875],[113.121954375,31.4280471015625],[113.096832304688,31.4432009101563],[113.052345,31.436626203125],[113.010250273438,31.4428469062501],[112.987345,31.4338430000001],[112.969053984375,31.445551984375],[112.948533964844,31.4776076484375],[112.90173953125,31.464458234375],[112.893441191406,31.5199391914063],[112.878172636719,31.5547585273438],[112.841248808594,31.5677468085937],[112.827523222656,31.589184796875],[112.781248808594,31.5977468085938],[112.754964628906,31.6157448554688],[112.747345,31.603843],[112.731815214844,31.6116994453126],[112.727345,31.633843],[112.73197390625,31.69921409375],[112.74271609375,31.7184719062501],[112.752345,31.7400490546876],[112.782020292969,31.7376638007813],[112.79197390625,31.74921409375],[112.82271609375,31.7584719062501],[112.84197390625,31.7892140937501],[112.864742460938,31.81847190625],[112.884422636719,31.795630109375],[112.922669707031,31.8400221992188],[112.964530058594,31.8366579414063],[112.959588652344,31.8981496406251],[112.984058867188,31.9090700507813],[113.001998320313,31.9492726875],[113.012647734375,31.9484157539063],[113.03197390625,31.9634181953126],[112.9819153125,31.9784889960938],[112.983148222656,31.993843],[112.981942167969,32.0088430000001],[112.98537234375,32.0515065742187],[113.043004179688,32.1188088203125],[113.021197539063,32.14956565625],[113.022747832031,32.168843],[113.021925078125,32.1790822578125],[113.032818632813,32.2087477851563],[113.019774199219,32.2685524726563],[113.05271609375,32.27847190625],[113.06197390625,32.2892140937501],[113.091363554688,32.314536359375],[113.050738554688,32.349536359375],[113.075213652344,32.3706203437501],[113.102669707031,32.3684157539063],[113.107345,32.373843],[113.132203398438,32.3796022773437],[113.142916289063,32.3780202460937],[113.1595325,32.4186208320313],[113.208546171875,32.4381984687501],[113.23170046875,32.40819846875],[113.277913847656,32.3760622382813],[113.29170046875,32.3581984687501],[113.329080839844,32.3429006171876],[113.310867949219,32.328843],[113.352564726563,32.2966579414063],[113.372735625,32.2996388984376],[113.417345,32.27272971875],[113.46170046875,32.2994875312501],[113.493631621094,32.3125563789063],[113.52170046875,32.32948753125],[113.55298953125,32.33819846875],[113.588250761719,32.3520607734375],[113.597345,32.363843]],[[113.532899199219,32.3108327460938],[113.557345,32.303843],[113.550501738281,32.3277809882813],[113.532899199219,32.3108327460938]]]]}}]}

echarts.registerMap('421300', data);       //在echarts 中注册中国地图  
var myChart = echarts.init(document.getElementById('main'));
var option = {
    baseOption: {
        backgroundColor: '#000',
        geo: {
            map: '421300',
        }
    }
}
myChart.setOption(option);
</script>
```
![输入图片说明](https://images.gitee.com/uploads/images/2020/0605/115626_50dd7104_1805492.jpeg "1591329293(1).jpg")

**6.示例**
```html
<div id="main" style="width:600px;height:400px;"></div>
<script src="echarts.min.js"></script>
<script src="js/china-cities.js"></script>
<script>
var data = chinaCities
echarts.registerMap('china', data);       //在echarts 中注册中国地图  

var myChart = echarts.init(document.getElementById('main'));
var option = {
    baseOption: {
        backgroundColor: '#000',
        geo: {
            map: 'china',
        }
    }
}
myChart.setOption(option);
</script>
```
![输入图片说明](https://images.gitee.com/uploads/images/2020/0605/120240_ec16eb41_1805492.jpeg "1591329749(1).jpg")