echarts实现-百度山西省热力图-标点显示天气信息

Echarts空气质量地图效果 我们要先把空气质量数据和地图数据结合起来: 地图数据有name这个属性 我们的不同城市空气质量也有name这个属性,这两个属性是一样的,都叫name,所以我们可以把他们关联起来: var airData = [ { name: '北京', value: 39.92 }, { name: '天津', value: 39.13 }, { name: '上海', value: 31.22 }, { name: '重庆', value: 66 }, { 阅读详情

一、效果图

在这里插入图片描述
在这里插入图片描述

三维地图数据暂时未加

二、代码

<!DOCTYPE html>
    <html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
        <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=KOmVjPVUAey1G2E8zNhPiuQ6QiEmAwZu"></script>
        <script type="text/javascript" src="./index/js/Heatmap.js"></script>
        <script src="./public/js/jquery-3.2.0.min.js" type="text/javascript" charset="utf-8"></script>
        <script src="./public/js/knockout.js" type="text/javascript" charset="utf-8"></script>
        <script src="./public/js/common.js"></script>
        <title>热力图功能示例</title>
        <style type="text/css">
            ul,li{list-style: none;margin:0;padding:0;float:left;}
            html{height:100%}
            body{height:100%;margin:0px;padding:0px;font-family:"微软雅黑";}
            #container{height:800px;width:100%;}
            #r-result{width:100%;}
        </style>
        <style>
            body,
            html,
            #container {
                overflow: hidden;
                width: 100%;
                height: 100%;
                margin: 0;
                font-family: "微软雅黑";
            }
        </style>
    </head>
    <body>

        <div id="container"></div>
        <div id="r-result">
            <input type="button"  onclick="openHeatmap();" value="显示热力图"/>
            <input type="button"  onclick="closeHeatmap();" value="关闭热力图"/>
        </div>
    </body>
    </html>
    <script type="text/javascript">
        // 创建地图实例
        var map = new BMap.Map("container");
        //设置地图的中心点
        var point = new BMap.Point(112.572396, 37.742323);

         // 初始化地图,设置中心点坐标和地图级别
        map.centerAndZoom(point, 7);
        // 加卫星地图
        map.addControl(new BMap.MapTypeControl());
        // 允许滚轮缩放
        map.enableScrollWheelZoom(true);     //开启鼠标滚轮缩放
        var marker = new BMap.Marker(point);  // 创建标注
        map.addOverlay(marker);               // 将标注添加到地图中
        // 添加带有定位的导航控件
        var navigationControl = new BMap.NavigationControl({
            // 靠左上角位置
            anchor: BMAP_ANCHOR_TOP_LEFT,
            // LARGE类型
            type: BMAP_NAVIGATION_CONTROL_LARGE,
            // 启用显示定位
            enableGeolocation: true
        });
        map.addControl(navigationControl);
        //解决标注点不居中的问题
        map.panBy(50, 150);//中心点偏移多少像素(width,height)为div 宽高的1/2;

		//背景颜色
		changeMapStyle('midnight');
        var cityName = '山西省';
        var bdary = new BMap.Boundary();
        bdary.get(cityName, function (rs) {       //获取行政区域
            var EN_JW = "180, 90;";         //东北角
            var NW_JW = "-180,  90;";       //西北角
            var WS_JW = "-180, -90;";       //西南角
            var SE_JW = "180, -90;";        //东南角
            //4.添加环形遮罩层
        var ply1 = new BMap.Polygon(rs.boundaries[0] + SE_JW + SE_JW + WS_JW + NW_JW + EN_JW + SE_JW,
        { strokeColor: "none", fillColor: "rgb(74,148,235)", fillOpacity:1, strokeOpacity: 0.5 }); //建立多边形覆盖物
            map.addOverlay(ply1);
        });

	function changeMapStyle(style){
        var mapStyle ={
            features: ["road","building","water","land"],//隐藏地图上的"poi",
            style : style,
        };
        map.setMapStyle(mapStyle);
    }
        //设置热力图的点参数
        //var points =[
        //{"lng":117.862179,"lat":30.940701,"count":50},
       // {"lng":117.226897,"lat":30.703597,"count":51},
       // {"lng":117.79901,"lat":30.956806,"count":15},
       // {"lng":117.899809,"lat":30.917902,"count":40},
       // {"lng":117.799091,"lat":30.956403,"count":100}];
		var points=[
    {
        "count": 34,
        "lat": 40.425915,
        "lng": 114.103311
    },
    {
        "count": 24,
        "lat": 40.367392,
        "lng": 113.755414
    },
    {
        "count": 40,
        "lat": 40.14715,
        "lng": 113.299329
    },
    {
        "count": 18,
        "lat": 40.102783,
        "lng": 113.373362
    },
    {
        "count": 32,
        "lat": 40.07186,
        "lng": 113.413833
    },
    {
        "count": 37,
        "lat": 40.089025,
        "lng": 113.257268
    },
    {
        "count": 66,
        "lat": 40.107325,
        "lng": 112.990665
    },
    {
        "count": 24,
        "lat": 40.03454,
        "lng": 113.552155
    },
    {
        "count": 57,
        "lat": 40.032754,
        "lng": 113.233398
    },
    {
        "count": 55,
        "lat": 39.963134,
        "lng": 113.148129
    },
    {
        "count": 30,
        "lat": 40.178421,
        "lng": 113.523777
    },
    {
        "count": 51,
        "lat": 40.112329,
        "lng": 113.303283
    },
    {
        "count": 87,
        "lat": 39.942381,
        "lng": 112.719342
    },
    {
        "count": 50,
        "lat": 40.081792,
        "lng": 113.304433
    },
    {
        "count": 24,
        "lat": 39.99486,
        "lng": 112.4735
    },
    {
        "count": 0,
        "lat": 40.063813,
        "lng": 116.25371
    },
    {
        "count": 68,
        "lat": 39.910925,
        "lng": 116.413384
    },
    {
        "count": 18,
        "lat": 39.868272,
        "lng": 112.054603
    },
    {
        "count": 43,
        "lat": 39.726399,
        "lng": 113.120639
    },
    {
        "count": 89,
        "lat": 39.711724,
        "lng": 113.69873
    },
    {
        "count": 1,
        "lat": 40.253152,
        "lng": 117.164857
    },
    {
        "count": 79,
        "lat": 39.53403,
        "lng": 112.822432
    },
    {
        "count": 82,
        "lat": 39.613957,
        "lng": 112.364496
    },
    {
        "count": 57,
        "lat": 39.552573,
        "lng": 112.807964
    },
    {
        "count": 89,
        "lat": 37.4752,
        "lng": 112.26879
    },
    {
        "count": 39,
        "lat": 39.504412,
        "lng": 113.107248
    },
    {
        "count": 40,
        "lat": 39.448825,
        "lng": 114.241368
    },
    {
        "count": 97,
        "lat": 39.512792,
        "lng": 111.785797
    },
    {
        "count": 75,
        "lat": 39.535909,
        "lng": 112.089957
    },
    {
        "count": 97,
        "lat": 39.393808,
        "lng": 112.419997
    },
    {
        "count": 66,
        "lat": 39.393833,
        "lng": 112.592307
    },
    {
        "count": 69,
        "lat": 39.391512,
        "lng": 111.140464
    },
    {
        "count": 96,
        "lat": 39.910925,
        "lng": 116.413384
    },
    {
        "count": 96,
        "lat": 39.195237,
        "lng": 113.271408
    },
    {
        "count": 78,
        "lat": 39.390702,
        "lng": 111.144449
    },
    {
        "count": 62,
        "lat": 38.91702,
        "lng": 111.85341
    },
    {
        "count": 66,
        "lat": 39.071689,
        "lng": 112.0041
    },
    {
        "count": 80,
        "lat": 39.479929,
        "lng": 112.822867
    },
    {
        "count": 21,
        "lat": 39.072728,
        "lng": 112.966552
    },
    {
        "count": 95,
        "lat": 39.028337,
        "lng": 111.092542
    },
    {
        "count": 91,
        "lat": 39.013539,
        "lng": 112.321534
    },
    {
        "count": 39,
        "lat": 39.004829,
        "lng": 112.841274
    },
    {
        "count": 15,
        "lat": 38.710151,
        "lng": 111.579478
    },
    {
        "count": 9,
        "lat": 38.736476,
        "lng": 112.717487
    },
    {
        "count": 53,
        "lat": 38.468804,
        "lng": 111.134392
    },
    {
        "count": 66,
        "lat": 38.422383,
        "lng": 112.740624
    },
    {
        "count": 26,
        "lat": 38.638408,
        "lng": 113.173729
    },
    {
        "count": 3,
        "lat": 38.56188,
        "lng": 111.29778
    },
    {
        "count": 50,
        "lat": 38.365147,
        "lng": 111.945432
    },
    {
        "count": 50,
        "lat": 38.432788,
        "lng": 112.622604
    },
    {
        "count": 91,
        "lat": 38.434272,
        "lng": 112.718247
    },
    {
        "count": 86,
        "lat": 38.41476,
        "lng": 112.739115
    },
    {
        "count": 59,
        "lat": 38.480223,
        "lng": 112.896984
    },
    {
        "count": 27,
        "lat": 38.479974,
        "lng": 112.963529
    },
    {
        "count": 1,
        "lat": 38.470955,
        "lng": 111.132586
    },
    {
        "count": 77,
        "lat": 38.285029,
        "lng": 111.678592
    },
    {
        "count": 78,
        "lat": 38.287329,
        "lng": 111.195035
    },
    {
        "count": 60,
        "lat": 38.177404,
        "lng": 111.61197
    },
    {
        "count": 44,
        "lat": 38.175477,
        "lng": 111.120607
    },
    {
        "count": 96,
        "lat": 38.073195,
        "lng": 111.803591
    },
    {
        "count": 32,
        "lat": 38.113795,
        "lng": 112.669764
    },
    {
        "count": 85,
        "lat": 38.075477,
        "lng": 112.708834
    },
    {
        "count": 25,
        "lat": 38.078499,
        "lng": 112.654393
    },
    {
        "count": 72,
        "lat": 38.120044,
        "lng": 113.444974
    },
    {
        "count": 92,
        "lat": 38.080454,
        "lng": 113.504353
    },
    {
        "count": 1,
        "lat": 38.052951,
        "lng": 111.09943
    },
    {
        "count": 86,
        "lat": 37.882873,
        "lng": 111.605608
    },
    {
        "count": 31,
        "lat": 37.913,
        "lng": 112.182453
    },
    {
        "count": 27,
        "lat": 37.880546,
        "lng": 112.48324
    },
    {
        "count": 25,
        "lat": 38.038314,
        "lng": 112.574591
    },
    {
        "count": 66,
        "lat": 38.078499,
        "lng": 112.654393
    },
    {
        "count": 3,
        "lat": 38.056727,
        "lng": 112.942685
    },
    {
        "count": 87,
        "lat": 38.080454,
        "lng": 113.504353
    },
    {
        "count": 99,
        "lat": 38.07635,
        "lng": 113.514279
    },
    {
        "count": 18,
        "lat": 37.997976,
        "lng": 112.517963
    },
    {
        "count": 76,
        "lat": 38.031842,
        "lng": 112.666271
    },
    {
        "count": 10,
        "lat": 37.960237,
        "lng": 112.573665
    },
    {
        "count": 80,
        "lat": 37.945943,
        "lng": 112.493605
    },
    {
        "count": 49,
        "lat": 37.900837,
        "lng": 112.620647
    },
    {
        "count": 39,
        "lat": 37.864607,
        "lng": 112.532682
    },
    {
        "count": 8,
        "lat": 40.13763,
        "lng": 116.279471
    },
    {
        "count": 63,
        "lat": 37.822795,
        "lng": 112.57144
    },
    {
        "count": 23,
        "lat": 37.820738,
        "lng": 112.554361
    },
    {
        "count": 85,
        "lat": 37.80138,
        "lng": 112.47612
    },
    {
        "count": 0,
        "lat": 37.74949,
        "lng": 112.580495
    },
    {
        "count": 48,
        "lat": 37.881417,
        "lng": 112.537844
    },
    {
        "count": 75,
        "lat": 37.779717,
        "lng": 112.509155
    },
    {
        "count": 23,
        "lat": 37.742323,
        "lng": 112.572396
    },
    {
        "count": 96,
        "lat": 37.71094,
        "lng": 112.582585
    },
    {
        "count": 63,
        "lat": 37.70394,
        "lng": 112.714504
    },
    {
        "count": 93,
        "lat": 37.716981,
        "lng": 112.783119
    },
    {
        "count": 44,
        "lat": 37.752791,
        "lng": 112.749448
    },
    {
        "count": 21,
        "lat": 37.584082,
        "lng": 112.783894
    },
    {
        "count": 28,
        "lat": 37.520072,
        "lng": 112.090548
    },
    {
        "count": 56,
        "lat": 37.588552,
        "lng": 112.296217
    },
    {
        "count": 29,
        "lat": 37.957211,
        "lng": 110.998415
    },
    {
        "count": 7,
        "lat": 37.810783,
        "lng": 111.008151
    },
    {
        "count": 99,
        "lat": 37.747893,
        "lng": 111.230333
    },
    {
        "count": 14,
        "lat": 37.557277,
        "lng": 110.801354
    },
    {
        "count": 54,
        "lat": 37.504036,
        "lng": 110.92328
    },
    {
        "count": 58,
        "lat": 37.527136,
        "lng": 111.14772
    },
    {
        "count": 88,
        "lat": 37.533871,
        "lng": 111.261241
    },
    {
        "count": 9,
        "lat": 37.46673,
        "lng": 111.12445
    },
    {
        "count": 78,
        "lat": 37.585295,
        "lng": 112.231899
    },
    {
        "count": 2,
        "lat": 37.692839,
        "lng": 112.759595
    },
    {
        "count": 96,
        "lat": 37.391531,
        "lng": 112.458666
    },
    {
        "count": 11,
        "lat": 37.535805,
        "lng": 111.217036
    },
    {
        "count": 63,
        "lat": 37.4443,
        "lng": 112.035599
    },
    {
        "count": 75,
        "lat": 37.862361,
        "lng": 113.587617
    },
    {
        "count": 73,
        "lat": 37.839645,
        "lng": 113.603813
    },
    {
        "count": 70,
        "lat": 37.912592,
        "lng": 113.738611
    },
    {
        "count": 79,
        "lat": 37.832499,
        "lng": 113.492343
    },
    {
        "count": 33,
        "lat": 37.885952,
        "lng": 113.622568
    },
    {
        "count": 33,
        "lat": 37.872577,
        "lng": 113.628238
    },
    {
        "count": 87,
        "lat": 37.806077,
        "lng": 113.654702
    },
    {
        "count": 63,
        "lat": 37.874056,
        "lng": 113.63306
    },
    {
        "count": 13,
        "lat": 37.863367,
        "lng": 113.63509
    },
    {
        "count": 14,
        "lat": 37.754273,
        "lng": 113.581927
    },
    {
        "count": 83,
        "lat": 37.957931,
        "lng": 112.829974
    },
    {
        "count": 87,
        "lat": 37.617884,
        "lng": 113.713613
    },
    {
        "count": 97,
        "lat": 37.589485,
        "lng": 113.840931
    },
    {
        "count": 13,
        "lat": 37.301553,
        "lng": 113.449855
    },
    {
        "count": 3,
        "lat": 37.449304,
        "lng": 111.136561
    },
    {
        "count": 59,
        "lat": 37.465855,
        "lng": 110.851677
    },
    {
        "count": 56,
        "lat": 37.242506,
        "lng": 110.913008
    },
    {
        "count": 46,
        "lat": 37.271292,
        "lng": 111.794597
    },
    {
        "count": 59,
        "lat": 37.524498,
        "lng": 111.15045
    },
    {
        "count": 6,
        "lat": 37.285945,
        "lng": 112.262723
    },
    {
        "count": 9,
        "lat": 37.290732,
        "lng": 112.374751
    },
    {
        "count": 38,
        "lat": 37.195601,
        "lng": 112.182456
    },
    {
        "count": 47,
        "lat": 37.004588,
        "lng": 110.853803
    },
    {
        "count": 21,
        "lat": 36.969702,
        "lng": 110.806919
    },
    {
        "count": 1,
        "lat": 37.151063,
        "lng": 111.785606
    },
    {
        "count": 19,
        "lat": 37.132843,
        "lng": 111.793313
    },
    {
        "count": 13,
        "lat": 36.895317,
        "lng": 111.999227
    },
    {
        "count": 53,
        "lat": 37.08281,
        "lng": 112.05942
    },
    {
        "count": 57,
        "lat": 36.913206,
        "lng": 112.47688
    },
    {
        "count": 32,
        "lat": 36.92228,
        "lng": 111.91427
    },
    {
        "count": 53,
        "lat": 36.86312,
        "lng": 111.81418
    },
    {
        "count": 36,
        "lat": 36.81341,
        "lng": 111.81154
    },
    {
        "count": 87,
        "lat": 37.07637,
        "lng": 112.9816
    },
    {
        "count": 92,
        "lat": 37.11691,
        "lng": 112.79101
    },
    {
        "count": 40,
        "lat": 36.99733,
        "lng": 113.35538
    },
    {
        "count": 5,
        "lat": 36.710199,
        "lng": 112.302793
    },
    {
        "count": 36,
        "lat": 36.705237,
        "lng": 112.831766
    },
    {
        "count": 75,
        "lat": 36.615542,
        "lng": 111.770429
    },
    {
        "count": 91,
        "lat": 36.49707,
        "lng": 111.862676
    },
    {
        "count": 51,
        "lat": 36.574607,
        "lng": 111.761509
    },
    {
        "count": 4,
        "lat": 36.554124,
        "lng": 111.699373
    },
    {
        "count": 53,
        "lat": 36.435515,
        "lng": 111.829715
    },
    {
        "count": 50,
        "lat": 36.633618,
        "lng": 110.937907
    },
    {
        "count": 45,
        "lat": 36.520867,
        "lng": 110.775544
    },
    {
        "count": 43,
        "lat": 36.418005,
        "lng": 111.102474
    },
    {
        "count": 66,
        "lat": 36.374258,
        "lng": 111.196938
    },
    {
        "count": 17,
        "lat": 36.108694,
        "lng": 110.47144
    },
    {
        "count": 4,
        "lat": 35.976442,
        "lng": 110.853498
    },
    {
        "count": 45,
        "lat": 36.34382,
        "lng": 112.315886
    },
    {
        "count": 92,
        "lat": 36.343011,
        "lng": 111.739689
    },
    {
        "count": 63,
        "lat": 36.26205,
        "lng": 111.709617
    },
    {
        "count": 17,
        "lat": 36.242887,
        "lng": 111.503639
    },
    {
        "count": 28,
        "lat": 36.356956,
        "lng": 111.707103
    },
    {
        "count": 51,
        "lat": 36.128419,
        "lng": 111.466508
    },
    {
        "count": 77,
        "lat": 36.229776,
        "lng": 111.559826
    },
    {
        "count": 24,
        "lat": 36.075672,
        "lng": 111.893163
    },
    {
        "count": 12,
        "lat": 35.682511,
        "lng": 113.324071
    },
    {
        "count": 39,
        "lat": 35.996911,
        "lng": 111.486143
    },
    {
        "count": 52,
        "lat": 36.084562,
        "lng": 111.58643
    },
    {
        "count": 7,
        "lat": 35.913315,
        "lng": 111.341033
    },
    {
        "count": 37,
        "lat": 36.08161,
        "lng": 111.007593
    },
    {
        "count": 41,
        "lat": 35.766752,
        "lng": 111.468029
    },
    {
        "count": 61,
        "lat": 35.737582,
        "lng": 112.401288
    },
    {
        "count": 83,
        "lat": 36.186163,
        "lng": 113.14343
    },
    {
        "count": 25,
        "lat": 35.65473,
        "lng": 111.808235
    },
    {
        "count": 82,
        "lat": 36.093742,
        "lng": 111.52553
    },
    {
        "count": 25,
        "lat": 36.369785,
        "lng": 113.121023
    },
    {
        "count": 53,
        "lat": 36.248002,
        "lng": 111.392909
    },
    {
        "count": 62,
        "lat": 36.442457,
        "lng": 112.985134
    },
    {
        "count": 11,
        "lat": 36.365443,
        "lng": 112.858259
    },
    {
        "count": 77,
        "lat": 36.490708,
        "lng": 113.376438
    },
    {
        "count": 44,
        "lat": 36.358427,
        "lng": 113.056022
    },
    {
        "count": 95,
        "lat": 35.703104,
        "lng": 111.368137
    },
    {
        "count": 33,
        "lat": 36.506434,
        "lng": 112.345959
    },
    {
        "count": 89,
        "lat": 36.585463,
        "lng": 112.633669
    },
    {
        "count": 62,
        "lat": 35.431151,
        "lng": 111.34003
    },
    {
        "count": 0,
        "lat": 36.339691,
        "lng": 113.235578
    },
    {
        "count": 43,
        "lat": 36.205989,
        "lng": 113.442517
    },
    {
        "count": 83,
        "lat": 35.141564,
        "lng": 110.963153
    },
    {
        "count": 11,
        "lat": 36.291508,
        "lng": 112.973899
    },
    {
        "count": 91,
        "lat": 36.201268,
        "lng": 113.122559
    },
    {
        "count": 62,
        "lat": 36.223227,
        "lng": 112.993604
    },
    {
        "count": 53,
        "lat": 36.277888,
        "lng": 113.356794
    },
    {
        "count": 33,
        "lat": 36.127345,
        "lng": 113.097999
    },
    {
        "count": 54,
        "lat": 36.128002,
        "lng": 112.884566
    },
    {
        "count": 42,
        "lat": 36.075537,
        "lng": 112.887779
    },
    {
        "count": 31,
        "lat": 36.576335,
        "lng": 111.709291
    },
    {
        "count": 33,
        "lat": 35.055862,
        "lng": 111.313924
    },
    {
        "count": 0,
        "lat": 35.074279,
        "lng": 111.003628
    },
    {
        "count": 87,
        "lat": 35.695397,
        "lng": 110.760743
    },
    {
        "count": 37,
        "lat": 35.668249,
        "lng": 110.647417
    },
    {
        "count": 70,
        "lat": 35.625665,
        "lng": 110.896017
    },
    {
        "count": 99,
        "lat": 35.62263,
        "lng": 111.231406
    },
    {
        "count": 80,
        "lat": 35.610404,
        "lng": 110.989415
    },
    {
        "count": 42,
        "lat": 35.508147,
        "lng": 111.311709
    },
    {
        "count": 23,
        "lat": 35.497276,
        "lng": 111.575487
    },
    {
        "count": 77,
        "lat": 35.362931,
        "lng": 111.23141
    },
    {
        "count": 78,
        "lat": 35.037902,
        "lng": 111.033555
    },
    {
        "count": 43,
        "lat": 35.355832,
        "lng": 111.220061
    },
    {
        "count": 29,
        "lat": 35.421109,
        "lng": 110.844576
    },
    {
        "count": 31,
        "lat": 35.147462,
        "lng": 111.226431
    },
    {
        "count": 54,
        "lat": 35.303015,
        "lng": 111.676607
    },
    {
        "count": 63,
        "lat": 35.10155,
        "lng": 110.56127
    },
    {
        "count": 23,
        "lat": 35.492181,
        "lng": 112.421454
    },
    {
        "count": 58,
        "lat": 35.146335,
        "lng": 110.820566
    },
    {
        "count": 51,
        "lat": 35.035358,
        "lng": 111.036871
    },
    {
        "count": 62,
        "lat": 35.138104,
        "lng": 110.962814
    },
    {
        "count": 87,
        "lat": 35.032707,
        "lng": 111.013389
    },
    {
        "count": 64,
        "lat": 35.679762,
        "lng": 112.16546
    },
    {
        "count": 25,
        "lat": 34.865899,
        "lng": 110.528872
    },
    {
        "count": 51,
        "lat": 36.956792,
        "lng": 112.603464
    },
    {
        "count": 7,
        "lat": 34.842925,
        "lng": 111.22348
    },
    {
        "count": 59,
        "lat": 35.358163,
        "lng": 110.778886
    },
    {
        "count": 97,
        "lat": 34.699388,
        "lng": 110.700612
    },
    {
        "count": 2,
        "lat": 35.884042,
        "lng": 112.984695
    },
    {
        "count": 49,
        "lat": 35.816518,
        "lng": 112.9439935
    },
    {
        "count": 30,
        "lat": 35.786527,
        "lng": 112.987244
    },
    {
        "count": 65,
        "lat": 36.537053,
        "lng": 112.058871
    },
    {
        "count": 59,
        "lat": 35.496285,
        "lng": 112.858578
    },
    {
        "count": 67,
        "lat": 36.323339,
        "lng": 113.280501
    },
    {
        "count": 88,
        "lat": 35.655939,
        "lng": 112.523712
    },
    {
        "count": 78,
        "lat": 35.547142,
        "lng": 112.968891
    },
    {
        "count": 65,
        "lat": 35.644064,
        "lng": 112.963154
    },
    {
        "count": 58,
        "lat": 39.305554,
        "lng": 114.421844
    },
    {
        "count": 49,
        "lat": 35.608118,
        "lng": 112.340102
    },
    {
        "count": 13,
        "lat": 38.497556,
        "lng": 111.573003
    },
    {
        "count": 3,
        "lat": 35.59977,
        "lng": 112.794401
    },
    {
        "count": 14,
        "lat": 40.45918,
        "lng": 124.072422
    },
    {
        "count": 15,
        "lat": 39.910925,
        "lng": 116.413384
    }
];
        //判断浏览器是否支持canvas
        if(!isSupportCanvas()){alert('热力图目前只支持有canvas支持的浏览器,您所使用的浏览器不能使用热力图功能~')}
        //热力图初始化(radius是指热力图半径)
        heatmapOverlay1 = new BMapLib.HeatmapOverlay({"radius":20});
        //地图添加热力图层
        map.addOverlay(heatmapOverlay1);
        //热力图层添加数据
        heatmapOverlay1.setDataSet({data:points,max:100});
        //判断浏览区是否支持canvas
        function isSupportCanvas(){
            var elem = document.createElement('canvas');
            return !!(elem.getContext && elem.getContext('2d'));
        }
        //显示热力图
        function openHeatmap(){
            heatmapOverlay1.show();
        }
        //关闭热力图
        function closeHeatmap(){
            heatmapOverlay1.hide();
        }
        openHeatmap();

        var citys = [
            {
                "pointName": "玉泉",
                "longitude": "114.103311",
                "latitude": "40.425915"
            },
            {
                "pointName": "阳高",
                "longitude": "113.755414",
                "latitude": "40.367392"
            },
            {
                "pointName": "北郊",
                "longitude": "113.299329",
                "latitude": "40.14715"
            },
            {
                "pointName": "大同市",
                "longitude": "113.373362",
                "latitude": "40.102783"
            },
            {
                "pointName": "御东",
                "longitude": "113.413833",
                "latitude": "40.07186"
            },
            {
                "pointName": "马军营",
                "longitude": "113.257268",
                "latitude": "40.089025"
            },
            {
                "pointName": "高山",
                "longitude": "112.990665",
                "latitude": "40.107325"
            },
            {
                "pointName": "官堡",
                "longitude": "113.552155",
                "latitude": "40.03454"
            },
            {
                "pointName": "三井",
                "longitude": "113.233398",
                "latitude": "40.032754"
            },
            {
                "pointName": "西万庄",
                "longitude": "113.148129",
                "latitude": "39.963134"
            },
            {
                "pointName": "羊坊",
                "longitude": "113.523777",
                "latitude": "40.178421"
            },
            {
                "pointName": "雁同",
                "longitude": "113.303283",
                "latitude": "40.112329"
            },
            {
                "pointName": "南京庄",
                "longitude": "112.719342",
                "latitude": "39.942381"
            },
            {
                "pointName": "平城",
                "longitude": "113.304433",
                "latitude": "40.081792"
            },
            {
                "pointName": "右玉",
                "longitude": "112.4735",
                "latitude": "39.99486"
            },
            {
                "pointName": "明海湖",
                "longitude": "112.054603",
                "latitude": "39.868272"
            },
            {
                "pointName": "亲和",
                "longitude": "113.120639",
                "latitude": "39.726399"
            },
            {
                "pointName": "浑源",
                "longitude": "113.69873",
                "latitude": "39.711724"
            },
            {
                "pointName": "翠微",
                "longitude": "112.822432",
                "latitude": "39.53403"
            },
            {
                "pointName": "向阳堡",
                "longitude": "112.364496",
                "latitude": "39.613957"
            },
            {
                "pointName": "七里沟",
                "longitude": "112.807964",
                "latitude": "39.552573"
            },
            {
                "pointName": "北岳",
                "longitude": "112.26879",
                "latitude": "37.4752"
            },
            {
                "pointName": "石店",
                "longitude": "113.107248",
                "latitude": "39.504412"
            },
            {
                "pointName": "灵丘",
                "longitude": "114.241368",
                "latitude": "39.448825"
            },
            {
                "pointName": "方城",
                "longitude": "111.785797",
                "latitude": "39.512792"
            },
            {
                "pointName": "水头",
                "longitude": "112.089957",
                "latitude": "39.535909"
            },
            {
                "pointName": "铺上",
                "longitude": "112.419997",
                "latitude": "39.393808"
            },
            {
                "pointName": "吉庄",
                "longitude": "112.592307",
                "latitude": "39.393833"
            },
            {
                "pointName": "古渡",
                "longitude": "111.140464",
                "latitude": "39.391512"
            },
            {
                "pointName": "繁峙",
                "longitude": "113.271408",
                "latitude": "39.195237"
            },
            {
                "pointName": "河曲",
                "longitude": "111.144449",
                "latitude": "39.390702"
            },
            {
                "pointName": "五寨",
                "longitude": "111.85341",
                "latitude": "38.91702"
            },
            {
                "pointName": "义井",
                "longitude": "112.0041",
                "latitude": "39.071689"
            },
            {
                "pointName": "安荣",
                "longitude": "112.822867",
                "latitude": "39.479929"
            },
            {
                "pointName": "代县",
                "longitude": "112.966552",
                "latitude": "39.072728"
            },
            {
                "pointName": "保德",
                "longitude": "111.092542",
                "latitude": "39.028337"
            },
            {
                "pointName": "凤凰",
                "longitude": "112.321534",
                "latitude": "39.013539"
            },
            {
                "pointName": "宁远",
                "longitude": "112.841274",
                "latitude": "39.004829"
            },
            {
                "pointName": "岢岚",
                "longitude": "111.579478",
                "latitude": "38.710151"
            },
            {
                "pointName": "原平",
                "longitude": "112.717487",
                "latitude": "38.736476"
            },
            {
                "pointName": "兴县",
                "longitude": "111.134392",
                "latitude": "38.468804"
            },
            {
                "pointName": "忻州",
                "longitude": "112.740624",
                "latitude": "38.422383"
            },
            {
                "pointName": "永安",
                "longitude": "113.173729",
                "latitude": "38.638408"
            },
            {
                "pointName": "北坡牵",
                "longitude": "111.29778",
                "latitude": "38.56188"
            },
            {
                "pointName": "静乐",
                "longitude": "111.945432",
                "latitude": "38.365147"
            },
            {
                "pointName": "忻都",
                "longitude": "112.622604",
                "latitude": "38.432788"
            },
            {
                "pointName": "秀容牵",
                "longitude": "112.718247",
                "latitude": "38.434272"
            },
            {
                "pointName": "匡村",
                "longitude": "112.739115",
                "latitude": "38.41476"
            },
            {
                "pointName": "长安",
                "longitude": "112.896984",
                "latitude": "38.480223"
            },
            {
                "pointName": "定襄",
                "longitude": "112.963529",
                "latitude": "38.479974"
            },
            {
                "pointName": "蔚汾",
                "longitude": "111.132586",
                "latitude": "38.470955"
            },
            {
                "pointName": "岚县",
                "longitude": "111.678592",
                "latitude": "38.285029"
            },
            {
                "pointName": "固贤",
                "longitude": "111.195035",
                "latitude": "38.287329"
            },
            {
                "pointName": "袁家村",
                "longitude": "111.61197",
                "latitude": "38.177404"
            },
            {
                "pointName": "白文牵",
                "longitude": "111.120607",
                "latitude": "38.175477"
            },
            {
                "pointName": "娄烦",
                "longitude": "111.803591",
                "latitude": "38.073195"
            },
            {
                "pointName": "上安",
                "longitude": "112.669764",
                "latitude": "38.113795"
            },
            {
                "pointName": "东方铝厂",
                "longitude": "112.708834",
                "latitude": "38.075477"
            },
            {
                "pointName": "盂县",
                "longitude": "112.654393",
                "latitude": "38.078499"
            },
            {
                "pointName": "阳泉北",
                "longitude": "113.444974",
                "latitude": "38.120044"
            },
            {
                "pointName": "温池",
                "longitude": "113.504353",
                "latitude": "38.080454"
            },
            {
                "pointName": "大居",
                "longitude": "111.09943",
                "latitude": "38.052951"
            },
            {
                "pointName": "云顶山",
                "longitude": "111.605608",
                "latitude": "37.882873"
            },
            {
                "pointName": "古交市",
                "longitude": "112.182453",
                "latitude": "37.913"
            },
            {
                "pointName": "南杜",
                "longitude": "112.48324",
                "latitude": "37.880546"
            },
            {
                "pointName": "赵家山",
                "longitude": "112.574591",
                "latitude": "38.038314"
            },
            {
                "pointName": "阳曲西牵",
                "longitude": "112.654393",
                "latitude": "38.078499"
            },
            {
                "pointName": "东凌井",
                "longitude": "112.942685",
                "latitude": "38.056727"
            },
            {
                "pointName": "温池",
                "longitude": "113.504353",
                "latitude": "38.080454"
            },
            {
                "pointName": "邓庄汇集",
                "longitude": "113.514279",
                "latitude": "38.07635"
            },
            {
                "pointName": "向阳",
                "longitude": "112.517963",
                "latitude": "37.997976"
            },
            {
                "pointName": "侯村",
                "longitude": "112.666271",
                "latitude": "38.031842"
            },
            {
                "pointName": "新店",
                "longitude": "112.573665",
                "latitude": "37.960237"
            },
            {
                "pointName": "东流",
                "longitude": "112.493605",
                "latitude": "37.945943"
            },
            {
                "pointName": "解放",
                "longitude": "112.620647",
                "latitude": "37.900837"
            },
            {
                "pointName": "迎西",
                "longitude": "112.532682",
                "latitude": "37.864607"
            },
            {
                "pointName": "长风",
                "longitude": "112.57144",
                "latitude": "37.822795"
            },
            {
                "pointName": "杨家堡",
                "longitude": "112.554361",
                "latitude": "37.820738"
            },
            {
                "pointName": "冶峪",
                "longitude": "112.47612",
                "latitude": "37.80138"
            },
            {
                "pointName": "康宁",
                "longitude": "112.580495",
                "latitude": "37.74949"
            },
            {
                "pointName": "滨河",
                "longitude": "112.537844",
                "latitude": "37.881417"
            },
            {
                "pointName": "晋阳",
                "longitude": "112.509155",
                "latitude": "37.779717"
            },
            {
                "pointName": "小店",
                "longitude": "112.572396",
                "latitude": "37.742323"
            },
            {
                "pointName": "汾东",
                "longitude": "112.582585",
                "latitude": "37.71094"
            },
            {
                "pointName": "榆次",
                "longitude": "112.714504",
                "latitude": "37.70394"
            },
            {
                "pointName": "天湖",
                "longitude": "112.783119",
                "latitude": "37.716981"
            },
            {
                "pointName": "福瑞",
                "longitude": "112.749448",
                "latitude": "37.752791"
            },
            {
                "pointName": "北田",
                "longitude": "112.783894",
                "latitude": "37.584082"
            },
            {
                "pointName": "广兴",
                "longitude": "112.090548",
                "latitude": "37.520072"
            },
            {
                "pointName": "阳煤太化",
                "longitude": "112.296217",
                "latitude": "37.588552"
            },
            {
                "pointName": "临县",
                "longitude": "110.998415",
                "latitude": "37.957211"
            },
            {
                "pointName": "杜家岭",
                "longitude": "111.008151",
                "latitude": "37.810783"
            },
            {
                "pointName": "峪口串补站",
                "longitude": "111.230333",
                "latitude": "37.747893"
            },
            {
                "pointName": "孟门牵",
                "longitude": "110.801354",
                "latitude": "37.557277"
            },
            {
                "pointName": "冯家垣",
                "longitude": "110.92328",
                "latitude": "37.504036"
            },
            {
                "pointName": "石州",
                "longitude": "111.14772",
                "latitude": "37.527136"
            },
            {
                "pointName": "车家湾",
                "longitude": "111.261241",
                "latitude": "37.533871"
            },
            {
                "pointName": "中钰",
                "longitude": "111.12445",
                "latitude": "37.46673"
            },
            {
                "pointName": "夏家营",
                "longitude": "112.231899",
                "latitude": "37.585295"
            },
            {
                "pointName": "晋中",
                "longitude": "112.759595",
                "latitude": "37.692839"
            },
            {
                "pointName": "东观",
                "longitude": "112.458666",
                "latitude": "37.391531"
            },
            {
                "pointName": "宜安",
                "longitude": "111.217036",
                "latitude": "37.535805"
            },
            {
                "pointName": "文水",
                "longitude": "112.035599",
                "latitude": "37.4443"
            },
            {
                "pointName": "阳泉",
                "longitude": "113.587617",
                "latitude": "37.862361"
            },
            {
                "pointName": "傅庄汇集",
                "longitude": "113.603813",
                "latitude": "37.839645"
            },
            {
                "pointName": "连庄",
                "longitude": "113.738611",
                "latitude": "37.912592"
            },
            {
                "pointName": "海落湾",
                "longitude": "113.492343",
                "latitude": "37.832499"
            },
            {
                "pointName": "长岭",
                "longitude": "113.622568",
                "latitude": "37.885952"
            },
            {
                "pointName": "桃东",
                "longitude": "113.628238",
                "latitude": "37.872577"
            },
            {
                "pointName": "红卫",
                "longitude": "113.654702",
                "latitude": "37.806077"
            },
            {
                "pointName": "兆铝",
                "longitude": "113.63306",
                "latitude": "37.874056"
            },
            {
                "pointName": "兆丰一期",
                "longitude": "113.63509",
                "latitude": "37.863367"
            },
            {
                "pointName": "苏峪",
                "longitude": "113.581927",
                "latitude": "37.754273"
            },
            {
                "pointName": "鹿泉",
                "longitude": "112.829974",
                "latitude": "37.957931"
            },
            {
                "pointName": "昔阳",
                "longitude": "113.713613",
                "latitude": "37.617884"
            },
            {
                "pointName": "黄岩",
                "longitude": "113.840931",
                "latitude": "37.589485"
            },
            {
                "pointName": "云山",
                "longitude": "113.449855",
                "latitude": "37.301553"
            },
            {
                "pointName": "金罗",
                "longitude": "111.136561",
                "latitude": "37.449304"
            },
            {
                "pointName": "龙花垣",
                "longitude": "110.851677",
                "latitude": "37.465855"
            },
            {
                "pointName": "留誉牵",
                "longitude": "110.913008",
                "latitude": "37.242506"
            },
            {
                "pointName": "汾阳",
                "longitude": "111.794597",
                "latitude": "37.271292"
            },
            {
                "pointName": "吕梁",
                "longitude": "111.15045",
                "latitude": "37.524498"
            },
            {
                "pointName": "洪善",
                "longitude": "112.262723",
                "latitude": "37.285945"
            },
            {
                "pointName": "顺丰牵",
                "longitude": "112.374751",
                "latitude": "37.290732"
            },
            {
                "pointName": "平遥",
                "longitude": "112.182456",
                "latitude": "37.195601"
            },
            {
                "pointName": "灵泉",
                "longitude": "110.853803",
                "latitude": "37.004588"
            },
            {
                "pointName": "段庄牵",
                "longitude": "110.806919",
                "latitude": "36.969702"
            },
            {
                "pointName": "孝义",
                "longitude": "111.785606",
                "latitude": "37.151063"
            },
            {
                "pointName": "胜溪",
                "longitude": "111.793313",
                "latitude": "37.132843"
            },
            {
                "pointName": "绵山",
                "longitude": "111.999227",
                "latitude": "36.895317"
            },
            {
                "pointName": "东湖龙",
                "longitude": "112.05942",
                "latitude": "37.08281"
            },
            {
                "pointName": "通利牵",
                "longitude": "112.47688",
                "latitude": "36.913206"
            },
            {
                "pointName": "永吉",
                "longitude": "111.91427",
                "latitude": "36.92228"
            },
            {
                "pointName": "安顺",
                "longitude": "111.81418",
                "latitude": "36.86312"
            },
            {
                "pointName": "希铝",
                "longitude": "111.81154",
                "latitude": "36.81341"
            },
            {
                "pointName": "榆社",
                "longitude": "112.98160 ",
                "latitude": "37.07637"
            },
            {
                "pointName": "河峪",
                "longitude": "112.79101",
                "latitude": "37.11691"
            },
            {
                "pointName": "辽阳",
                "longitude": "113.35538",
                "latitude": "36.99733"
            },
            {
                "pointName": "兴盛",
                "longitude": "112.302793",
                "latitude": "36.710199"
            },
            {
                "pointName": "沁州",
                "longitude": "112.831766",
                "latitude": "36.705237"
            },
            {
                "pointName": "杜坪牵",
                "longitude": "111.770429",
                "latitude": "36.615542"
            },
            {
                "pointName": "陶唐",
                "longitude": "111.862676",
                "latitude": "36.49707"
            },
            {
                "pointName": "霍州",
                "longitude": "111.761509",
                "latitude": "36.574607"
            },
            {
                "pointName": "寺庄",
                "longitude": "111.699373",
                "latitude": "36.554124"
            },
            {
                "pointName": "兴唐",
                "longitude": "111.829715",
                "latitude": "36.435515"
            },
            {
                "pointName": "曹城牵",
                "longitude": "110.937907",
                "latitude": "36.633618"
            },
            {
                "pointName": "德美",
                "longitude": "110.775544",
                "latitude": "36.520867"
            },
            {
                "pointName": "蒲县",
                "longitude": "111.102474",
                "latitude": "36.418005"
            },
            {
                "pointName": "肖家沟村",
                "longitude": "111.196938",
                "latitude": "36.374258"
            },
            {
                "pointName": "壶口",
                "longitude": "110.47144",
                "latitude": "36.108694"
            },
            {
                "pointName": "乡宁",
                "longitude": "110.853498",
                "latitude": "35.976442"
            },
            {
                "pointName": "罗云",
                "longitude": "112.315886",
                "latitude": "36.34382"
            },
            {
                "pointName": "明姜",
                "longitude": "111.739689",
                "latitude": "36.343011"
            },
            {
                "pointName": "辛堡牵",
                "longitude": "111.709617",
                "latitude": "36.26205"
            },
            {
                "pointName": "魏村",
                "longitude": "111.503639",
                "latitude": "36.242887"
            },
            {
                "pointName": "永乐",
                "longitude": "111.707103",
                "latitude": "36.356956"
            },
            {
                "pointName": "刘村",
                "longitude": "111.466508",
                "latitude": "36.128419"
            },
            {
                "pointName": "乔北",
                "longitude": "111.559826",
                "latitude": "36.229776"
            },
            {
                "pointName": "北韩村",
                "longitude": "111.893163",
                "latitude": "36.075672"
            },
            {
                "pointName": "岭北",
                "longitude": "113.324071",
                "latitude": "35.682511"
            },
            {
                "pointName": "张礼",
                "longitude": "111.486143",
                "latitude": "35.996911"
            },
            {
                "pointName": "尧都",
                "longitude": "111.58643",
                "latitude": "36.084562"
            },
            {
                "pointName": "古城",
                "longitude": "111.341033",
                "latitude": "35.913315"
            },
            {
                "pointName": "跃进牵",
                "longitude": "111.007593",
                "latitude": "36.08161"
            },
            {
                "pointName": "里村",
                "longitude": "111.468029",
                "latitude": "35.766752"
            },
            {
                "pointName": "郑庄",
                "longitude": "112.401288",
                "latitude": "35.737582"
            },
            {
                "pointName": "宏阳",
                "longitude": "113.14343",
                "latitude": "36.186163"
            },
            {
                "pointName": "翔山",
                "longitude": "111.808235",
                "latitude": "35.65473"
            },
            {
                "pointName": "临汾",
                "longitude": "111.52553",
                "latitude": "36.093742"
            },
            {
                "pointName": "安居",
                "longitude": "113.121023",
                "latitude": "36.369785"
            },
            {
                "pointName": "紫金山",
                "longitude": "111.392909",
                "latitude": "36.248002"
            },
            {
                "pointName": "侯堡",
                "longitude": "112.985134",
                "latitude": "36.442457"
            },
            {
                "pointName": "煤基油",
                "longitude": "112.858259",
                "latitude": "36.365443"
            },
            {
                "pointName": "正川",
                "longitude": "113.376438",
                "latitude": "36.490708"
            },
            {
                "pointName": "长钢",
                "longitude": "113.056022",
                "latitude": "36.358427"
            },
            {
                "pointName": "东吉",
                "longitude": "111.368137",
                "latitude": "35.703104"
            },
            {
                "pointName": "希望",
                "longitude": "112.345959",
                "latitude": "36.506434"
            },
            {
                "pointName": "红岭",
                "longitude": "112.633669",
                "latitude": "36.585463"
            },
            {
                "pointName": "仁和",
                "longitude": "111.34003",
                "latitude": "35.431151"
            },
            {
                "pointName": "潞城",
                "longitude": "113.235578",
                "latitude": "36.339691"
            },
            {
                "pointName": "平顺",
                "longitude": "113.442517",
                "latitude": "36.205989"
            },
            {
                "pointName": "久安",
                "longitude": "110.963153",
                "latitude": "35.141564"
            },
            {
                "pointName": "东鸣",
                "longitude": "112.973899",
                "latitude": "36.291508"
            },
            {
                "pointName": "长治西",
                "longitude": "113.122559",
                "latitude": "36.201268"
            },
            {
                "pointName": "康庄",
                "longitude": "112.993604",
                "latitude": "36.223227"
            },
            {
                "pointName": "祥井",
                "longitude": "113.356794",
                "latitude": "36.277888"
            },
            {
                "pointName": "苏店",
                "longitude": "113.097999",
                "latitude": "36.127345"
            },
            {
                "pointName": "西庄",
                "longitude": "112.884566",
                "latitude": "36.128002"
            },
            {
                "pointName": "大堡头",
                "longitude": "112.887779",
                "latitude": "36.075537"
            },
            {
                "pointName": "良平牵",
                "longitude": "111.709291",
                "latitude": "36.576335"
            },
            {
                "pointName": "沙峪牵",
                "longitude": "111.313924",
                "latitude": "35.055862"
            },
            {
                "pointName": "紫岭",
                "longitude": "111.003628",
                "latitude": "35.074279"
            },
            {
                "pointName": "侯家庄",
                "longitude": "110.760743",
                "latitude": "35.695397"
            },
            {
                "pointName": "龙门",
                "longitude": "110.647417",
                "latitude": "35.668249"
            },
            {
                "pointName": "梁村",
                "longitude": "110.896017",
                "latitude": "35.625665"
            },
            {
                "pointName": "新绛",
                "longitude": "111.231406",
                "latitude": "35.62263"
            },
            {
                "pointName": "稷山",
                "longitude": "110.989415",
                "latitude": "35.610404"
            },
            {
                "pointName": "任家山牵",
                "longitude": "111.311709",
                "latitude": "35.508147"
            },
            {
                "pointName": "绛县",
                "longitude": "111.575487",
                "latitude": "35.497276"
            },
            {
                "pointName": "闻喜",
                "longitude": "111.23141",
                "latitude": "35.362931"
            },
            {
                "pointName": "金鑫",
                "longitude": "111.033555",
                "latitude": "35.037902"
            },
            {
                "pointName": "桐乡",
                "longitude": "111.220061",
                "latitude": "35.355832"
            },
            {
                "pointName": "万荣",
                "longitude": "110.844576",
                "latitude": "35.421109"
            },
            {
                "pointName": "夏县",
                "longitude": "111.226431",
                "latitude": "35.147462"
            },
            {
                "pointName": "垣曲",
                "longitude": "111.676607",
                "latitude": "35.303015"
            },
            {
                "pointName": "临晋",
                "longitude": "110.56127",
                "latitude": "35.10155"
            },
            {
                "pointName": "景阳",
                "longitude": "112.421454",
                "latitude": "35.492181"
            },
            {
                "pointName": "顺达",
                "longitude": "110.820566",
                "latitude": "35.146335"
            },
            {
                "pointName": "盐湖",
                "longitude": "111.036871",
                "latitude": "35.035358"
            },
            {
                "pointName": "三家庄",
                "longitude": "110.962814",
                "latitude": "35.138104"
            },
            {
                "pointName": "运城",
                "longitude": "111.013389",
                "latitude": "35.032707"
            },
            {
                "pointName": "杏园",
                "longitude": "112.16546",
                "latitude": "35.679762"
            },
            {
                "pointName": "华圣",
                "longitude": "110.528872",
                "latitude": "34.865899"
            },
            {
                "pointName": "桃园",
                "longitude": "112.603464",
                "latitude": "36.956792"
            },
            {
                "pointName": "平陆",
                "longitude": "111.22348",
                "latitude": "34.842925"
            },
            {
                "pointName": "桥头",
                "longitude": "110.778886",
                "latitude": "35.358163"
            },
            {
                "pointName": "芮城",
                "longitude": "110.700612",
                "latitude": "34.699388"
            },
            {
                "pointName": "神农",
                "longitude": "112.984695",
                "latitude": "35.884042"
            },
            {
                "pointName": "晋丰",
                "longitude": "112.9439935",
                "latitude": "35.816518"
            },
            {
                "pointName": "定林",
                "longitude": "112.987244",
                "latitude": "35.786527"
            },
            {
                "pointName": "秦川",
                "longitude": "112.058871",
                "latitude": "36.537053"
            },
            {
                "pointName": "晋城",
                "longitude": "112.858578",
                "latitude": "35.496285"
            },
            {
                "pointName": "天脊",
                "longitude": "113.280501",
                "latitude": "36.323339"
            },
            {
                "pointName": "曲堤",
                "longitude": "112.523712",
                "latitude": "35.655939"
            },
            {
                "pointName": "丹河",
                "longitude": "112.968891",
                "latitude": "35.547142"
            },
            {
                "pointName": "北义城",
                "longitude": "112.963154",
                "latitude": "35.644064"
            },
            {
                "pointName": "海会",
                "longitude": "114.421844",
                "latitude": "39.305554"
            },
            {
                "pointName": "芹池",
                "longitude": "112.340102",
                "latitude": "35.608118"
            },
            {
                "pointName": "东沟",
                "longitude": "111.573003",
                "latitude": "38.497556"
            },
            {
                "pointName": "泽州东",
                "longitude": "112.794401",
                "latitude": "35.59977"
            }
        ]

        for (let i = 0; i < citys.length; i++) {
            var pt = new BMap.Point(citys[i].longitude, citys[i].latitude);
            var marker = new BMap.Marker(pt);
            map.addOverlay(marker);
            // 点标记添加点击事件
            //添加监听事件
            (function() {
                var thePoint = citys[i];
                marker.addEventListener("click",
                    function() {
                        showInfo(this,thePoint);
                    });
            })();
        }

        function ajaxGetBaseAsync(urls, param, callback) {
            $.ajax({
                type: "get",
                url: urls,
                data: param,
                dataType: "JSON",
                // contentType: "application/json",
                success: function(data) {
                    callback(data);
                }
            });
        };

        function showInfo(thisMarker,point) {
            let param = {
                location: point.longitude + "," + point.latitude,
                key: '6d48cb8a9ed4420db40381497b2dcc2d'
            }
            let weather;
            ajaxGetBaseAsync("https://devapi.qweather.com/v7/weather/now",param,function (res){
                console.log(res.now)
                weather = res.now;
                //获取点的信息
                var sContent =
                    '<ul style="margin:0 0 5px 0;padding:0.2em 0">'
                    +'<li style="line-height: 26px;font-size: 15px;">'
                    +'<span style="width: 50px;display: inline-block;">名称:</span>' + point.pointName + '</li>'+ '<br/>'
                    +'<li style="line-height: 26px;font-size: 15px;">'
                    +'<span style="width: 50px;display: inline-block;">天气:</span>' + weather.text + '<br/>'
                    +'<span style="width: 80px;display: inline-block;">当前温度:</span>' + weather.temp + "度"+ '<br/>'
                    +'<span style="width: 50px;display: inline-block;">风向:</span>' + weather.windDir + '<br/>'
                    +'<span style="width: 50px;display: inline-block;">风级:</span>' + weather.windScale + "级" + '</li>'
                    +'</ul>';
                var infoWindow = new BMap.InfoWindow(sContent); //创建信息窗口对象
                thisMarker.openInfoWindow(infoWindow); //图片加载完后重绘infoWindow
            })
        }

    </script>
<script>

</script>

三、附件:相关文章

1、百度API地图的标注不是居中显示,而是显示在左上角是怎么回事?已解决!
2、实时天气

echarts地图+热力图 综合了网上的大佬的概述,做了一下比较亲民的优化,json文件可以在下面的链接上定制,经纬度可以用百度地图的坐标拾取器和获取,图中以青岛为例,感谢大佬们的之前的贡献,可以让后来人用上现成的,话不多说,贴代码。Make A PieGallery - 分享你的可视化作品https://www.makeapie.com/editor.html?c=xmCAi_XNuJ <!DOCTYPE html> <html lang="en"> <head> <meta char 阅读详情

相关推荐

vue中使用echarts实现省市地图绘制,根据数据显示省市天气图标及温度信息

vue中使用echarts实现省市地图绘制,根据数据不同显示不同天气图标;显示省市的温度信息等数据。本文以吉林省地图为例,来实现吉林省下所有市的天气显示效果。你也可以显示中国地图或其他身份地图。原理是一样的哦。主要是通过label里面的formatter和rich来自定义样式的,在 rich 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。

在这里,我乐于倾囊相授,分享我的技术心得、项目实战经验、技术技巧。希望能够惠及更多的开发者,助力大家在技术的海洋中扬帆远航。 2340

Echart图的雷达图label文字加图标

Echart图的雷达图label文字加图标。根据数据的不同,有的数据展示笑脸图标,有的展示难过图标,有的不展示图标。

qq_59626859的博客 2921

echart每个城市的地图数据

echart每个城市的地图数据,很全,坐标和名称都很清楚

利用天气API和pyecharts实现天气地图可视化

pyecharts生成的图形本来是动态的,由于录制的GIF图暂时无法上传,所以只能暂时上传静态的PNG。 #! /usr/bin/env/python # -*- coding:UTF-8 -*- # Author: RenYi import requests from pyecharts.charts import Geo from pyecharts import options as o...

仁义 3116

2022年echarts山西省最新11市json地图

2022年自己调整过使用过的echarts山西省最新11市json地图,包括太原市、临汾市、朔州市、大同市、长治市、吕梁市、晋中市、忻州市、运城市、阳泉市、晋城市。echarts直接调用json文件。

Arduino Nano + MCP3422A0 ADC 毫欧表:3档分辨率(0.1mΩ-1.3kΩ)开尔文连接实测

本文详细介绍了如何使用Arduino Nano与MCP3422A0 ADC构建高精度毫欧表,采用四线制开尔文连接和三档量程设计,实现0.1mΩ-1.3kΩ的精确测量。通过精密恒流源和18位ADC技术,结合智能量程切换和数字滤波算法,显著提升测量精度和稳定性,适用于电子维修、PCB测试等场景。

weixin_28292761的博客 324

Echarts数据可视化 第4章 Echarts可视化图 4.10 热力图

Echarts数据可视化 第4章 Echarts可视化图 4.10 热力图

代码改变世界 2678

Depth Anything 3实战:如何用DINOv2 Transformer一键生成3D高斯点云?

本文详细介绍了Depth Anything 3(DA3)模型如何利用DINOv2 Transformer架构,实现从单张或多视角图像一键生成高质量3D高斯点云。DA3通过统一的深度-射线表示和自适应注意力机制,简化了传统复杂的3D重建流程,并可直接微调用于3D高斯渲染,为图形学、CV和内容创作领域提供了高效的端到端解决方案。

postgres8guard的博客 722

Vue 80 ,ECharts 6 ,Echarts中的热力图和漏斗图(在Vue中使用热力图和漏斗图)

⭐热力图 (Heatmap) Echarts的热力图用于展示两个维度数据矩阵中的值分布情况。它通过在平面上划分成多个矩形区域,并用不同的颜色填充这些区域来表示数据的大小或强度。颜色渐变从浅到深通常映射着数值从小到大,从而直观展示数据的集中程度和分布模式。热力图常应用于分析时间序列、地理位置、交叉分类数据的相关性和密度,比如人口密度分布、时间-温度变化等场景。 漏斗图 (Funnel) 漏斗图在Echarts中用来表现一系列流程中各阶段数据的转化情况,形态上像是一个倒置的漏斗,上部宽而下部窄。每个阶段用一个

AI Agent 全栈架构师(AI + GIS + Backend)& 数字芯片系统架构师(FPGA),NorthCity Smile的博客(NcSmile,博主域名:https://ncmile.blog.youkuaiyun.com) 3005

开发者体验度量:构建DevEx评估体系的方法论与工具

在深入讨论度量方法前,我们需要明确什么是开发者体验(DevEx)。许多人将其简化为"开发工具好不好用",这是一个危险的误解。开发者体验是指开发者在完成工作过程中的整体感受和效率,它由三大核心维度组成:工具与基础设施:开发、测试、部署工具链的效能流程与协作:工作流程的顺畅度和团队协作的效率文化与成长:支持实验、学习和专业发展的环境这三个维度相互作用,共同决定了开发者能否高效且愉悦地完成工作。开发者体验不是一个目的地,而是一段持续的旅程。

2401_88760782的博客 1429

番茄(西红柿)叶片病害检测数据集:12k+图像,10类,yolo标注

本文介绍了包含12,250张图像的番茄叶片病害检测数据集,涵盖10种常见病害类型及健康叶片,采用YOLO格式标注。数据集具有三大核心价值:科研层面填补病害样本空白,推动算法创新;产业应用支持精准诊断、早期预警,降低损失20-40%;社会生态方面减少农药使用15-30%,助力绿色农业。该数据集作为AI与农业结合的数字基础设施,适用于计算机视觉项目、科研实验等场景。

m0_73878864的博客 1135

pyecharts绘制天气热力图

pyecharts绘制天气热力图

qq_45720608的博客 6409

从零到一:基于Blazor和Elsa Workflows的工作流系统开发实战

本文详细介绍了如何利用Blazor和Elsa Workflows构建高效的工作流系统,从技术选型到生产环境部署,涵盖动态工作流建模、Blazor前端集成及性能优化等核心内容。通过实战案例,展示如何实现订单处理系统的自动化与灵活性,提升企业流程效率。

weixin_26875109的博客 428

Echarts 图表绘制:热力图

在这个实例中,我们创建了一个 3x7 的热力图,用于显示一周中每天不同时间段的活动强度。其中,xAxis 表示星期几,yAxis 表示时间段,visualMap 表示颜色对应的数据范围,series 表示热力图的数据。其中,需要注意的是,热力图的数据格式为二维数组,每个元素包含三个值,分别代表x轴坐标、y轴坐标和数据值。配置 echarts 图表的各种属性,包括 tooltip、animation、grid、xAxis、yAxis、visualMap 和 series。// 使用配置项显示图表。

梁辰兴的博客 7425

置顶必读(1) |《滚雪球学SpringBoot 3.x》· 高质量专栏介绍,你值得拥有!

《滚雪球学SpringBoot 3.x》 并不是普通的技术讲解合集,它是专为开发者精心设计的系统化学习路径。通过不断“滚动学习”,我们将带领你从基础入门到高阶应用,从理解每一行代码到设计和优化大规模分布式系统,最终帮助你成长为一位精通 spring架构 的工程师。

**My Coding Family** 12万+

Windows环境下Ollama的本地部署方案

本文主要介绍了Windows环境下Ollama的本地部署方案,希望对使用大语言模型的同学们有所帮助。 文章目录 1. 前言 2. Windows环境安装 3. API调用示例代码

herosunly的博客 11万+

echarts- 热力图, k线图,雷达图

热力图可以看成是一种矩形的散点图。热力图的矩形受itemStyle的影响。通常配合visualmap组件来根据值的大小做颜色的变化。热力图主要通过颜色去表现数值的大小,visualMap:视觉映射组件。

m0_74019046的博客 1854

【STM32 CubeMX】I2C中断方式与DMA方式

在STM32 CubeMX环境中,I2C(Inter-Integrated Circuit)通信协议的实现可以采用中断方式或DMA(Direct Memory Access)方式。中断方式通过触发中断来处理数据传输,而DMA方式则利用直接内存访问技术来实现数据传输,减轻了CPU的负担。在选择I2C通信方式时,开发者需要根据具体的应用需求和性能要求来选择合适的方式。STM32 CubeMX提供了图形化配置工具,使得配置I2C通信方式变得更加便捷。

m0_62599305的博客 7747

echars实现自定义山西省地图和地图下钻返回

相信很多人在做项目的时候都需要实现地图的功能,本篇文章主要实现了echar自定义地图、下钻以及返回上一层的功能。 生成地图的代码如下,这里应用的json文件是网络链接形式的,所以需要的朋友可以直接复制代码,然后导入query.js文件以及echars.js文件,即可显示 全部代码如下//省级地图 function shengji(){ $.get('https://geo.datav.aliyun.com/areas_v2/bound/14000...

weixin_45411740的博客 4294

假人有限元模型

假人模型,车辆碰撞假人有限元模型,适合做乘员安全的研究者利用

Camera2Demo

在Camera2 的基础上进行封装,使得Camera2一堆初始化逻辑与Activity分离,降低耦合度,完成预览拍照并保存的操作

【数据流图】Echarts地图实例(热力图&线图&markPoint)

效果展示 需求解读 分辨率自适应 左右框内标题及内容都可动态配置 同时包括地图热力图与地图线图 出发点添加涟漪动画 markPoint根据数据不同动态展示是否高亮 热力图颜色数值范围由返回数据动态控制 难点分析 series.type为lines或effectScatter显示的前提为geo属性有值,而展示热力图却需要series.type为map,就涉及到geo与map两属性重叠与z轴level问题 线图需要准确知道起点与终点坐标,若边框、标题和边框内元素都脱离在canvas画布外会导致无法准确定

写写写写到厌倦~ 1万+

最新的sdio 4.0 spec 协议标准 带书签 高清完整PDF版

Part-E1-SDIO-Specification-Ver4.00-Final-120220.pdf:最新的sdio 4.0 spec 协议标准 带书签 高清完整PDF版,包括SDIO 接口的外设,SDIO 接口官方协议等。

echart热力图项目

之前项目中运用echart热力图,在这里记录一下。 项目中如何实践echart echart应用到项目起来很简单,大概分为以下几步: vue项目中下载echart:npm install echarts --save 在组件中导入:import echarts from ‘echarts’ 给定一个有宽高的容器作为echart的画布如:<div class="echart-map">...

juliotang的博客 3251

visio安装包

Microsoft Office Visio 是一款专业的制图软件。利用经过更新的形状、协作工具和数据链接图表,创建专业级图表以简化复杂的信息。

echarts地图不同地区设置不同的颜色

echarts地图显示不同颜色

ld395353765的博客 7624

Echarts数据可视化series-line线图,开发全解+完美注释

mytextStyle={ color:"#333",//文字颜色 fontStyle:"normal",//italic斜体 oblique倾斜 fontWeight:"normal", //文字粗细bold bolder lighter 100 | 200 | 300 | 400... fontFamily:"sans-serif", //字体系列

2万+

如何用echarts搭建天气图表

显示7天内的天气预报,如果是当天的温度,要显示不同的图标。1.新建div绑定id,设置dom的宽高。2.设置好七天的数据,目前只是测试数据。如何用echarts搭建天气图表。3.在vue中定义数据。4.创建init方法。

小李在努力学习 1366

【可视化大屏开发】18. 加餐-ECharts+百度地图API实现热力图

基于ECharts联合百度API结构实现城市地图

pblh123的专栏 1791

基于echarts实现前端中国地图、中国热力地图和广东省地图的展示

利用echarts库在uni-app中实现前端中国地图、中国热力地图和广东省地图的展示

chenchuang0128的博客 4400
上一篇: TypeScript入门及面向对象
下一篇: vForm快速入门及postMessage通信
智汇风渔AI小白
博客等级 码龄7年 1万+粉丝 179原创
评论 1
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

智汇风渔AI小白

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值