自定义地区级地图的实现

描述:当前是关于Echarts图表中的 散点图 示例。
 
            //var uploadedDataURL = "/asset/get/s/data-1519790067403-SyoxOoXuG.json";


//这个是根据地图形状自己在地图上获取的坐标点
var XwByMapJson = {
    "type": "FeatureCollection",
    "features": [{
            "type": "Feature",
            "properties": {
                "id": "33",
                "name": "六桶镇",
                "cp": [106.453754, 27.111663],
                "childNum": 1
            },
            "geometry": {
                "type": "Polygon",
                "coordinates": [
                    [
                        [106.460078, 27.197424],
                        [106.461803, 27.193953],
                        [106.47057, 27.192154],
                        [106.477038, 27.1802],
                        [106.473301, 27.157573],
                        [106.482643, 27.149344],
                        [106.497591, 27.147801],
                        [106.503915, 27.153202],
                        [106.507365, 27.150758],
                        [106.506359, 27.139957],
                        [106.494573, 27.124782],
                        [106.504921, 27.115264],
                        [106.501616, 27.110634],
                        [106.505353, 27.108576],
                        [106.504634, 27.101372],
                        [106.509808, 27.097642],
                        [106.518001, 27.099057],
                        [106.531799, 27.082332],
                        [106.526768, 27.077314],
                        [106.508227, 27.070495],
                        [106.510671, 27.061101],
                        [106.510383, 27.06123],
                        [106.504634, 27.059171],
                        [106.49716, 27.058141],
                        [106.491411, 27.063803],
                        [106.489686, 27.074097],
                        [106.472439, 27.076671],
                        [106.462665, 27.078215],
                        [106.46209, 27.072039],
                        [106.455191, 27.062259],
                        [106.445418, 27.052994],
                        [106.441393, 27.058141],
                        [106.436794, 27.058656],
                        [106.438519, 27.066377],
                        [106.436219, 27.069465],
                        [106.429895, 27.068951],
                        [106.417822, 27.065862],
                        [106.417534, 27.065862],
                        [106.418972, 27.070752],
                        [106.400287, 27.102144],
                        [106.401437, 27.118737],
                        [106.412935, 27.137514],
                        [106.41466, 27.149216],
                        [106.424721, 27.158602],
                        [106.44513, 27.162587],
                        [106.45361, 27.193439],
                        [106.460078, 27.197167],
                        [106.460078, 27.197424]
                    ]
                ]
            }
        },
        {
            "type": "Feature",
            "properties": {
                "id": "30",
                "name": "大石乡",
                "cp": [106.461803, 27.046816],
                "childNum": 1
            },
            "geometry": {
                "type": "Polygon",
                "coordinates": [
                    [
                        [106.507365, 27.05634],
                        [106.513401, 27.046301],
                        [106.523606, 27.041539],
                        [106.523175, 27.032529],
                        [106.534242, 27.029826],
                        [106.533667, 27.019013],
                        [106.510671, 27.027766],
                        [106.491698, 27.028281],
                        [106.498597, 27.020558],
                        [106.484799, 27.015923],
                        [106.484224, 27.002019],
                        [106.478475, 27.006654],
                        [106.474451, 27.013348],
                        [106.464677, 27.019528],
                        [106.454329, 27.021588],
                        [106.452604, 27.02133],
                        [106.435644, 27.023261],
                        [106.427452, 27.039351],
                        [106.413079, 27.050548],
                        [106.417534, 27.065862],
                        [106.417822, 27.065862],
                        [106.429895, 27.068951],
                        [106.436219, 27.069465],
                        [106.438519, 27.066377],
                        [106.436794, 27.058656],
                        [106.441393, 27.058141],
                        [106.445418, 27.052994],
                        [106.455191, 27.062259],
                        [106.46209, 27.072039],
                        [106.462665, 27.078215],
                        [106.472439, 27.076671],
                        [106.489686, 27.074097],
                        [106.491411, 27.063803],
                        [106.49716, 27.058141],
                        [106.504634, 27.059171],
                        [106.510383, 27.06123],
                        [106.507365, 27.05634]
                    ]
                ]
            }
        },
        {
            "type": "Feature",
            "properties": {
                "id": "32",
                "name": "六广镇",
                "cp": [106.449945, 26.98837],
                "childNum": 1
            },
            "geometry": {
                "type": "Polygon",
                "coordinates": [
                    [
                        [106.576067, 27.019013],
                        [106.576211, 27.015537],
                        [106.569168, 27.014636],
                        [106.567012, 27.012319],
                        [106.560401, 27.013348],
                        [106.546028, 27.012833],
                        [106.53338, 27.006139],
                        [106.521881, 27.004079],
                        [106.520157, 26.998929],
                        [106.52878, 26.987082],
                        [106.521306, 26.971113],
                        [106.508083, 26.956688],
                        [106.49716, 26.958234],
                        [106.490261, 26.955658],
                        [106.475313, 26.955142],
                        [106.471864, 26.960295],
                        [106.46209, 26.953597],
                        [106.448292, 26.953081],
                        [106.443693, 26.944322],
                        [106.42817, 26.945868],
                        [106.416672, 26.943291],
                        [106.406323, 26.937108],
                        [106.389651, 26.932985],
                        [106.381027, 26.926801],
                        [106.367517, 26.938138],
                        [106.367948, 26.953339],
                        [106.379015, 26.96403],
                        [106.384045, 26.98206],
                        [106.423427, 26.994551],
                        [106.439381, 27.004336],
                        [106.444843, 27.012447],
                        [106.454041, 27.015795],
                        [106.454329, 27.021588],
                        [106.464677, 27.019528],
                        [106.474451, 27.013348],
                        [106.478475, 27.006654],
                        [106.484224, 27.002019],
                        [106.484799, 27.015923],
                        [106.498597, 27.020558],
                        [106.491698, 27.028281],
                        [106.510671, 27.027766],
                        [106.533667, 27.019013],
                        [106.534242, 27.029826],
                        [106.576067, 27.019013]
                    ]
                ]
            }
        },
        {
            "type": "Feature",
            "properties": {
                "id": "34",
                "name": "小箐乡",
                "cp": [106.538266, 26.946898],
                "childNum": 1
            },
            "geometry": {
                "type": "Polygon",
                "coordinates": [
                    [
                        [106.567012, 27.012319],
                        [106.564569, 27.007941],
                        [106.579229, 27.000087],
                        [106.588859, 26.988756],
                        [106.608694, 26.990173],
                        [106.605819, 26.974204],
                        [106.614587, 26.976007],
                        [106.61933, 26.97472],
                        [106.617892, 26.974204],
                        [106.614443, 26.966992],
                        [106.624216, 26.960295],
                        [106.624791, 26.952051],
                        [106.628241, 26.947929],
                        [106.617317, 26.936077],
                        [106.614443, 26.919586],
                        [106.608694, 26.910824],
                        [106.603807, 26.913916],
                        [106.595758, 26.913916],
                        [106.588284, 26.911339],
                        [106.576786, 26.907731],
                        [106.565862, 26.909793],
                        [106.559826, 26.900514],
                        [106.560401, 26.898968],
                        [106.554652, 26.899483],
                        [106.546028, 26.903092],
                        [106.537979, 26.902576],
                        [106.525331, 26.899999],
                        [106.521306, 26.908246],
                        [106.517282, 26.905154],
                        [106.514982, 26.909277],
                        [106.508083, 26.923193],
                        [106.504634, 26.934531],
                        [106.505209, 26.943807],
                        [106.508083, 26.956688],
                        [106.521306, 26.971113],
                        [106.52878, 26.987082],
                        [106.520157, 26.998929],
                        [106.521881, 27.004079],
                        [106.53338, 27.006139],
                        [106.546028, 27.012833],
                        [106.560401, 27.013348],
                        [106.567012, 27.012319]
                    ]
                ]
            }
        },
        {
            "type": "Feature",
            "properties": {
                "id": "28",
                "name": "久长镇",
                "cp": [106.665898, 26.926286],
                "childNum": 1
            },
            "geometry": {
                "type": "Polygon",
                "coordinates": [
                    [
                        [106.617892, 26.974204],
                        [106.614443, 26.966992],
                        [106.634565, 26.970083],
                        [106.639164, 26.973947],
                        [106.656124, 26.975879],
                        [106.666616, 26.982318],
                        [106.668341, 26.974333],
                        [106.680271, 26.96931],
                        [106.6922, 26.972917],
                        [106.69335, 26.978068],
                        [106.702117, 26.981545],
                        [106.720227, 26.975879],
                        [106.736469, 26.980257],
                        [106.750554, 26.980128],
                        [106.754147, 26.97575],
                        [106.75271, 26.96828],
                        [106.756734, 26.968022],
                        [106.755872, 26.965962],
                        [106.754722, 26.96184],
                        [106.752997, 26.954627],
                        [106.747248, 26.94999],
                        [106.751848, 26.946383],
                        [106.754147, 26.940715],
                        [106.753572, 26.932985],
                        [106.755297, 26.92474],
                        [106.737475, 26.920616],
                        [106.738625, 26.907216],
                        [106.728851, 26.903607],
                        [106.717353, 26.899483],
                        [106.70413, 26.899483],
                        [106.70068, 26.89639],
                        [106.694931, 26.892266],
                        [106.686307, 26.894328],
                        [106.681708, 26.898452],
                        [106.681708, 26.908762],
                        [106.679408, 26.914432],
                        [106.673084, 26.914432],
                        [106.662736, 26.905669],
                        [106.653537, 26.897937],
                        [106.643763, 26.891235],
                        [106.63169, 26.895359],
                        [106.619042, 26.888658],
                        [106.611568, 26.896906],
                        [106.608119, 26.907731],
                        [106.608694, 26.910824],
                        [106.614443, 26.919586],
                        [106.617317, 26.936077],
                        [106.628241, 26.947929],
                        [106.624791, 26.952051],
                        [106.624216, 26.960295],
                        [106.614443, 26.966992],
                        [106.617892, 26.974204]
                    ]
                ]
            }
        },
        {
            "type": "Feature",
            "properties": {
                "id": "27",
                "name": "扎佐镇",
                "cp": [106.720515, 26.858752],
                "childNum": 1
            },
            "geometry": {
                "type": "Polygon",
                "coordinates": [
                    [
                        [106.756734, 26.968022],
                        [106.764639, 26.967894],
                        [106.770532, 26.96403],
                        [106.778869, 26.964416],
                        [106.778294, 26.959779],
                        [106.784043, 26.956173],
                        [106.789217, 26.952051],
                        [106.795541, 26.948444],
                        [106.800715, 26.94123],
                        [106.803015, 26.924224],
                        [106.80474, 26.918555],
                        [106.803015, 26.914432],
                        [106.797266, 26.907216],
                        [106.789792, 26.905669],
                        [106.784043, 26.901545],
                        [106.779444, 26.891235],
                        [106.780593, 26.885564],
                        [106.782318, 26.882471],
                        [106.782965, 26.88202],
                        [106.777431, 26.880795],
                        [106.775419, 26.872417],
                        [106.764352, 26.874866],
                        [106.753141, 26.867261],
                        [106.756016, 26.863007],
                        [106.766364, 26.867261],
                        [106.776138, 26.86262],
                        [106.774557, 26.858366],
                        [106.766077, 26.85308],
                        [106.781599, 26.841089],
                        [106.776425, 26.839929],
                        [106.779875, 26.832579],
                        [106.762771, 26.818006],
                        [106.750267, 26.81259],
                        [106.714909, 26.806915],
                        [106.711316, 26.794661],
                        [106.70686, 26.793887],
                        [106.706429, 26.797241],
                        [106.702549, 26.793371],
                        [106.688032, 26.794274],
                        [106.67021, 26.787695],
                        [106.67021, 26.788598],
                        [106.671934, 26.79737],
                        [106.672509, 26.806141],
                        [106.680558, 26.823165],
                        [106.685732, 26.828323],
                        [106.687457, 26.839671],
                        [106.684008, 26.843797],
                        [106.679983, 26.84947],
                        [106.677683, 26.854627],
                        [106.682283, 26.855658],
                        [106.692631, 26.860299],
                        [106.696656, 26.865456],
                        [106.701255, 26.874737],
                        [106.695506, 26.882987],
                        [106.694931, 26.892266],
                        [106.70413, 26.899483],
                        [106.717353, 26.899483],
                        [106.728851, 26.903607],
                        [106.738625, 26.907216],
                        [106.737475, 26.920616],
                        [106.755297, 26.92474],
                        [106.753572, 26.932985],
                        [106.754147, 26.940715],
                        [106.751848, 26.946383],
                        [106.747248, 26.94999],
                        [106.752997, 26.954627],
                        [106.754722, 26.96184],
                        [106.755872, 26.965962],
                        [106.756734, 26.968022]
                    ]
                ]
            }
        },
        {
            "type": "Feature",
            "properties": {
                "id": "35",
                "name": "六屯镇",
                "cp": [106.841247, 26.96184],
                "childNum": 1
            },
            "geometry": {
                "type": "Polygon",
                "coordinates": [
                    [
                        [106.778869, 26.964416],
                        [106.783755, 26.964545],
                        [106.782749, 26.977038],
                        [106.797122, 26.982704],
                        [106.812501, 26.981159],
                        [106.840241, 26.990044],
                        [106.845559, 26.989271],
                        [106.856482, 26.994808],
                        [106.865825, 26.988885],
                        [106.875886, 26.991847],
                        [106.879048, 26.98103],
                        [106.884509, 26.975879],
                        [106.882641, 26.962613],
                        [106.888246, 26.953081],
                        [106.886809, 26.939556],
                        [106.877323, 26.93247],
                        [106.87991, 26.923065],
                        [106.88724, 26.918426],
                        [106.874448, 26.91121],
                        [106.867118, 26.909664],
                        [106.866974, 26.906571],
                        [106.859788, 26.899999],
                        [106.854183, 26.903092],
                        [106.841103, 26.894457],
                        [106.827162, 26.890978],
                        [106.823568, 26.893684],
                        [106.814945, 26.885693],
                        [106.801434, 26.887498],
                        [106.782965, 26.88202],
                        [106.782318, 26.882471],
                        [106.780593, 26.885564],
                        [106.779444, 26.891235],
                        [106.784043, 26.901545],
                        [106.789792, 26.905669],
                        [106.797266, 26.907216],
                        [106.803015, 26.914432],
                        [106.80474, 26.918555],
                        [106.803015, 26.924224],
                        [106.800715, 26.94123],
                        [106.795541, 26.948444],
                        [106.789217, 26.952051],
                        [106.784043, 26.956173],
                        [106.778294, 26.959779],
                        [106.778869, 26.964416]
                    ]
                ]
            }
        },
        {
            "type": "Feature",
            "properties": {
                "id": "26",
                "name": "龙场镇",
                "cp": [106.607831, 26.835029],
                "childNum": 1
            },
            "geometry": {
                "type": "Polygon",
                "coordinates": [
                    [
                        [106.565862, 26.909793],
                        [106.576786, 26.907731],
                        [106.588284, 26.911339],
                        [106.595758, 26.913916],
                        [106.603807, 26.913916],
                        [106.608694, 26.910824],
                        [106.608119, 26.907731],
                        [106.611568, 26.896906],
                        [106.619042, 26.888658],
                        [106.63169, 26.895359],
                        [106.643763, 26.891235],
                        [106.653537, 26.897937],
                        [106.662736, 26.905669],
                        [106.673084, 26.914432],
                        [106.679408, 26.914432],
                        [106.681708, 26.908762],
                        [106.681708, 26.898452],
                        [106.686307, 26.894328],
                        [106.694931, 26.892266],
                        [106.695506, 26.882987],
                        [106.701255, 26.874737],
                        [106.696656, 26.865456],
                        [106.692631, 26.860299],
                        [106.682283, 26.855658],
                        [106.677683, 26.854627],
                        [106.679983, 26.84947],
                        [106.684008, 26.843797],
                        [106.687457, 26.839671],
                        [106.685732, 26.828323],
                        [106.680558, 26.823165],
                        [106.672509, 26.806141],
                        [106.671934, 26.79737],
                        [106.67021, 26.788598],
                        [106.67021, 26.787695],
                        [106.662305, 26.789243],
                        [106.661873, 26.791823],
                        [106.648219, 26.792339],
                        [106.649656, 26.790146],
                        [106.644482, 26.785115],
                        [106.635283, 26.781374],
                        [106.633271, 26.784212],
                        [106.624791, 26.783438],
                        [106.611712, 26.768343],
                        [106.603663, 26.76357],
                        [106.595902, 26.764473],
                        [106.593171, 26.757118],
                        [106.583685, 26.758537],
                        [106.578511, 26.766537],
                        [106.56845, 26.76486],
                        [106.563275, 26.760473],
                        [106.548759, 26.762795],
                        [106.545165, 26.773504],
                        [106.548759, 26.78576],
                        [106.545309, 26.792468],
                        [106.552064, 26.798402],
                        [106.547465, 26.813879],
                        [106.553502, 26.8113],
                        [106.552352, 26.813879],
                        [106.554652, 26.822133],
                        [106.554077, 26.828323],
                        [106.5627, 26.837608],
                        [106.565, 26.847407],
                        [106.567875, 26.857205],
                        [106.574774, 26.861331],
                        [106.575349, 26.86855],
                        [106.570749, 26.874737],
                        [106.569599, 26.880409],
                        [106.574774, 26.883502],
                        [106.574774, 26.886595],
                        [106.5673, 26.893813],
                        [106.559826, 26.900514],
                        [106.565862, 26.909793]
                    ]
                ]
            }
        },
        {
            "type": "Feature",
            "properties": {
                "id": "31",
                "name": "谷堡乡",
                "cp": [106.514695, 26.856174],
                "childNum": 1
            },
            "geometry": {
                "type": "Polygon",
                "coordinates": [
                    [
                        [106.521306, 26.908246],
                        [106.525331, 26.899999],
                        [106.537979, 26.902576],
                        [106.546028, 26.903092],
                        [106.554652, 26.899483],
                        [106.560401, 26.898968],
                        [106.559826, 26.900514],
                        [106.5673, 26.893813],
                        [106.574774, 26.886595],
                        [106.574774, 26.883502],
                        [106.569599, 26.880409],
                        [106.570749, 26.874737],
                        [106.575349, 26.86855],
                        [106.574774, 26.861331],
                        [106.567875, 26.857205],
                        [106.565, 26.847407],
                        [106.5627, 26.837608],
                        [106.554077, 26.828323],
                        [106.554652, 26.822133],
                        [106.552352, 26.813879],
                        [106.553502, 26.8113],
                        [106.547465, 26.813879],
                        [106.541429, 26.816201],
                        [106.532661, 26.807947],
                        [106.516276, 26.807173],
                        [106.509521, 26.802529],
                        [106.501472, 26.80872],
                        [106.494573, 26.808205],
                        [106.486093, 26.803174],
                        [106.476607, 26.789243],
                        [106.469564, 26.793629],
                        [106.454185, 26.794016],
                        [106.444412, 26.799305],
                        [106.443118, 26.804722],
                        [106.453466, 26.817877],
                        [106.446136, 26.82626],
                        [106.445849, 26.846118],
                        [106.451311, 26.857979],
                        [106.463815, 26.867003],
                        [106.463815, 26.871257],
                        [106.45361, 26.87796],
                        [106.459791, 26.88608],
                        [106.46554, 26.891235],
                        [106.475888, 26.893297],
                        [106.485087, 26.898968],
                        [106.49716, 26.895875],
                        [106.513258, 26.899483],
                        [106.517282, 26.905154],
                        [106.521306, 26.908246]
                    ]
                ]
            }
        },
        {
            "type": "Feature",
            "properties": {
                "id": "29",
                "name": "洒坪镇",
                "cp": [106.465827, 26.925255],
                "childNum": 1
            },
            "geometry": {
                "type": "Polygon",
                "coordinates": [
                    [
                        [106.508083, 26.956688],
                        [106.505209, 26.943807],
                        [106.504634, 26.934531],
                        [106.508083, 26.923193],
                        [106.514982, 26.909277],
                        [106.517282, 26.905154],
                        [106.517282, 26.905154],
                        [106.513258, 26.899483],
                        [106.49716, 26.895875],
                        [106.485087, 26.898968],
                        [106.475888, 26.893297],
                        [106.46554, 26.891235],
                        [106.459791, 26.88608],
                        [106.45361, 26.87796],
                        [106.438806, 26.873061],
                        [106.431763, 26.862749],
                        [106.425296, 26.862362],
                        [106.426014, 26.869581],
                        [106.413222, 26.878475],
                        [106.401437, 26.897937],
                        [106.40043, 26.917653],
                        [106.381027, 26.926801],
                        [106.389651, 26.932985],
                        [106.406323, 26.937108],
                        [106.416672, 26.943291],
                        [106.42817, 26.945868],
                        [106.443693, 26.944322],
                        [106.448292, 26.953081],
                        [106.46209, 26.953597],
                        [106.471864, 26.960295],
                        [106.475313, 26.955142],
                        [106.490261, 26.955658],
                        [106.49716, 26.958234],
                        [106.508083, 26.956688]
                    ]
                ]
            }
        },
        {
            "type": "Feature",
            "properties": {
                "id": "102",
                "name": "白云区",
                "cp": [106.671072, 26.717884],
                "childNum": 1
            },
            "geometry": {
                "type": "Polygon",
                "coordinates": [
                    [
                        [106.67021, 26.787695],
                        [106.688032, 26.794274],
                        [106.702549, 26.793371],
                        [106.706429, 26.797241],
                        [106.70686, 26.793887],
                        [106.711316, 26.794661],
                        [106.714909, 26.806915],
                        [106.750267, 26.81259],
                        [106.762771, 26.818006],
                        [106.772221, 26.826099],
                        [106.779408, 26.823778],
                        [106.788606, 26.825841],
                        [106.809591, 26.808043],
                        [106.816777, 26.806496],
                        [106.825401, 26.810623],
                        [106.828563, 26.803658],
                        [106.828275, 26.798241],
                        [106.811315, 26.792049],
                        [106.795218, 26.753602],
                        [106.779408, 26.751279],
                        [106.771934, 26.746633],
                        [106.763023, 26.748182],
                        [106.760148, 26.743278],
                        [106.747212, 26.735535],
                        [106.754974, 26.724435],
                        [106.751812, 26.724693],
                        [106.749512, 26.720562],
                        [106.761585, 26.717206],
                        [106.757848, 26.709203],
                        [106.760723, 26.705588],
                        [106.758136, 26.693969],
                        [106.761585, 26.683124],
                        [106.752387, 26.68364],
                        [106.741751, 26.688805],
                        [106.732265, 26.682865],
                        [106.733702, 26.678733],
                        [106.71358, 26.682349],
                        [106.710705, 26.666078],
                        [106.707543, 26.666337],
                        [106.706968, 26.659105],
                        [106.704094, 26.660913],
                        [106.704381, 26.653422],
                        [106.690583, 26.640506],
                        [106.678222, 26.653938],
                        [106.671036, 26.655488],
                        [106.668161, 26.659879],
                        [106.670749, 26.661687],
                        [106.669599, 26.665303],
                        [106.663562, 26.666337],
                        [106.66155, 26.670986],
                        [106.653789, 26.66737],
                        [106.647464, 26.673568],
                        [106.636254, 26.672535],
                        [106.627055, 26.665562],
                        [106.626193, 26.667628],
                        [106.603771, 26.670211],
                        [106.59486, 26.675376],
                        [106.593997, 26.693969],
                        [106.585661, 26.707912],
                        [106.581349, 26.708945],
                        [106.583649, 26.71385],
                        [106.593135, 26.717465],
                        [106.59256, 26.730372],
                        [106.600609, 26.737858],
                        [106.595147, 26.743278],
                        [106.594285, 26.746633],
                        [106.57905, 26.745601],
                        [106.577325, 26.74302],
                        [106.558065, 26.744052],
                        [106.555191, 26.748182],
                        [106.556915, 26.754118],
                        [106.549154, 26.754118],
                        [106.549154, 26.762634],
                        [106.548759, 26.762795],
                        [106.563275, 26.760473],
                        [106.56845, 26.76486],
                        [106.578511, 26.766537],
                        [106.583685, 26.758537],
                        [106.593171, 26.757118],
                        [106.595902, 26.764473],
                        [106.603663, 26.76357],
                        [106.611712, 26.768343],
                        [106.624791, 26.783438],
                        [106.633271, 26.784212],
                        [106.635283, 26.781374],
                        [106.644482, 26.785115],
                        [106.649656, 26.790146],
                        [106.648219, 26.792339],
                        [106.661873, 26.791823],
                        [106.662305, 26.789243],
                        [106.67021, 26.787695]
                    ]
                ]
            }
        }
    ]
}
echarts.registerMap('XW', XwByMapJson);


// 随机0-1000的数
function randomData() {
    return Math.round(Math.random() * 1000);
}
//中心点坐标
var geoCoordMap = {
    "六桶镇": [106.453754, 27.111663],
    "大石乡": [106.461803, 27.046816],
    "六广镇": [106.449945, 26.98837],
    "小箐乡": [106.538266, 26.946898],
    "久长镇": [106.665898, 26.926286],
    "扎佐镇": [106.720515, 26.858752],
    "六屯镇": [106.841247, 26.96184],
    "龙场镇": [106.607831, 26.835029],
    "谷堡乡": [106.514695, 26.856174],
    "洒坪镇": [106.465827, 26.925255],
    "白云区": [106.671072, 26.717884]
};

var convertData = function(data) {
    var res = [];
    for (var i = 0; i < data.length; i++) {
        var geoCoord = geoCoordMap[data[i].name];
        if (geoCoord) {
            res.push({
                name: data[i].name,
                value: geoCoord.concat(data[i].value)
            });
        }
    }
    return res;
};

option = {
    cityId: {
        '六桶镇': 0,
        '大石乡': 1,
        '六广镇': 2,
        '小箐乡': 3,
        '久长镇': 4,
        '扎佐镇': 5,
        '六屯镇': 6,
        '龙场镇': 7,
        '洒坪镇': 8,
        '谷堡乡': 9,
        '白云区': 10
    },
    backgroundColor: '#404a59',
    title: {
        text: '各种植园区灾害情况',
        x: 'center',
        textStyle: {
            color: '#fff'
        }
    },
    legend: {
        textStyle: {
            color: '#fff'
        },
        orient: 'horizontal',
        top: '5%',
        data: ['气象灾害', '地质灾害', '病害', '虫害', '其他']
    },
    tooltip: {
        trigger: 'item',
        formatter: function(params) {
            return params.seriesName + ' : ' + params.value[2];
        }
    },
    // visualMap: {
    //     min: 0,
    //     max: 200,
    //     calculable: true,
    //     inRange: {
    //         color: ['#50a3ba', '#eac736', '#d94e5d']
    //     },
    //     textStyle: {
    //         color: '#fff'
    //     }
    // },
    geo: {
        map: 'XW',
        left: '8%',
        right: '8%',
        top: '12%',
        bottom: '4%',
        label: {
            normal: {
                show: false,
                color: "#fff",
                formatter: function(params, t) {
                    var cityName = params.name;
                    return "\n\n\n\n\n\n" + cityName + "\n\n ";
                }
            },
            emphasis: {
                show: true,
                color: "#fff",
                formatter: function(params, t) {
                    var cityName = params.name;
                    var cid = option.cityId[params.name],
                        zs = option.series,
                        len = zs.length;
                    var total = 0;
                    for (var i = 0; i < len; i++) {
                        total += zs[i].data[cid].value[2];
                    }
                    return "\n\n\n\n\n\n受灾总面积:" + total;
                }
            }
        },
        itemStyle: {
            normal: {
                areaColor: '#323c48',
                borderColor: '#111'
            },
            emphasis: {
                areaColor: '#2a333d'
            }
        }
    },

    series: [{
            name: '气象灾害',
            type: 'scatter',
            coordinateSystem: 'geo',
            data: convertData([{
                    name: '六桶镇',
                    value: randomData()
                },
                {
                    name: '大石乡',
                    value: randomData()
                },
                {
                    name: '六广镇',
                    value: randomData()
                },
                {
                    name: '小箐乡',
                    value: randomData()
                },
                {
                    name: '久长镇',
                    value: randomData()
                },
                {
                    name: '扎佐镇',
                    value: randomData()
                },
                {
                    name: '六屯镇',
                    value: randomData()
                },
                {
                    name: '龙场镇',
                    value: randomData()
                },
                {
                    name: '洒坪镇',
                    value: randomData()
                },
                {
                    name: '谷堡乡',
                    value: randomData()
                },
                {
                    name: '白云区',
                    value: randomData()
                }
            ]),
            symbol: 'circle',
            symbolSize: function(value, params) {
                var r = value[2] / 50;
                return r > 5 ? r > 20 ? 20 : r : 5;
            },
            symbolOffset: [0, 0],
            label: {
                normal: {
                    show: false
                },
                emphasis: {
                    show: false
                }
            },
            itemStyle: {
                normal: {
                    color: "#f34a4a"
                },
                emphasis: {
                    borderColor: '#fff',
                    borderWidth: 1
                }
            }
        },
        {
            name: '地质灾害',
            type: 'scatter',
            coordinateSystem: 'geo',
            data: convertData([{
                    name: '六桶镇',
                    value: randomData()
                },
                {
                    name: '大石乡',
                    value: randomData()
                },
                {
                    name: '六广镇',
                    value: randomData()
                },
                {
                    name: '小箐乡',
                    value: randomData()
                },
                {
                    name: '久长镇',
                    value: randomData()
                },
                {
                    name: '扎佐镇',
                    value: randomData()
                },
                {
                    name: '六屯镇',
                    value: randomData()
                },
                {
                    name: '龙场镇',
                    value: randomData()
                },
                {
                    name: '洒坪镇',
                    value: randomData()
                },
                {
                    name: '谷堡乡',
                    value: randomData()
                },
                {
                    name: '白云区',
                    value: randomData()
                }
            ]),
            symbol: 'circle',
            symbolSize: function(value, params) {
                var r = value[2] / 50;
                return r > 5 ? r > 20 ? 20 : r : 5;
            },
            symbolOffset: ['-20px', '20px'],
            label: {
                normal: {
                    show: false
                },
                emphasis: {
                    show: false
                }
            },
            itemStyle: {
                normal: {
                    color: "#ffd730"
                },
                emphasis: {
                    borderColor: '#fff',
                    borderWidth: 1
                }
            }
        },
        {
            name: '病害',
            type: 'scatter',
            coordinateSystem: 'geo',
            data: convertData([{
                    name: '六桶镇',
                    value: randomData()
                },
                {
                    name: '大石乡',
                    value: randomData()
                },
                {
                    name: '六广镇',
                    value: randomData()
                },
                {
                    name: '小箐乡',
                    value: randomData()
                },
                {
                    name: '久长镇',
                    value: randomData()
                },
                {
                    name: '扎佐镇',
                    value: randomData()
                },
                {
                    name: '六屯镇',
                    value: randomData()
                },
                {
                    name: '龙场镇',
                    value: randomData()
                },
                {
                    name: '洒坪镇',
                    value: randomData()
                },
                {
                    name: '谷堡乡',
                    value: randomData()
                },
                {
                    name: '白云区',
                    value: randomData()
                }
            ]),
            symbol: 'circle',
            symbolSize: function(value, params) {
                var r = value[2] / 50;
                return r > 5 ? r > 20 ? 20 : r : 5;
            },
            symbolOffset: ['10px', '-15px'],
            label: {
                normal: {
                    show: false
                },
                emphasis: {
                    show: false
                }
            },
            itemStyle: {
                normal: {
                    color: "#8cffd1"
                },
                emphasis: {
                    borderColor: '#fff',
                    borderWidth: 1
                }
            }
        },
        {
            name: '虫害',
            type: 'scatter',
            coordinateSystem: 'geo',
            data: convertData([{
                    name: '六桶镇',
                    value: randomData()
                },
                {
                    name: '大石乡',
                    value: randomData()
                },
                {
                    name: '六广镇',
                    value: randomData()
                },
                {
                    name: '小箐乡',
                    value: randomData()
                },
                {
                    name: '久长镇',
                    value: randomData()
                },
                {
                    name: '扎佐镇',
                    value: randomData()
                },
                {
                    name: '六屯镇',
                    value: randomData()
                },
                {
                    name: '龙场镇',
                    value: randomData()
                },
                {
                    name: '洒坪镇',
                    value: randomData()
                },
                {
                    name: '谷堡乡',
                    value: randomData()
                },
                {
                    name: '白云区',
                    value: randomData()
                }
            ]),
            symbol: 'circle',
            symbolSize: function(value, params) {
                var r = value[2] / 50;
                return r > 5 ? r > 20 ? 20 : r : 5;
            },
            symbolOffset: ['-20px', '-10px'],
            label: {
                normal: {
                    show: false
                },
                emphasis: {
                    show: false
                }
            },
            itemStyle: {
                normal: {
                    color: "#2a8abc"
                },
                emphasis: {
                    borderColor: '#fff',
                    borderWidth: 1
                }
            }
        },
        {
            name: '其他',
            type: 'scatter',
            coordinateSystem: 'geo',
            data: convertData([{
                    name: '六桶镇',
                    value: randomData()
                },
                {
                    name: '大石乡',
                    value: randomData()
                },
                {
                    name: '六广镇',
                    value: randomData()
                },
                {
                    name: '小箐乡',
                    value: randomData()
                },
                {
                    name: '久长镇',
                    value: randomData()
                },
                {
                    name: '扎佐镇',
                    value: randomData()
                },
                {
                    name: '六屯镇',
                    value: randomData()
                },
                {
                    name: '龙场镇',
                    value: randomData()
                },
                {
                    name: '洒坪镇',
                    value: randomData()
                },
                {
                    name: '谷堡乡',
                    value: randomData()
                },
                {
                    name: '白云区',
                    value: randomData()
                }
            ]),
            symbol: 'circle',
            symbolSize: function(value, params) {
                var r = value[2] / 50;
                return r > 5 ? r > 20 ? 20 : r : 5;
            },
            symbolOffset: ['15px', '15px'],
            label: {
                normal: {
                    show: false
                },
                emphasis: {
                    show: false
                }
            },
            itemStyle: {
                normal: {
                    color: "#067311"
                },
                emphasis: {
                    borderColor: '#fff',
                    borderWidth: 1
                }
            }
        },
        {
            name: '',
            type: 'scatter',
            coordinateSystem: 'geo',
            data: convertData([{
                    name: '六桶镇',
                    value: 0
                },
                {
                    name: '大石乡',
                    value: 0
                },
                {
                    name: '六广镇',
                    value: 0
                },
                {
                    name: '小箐乡',
                    value: 0
                },
                {
                    name: '久长镇',
                    value: 0
                },
                {
                    name: '扎佐镇',
                    value: 0
                },
                {
                    name: '六屯镇',
                    value: 0
                },
                {
                    name: '龙场镇',
                    value: 0
                },
                {
                    name: '洒坪镇',
                    value: 0
                },
                {
                    name: '谷堡乡',
                    value: 0
                },
                {
                    name: '白云区',
                    value: 0
                }
            ]),
            symbol: 'circle',
            symbolSize: 1,
            symbolOffset: [0, 0],
            label: {
                normal: {
                    show: true,
                    color: "#fff",
                    offset: [30, 0],
                    formatter: function(params) {
                        return params.name;
                    }
                },
                emphasis: {
                    show: true,
                    color: "#fff",
                    offset: [30, 0]
                }
            },
            itemStyle: {
                normal: {
                    color: "#f34a4a"
                },
                emphasis: {
                    borderColor: '#fff',
                    borderWidth: 1
                }
            }
        }
    ]
}