关于flask入门教程-ajax+echarts实现地图热力图

热力图是通过密度函数进行可视化用于表示地图中点的密度的热图。它使人们能够独立于缩放因子感知点的密度。

以上是传统的热力图定义,现今热力图在网页分析、业务数据分析等其他领域也有较为广泛的应用。

1.热力图是利用获取的手机基站定位该区域的用户数量,通过用户数量渲染地图颜色。

2.实现展示该地区人的密度,关键就是数据的获取(坐标信息)。热力图同时还能告诉页面的哪些部分吸引了大多数访客的注意,这对那些对web分析数据没有什么经验的站长或管理员非常有用。

3.以特殊高亮的形式显示访客热衷的页面区域和访客所在的地理区域的图示,热力图同时还能告诉页面的哪些部分吸引了大多数访客的注意,这对那些对web分析数据没有什么经验的站长或管理员非常有用。

4.热力图主要显示一个城市的某个地方人员比较集中甚至拥挤程度,颜色越深表示人员越多,颜色浅代表人比较少,可以提前考虑自己的行程避开人多的地方。

d4a810f8406a3e03cf90258936270851.png

这个是基于echarts实现的地图热力图,调试的也最久,主要耗在了前端展示上。

@app.route('/getjson12', methods=['GET'])
def getjson12():
    # 千万不要先将内部的对象序列化成字符串,然后再序列化外边的对象。
    # 再复杂的结构都可以表示为一个dict,
    # 而之前不需要做任何序列化操作!!!
    # 经过多轮测试,提前序列化会导致很多解析问题!!!
    # 废弃原有的方案,使用两个表直接关联
    sql = "select a.longitude,a.latitude,b.GDP from citylocation a,citygdp b where a.cityname=b.cityname"
    result = db.session.execute(sql).fetchall()
    data = [[{'coord': [row[0],row[1]], 'elevation': row[2]}] for row in result]
    print(data)
    datadict = {'data': data}

    # data=[
    # [
    #  {'name': '遵义市', 'value': [106.9235642, 27.72917731, 908.76]},
    #  {'name': '自贡市', 'value': [104.7757383, 29.34187324, 647.73]}
    # ]
    response = jsonify(datadict)
    response.status_code = 200  # or 400 or whatever
    return jsonify(datadict)
@app.route('/echartdemo12')
def echartdemo12():
    return render_template('echartdemo12.html')

关于max、pointsize、blursize这几个值一直也没找到最合适的处理办法。

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <!-- 引入刚刚下载的 ECharts 文件 -->
    <!--script src="..\static\js\echarts.min.js"></script-->
    <script src="/static/js/echarts.min.js"></script>
    <script src="/static/js/jquery.js"></script>
    <script src="/static/js/bmap.js" type="text/javascript" charset="utf-8"></script>
    <script src="/static/js/china.js" type="text/javascript" charset="utf-8"></script>
    <script src="http://api.map.baidu.com/api?v=2.0&ak=akZILvuv0Ovr6uU3eKlaXP2Pgx9jprjO"></script>    
  </head>
  <body>
    <!-- 为 ECharts 准备一个定义了宽高的 DOM -->
    <div id="main" style="width: 1200px;height:800px;"></div>
    
    <script type="text/javascript">
      // 基于准备好的dom,初始化echarts实例
      
      var myChart = echarts.init(document.getElementById('main'));
      // 指定图表的配置项和数据
      myChart.option = {
     xAxis: {
       type: 'category',
       data: []
     },
     yAxis: {
       type: 'value'
     },
     series: [
       {
         data: [],
         type: 'line'
       }
     ]
      };
   
      // 使用刚指定的配置项和数据显示图表。
      myChart.hideLoading();
      $.ajax({
       url:'/getjson12',
       result:{},
       type:'GET',
       dataType:'json',
       success:function(result){


        //data =[[{'coord': [106.9235642, 27.72917731], 'elevation': 908.76}], [{'coord': [104.7757383, 29.34187324], 'elevation': 647.73}], [{'coord': [118.0489291, 36.81297732], 'elevation': 2866.75}], [{'coord': [104.6266294, 30.13201885], 'elevation': 657.9}], [{'coord': [114.0164347, 33.0133554], 'elevation': 1055.45}], [{'coord': [113.1279331, 27.83095331], 'elevation': 1274.8}], [{'coord': [113.5716888, 22.27372338], 'elevation': 1202.58}], [{'coord': [114.6522355, 33.62031651], 'elevation': 1227.9}]];
        
        //data=[[{'coord': [106.9235642, 27.72917731], 'elevation': 908.76}], [{'coord': [104.7757383, 29.34187324], 'elevation': 647.73}], [{'coord': [118.0489291, 36.81297732], 'elevation': 2866.75}], [{'coord': [104.6266294, 30.13201885], 'elevation': 657.9}], [{'coord': [114.0164347, 33.0133554], 'elevation': 1055.45}], [{'coord': [113.1279331, 27.83095331], 'elevation': 1274.8}], [{'coord': [113.5716888, 22.27372338], 'elevation': 1202.58}], [{'coord': [114.6522355, 33.62031651], 'elevation': 1227.9}], [{'coord': [122.2024466, 29.98784846], 'elevation': 633.45}], [{'coord': [106.5478234, 29.56583775], 'elevation': 7894.24}], [{'coord': [105.1700283, 37.51627081], 'elevation': 169.23}], [{'coord': [113.3873179, 22.51937679], 'elevation': 1826.32}], [{'coord': [113.6188587, 34.74816626], 'elevation': 4000}], [{'coord': [119.4518449, 32.2010717], 'elevation': 1957}], [{'coord': [112.4598339, 23.04980324], 'elevation': 1065.9}], [{'coord': [103.7153675, 27.34166893], 'elevation': 379.62}], [{'coord': [113.109587, 36.19521285], 'elevation': 920.2}], [{'coord': [112.9333745, 28.23171601], 'elevation': 4547.06}], [{'coord': [125.3170564, 43.81465336], 'elevation': 3369.7}], [{'coord': [117.6425833, 24.51629846], 'elevation': 1400.71}], [{'coord': [100.4481108, 38.92499918], 'elevation': 212.69}], [{'coord': [114.8798409, 40.76629221], 'elevation': 966.12}], [{'coord': [110.4742643, 29.11936498], 'elevation': 242.48}], [{'coord': [110.354765, 21.27314854], 'elevation': 1402.77}], [{'coord': [117.3178456, 34.81129402], 'elevation': 1362.04}], [{'coord': [111.0015197, 35.02710558], 'elevation': 827}], [{'coord': [112.0391963, 22.91776705], 'elevation': 394.27}], [{'coord': [113.1229884, 29.35964745], 'elevation': 1539.36}], [{'coord': [102.5452931, 24.35509544], 'elevation': 736.5}], [{'coord': [97.00619075, 33.00793631], 'elevation': 31.86}], [{'coord': [110.1602392, 22.63913181], 'elevation': 835.82}], [{'coord': [109.7296193, 38.28500391], 'elevation': 1756.67}], [{'coord': [111.608204, 26.42397794], 'elevation': 767.01}], [{'coord': [122.229814, 40.66549047], 'elevation': 1002.4}], [{'coord': [117.0639395, 28.26332646], 'elevation': 342.7}], [{'coord': [106.2264994, 38.48672373], 'elevation': 763.26}], [{'coord': [112.3498743, 28.55702602], 'elevation': 712.27}], [{'coord': [114.3897919, 27.79965496], 'elevation': 870}], [{'coord': [111.2808169, 30.69440274], 'elevation': 1547.32}], [{'coord': [104.6410019, 28.75530193], 'elevation': 870.85}], [{'coord': [81.3210651, 43.91562166], 'elevation': 891.37}], [{'coord': [128.8335853, 47.72524721], 'elevation': 202.4}], [{'coord': [113.5739992, 37.85614977], 'elevation': 429.4}], [{'coord': [111.9771537, 21.86068627], 'elevation': 641.8}], [{'coord': [119.4074836, 32.39608084], 'elevation': 2207.99}], [{'coord': [120.1585989, 33.34879402], 'elevation': 2266.26}], [{'coord': [129.501983, 42.88878189], 'elevation': 545}], [{'coord': [109.4842116, 36.58530771], 'elevation': 885.42}], [{'coord': [121.4427172, 37.46284389], 'elevation': 4358.46}], [{'coord': [103.0113123, 29.98318122], 'elevation': 286.54}], [{'coord': [118.7536983, 30.94293115], 'elevation': 525.7}], [{'coord': [113.8465655, 34.03735861], 'elevation': 1312.78}], [{'coord': [117.2783324, 34.20604556], 'elevation': 2866.93}], [{'coord': [122.0608515, 46.07552935], 'elevation': 261.39}], [{'coord': [114.4989249, 37.07007965], 'elevation': 1210.62}], [{'coord': [114.062997, 32.12519119], 'elevation': 1092.23}], [{'coord': [114.9125713, 27.82127297], 'elevation': 631.22}], [{'coord': [113.9208991, 35.30358629], 'elevation': 1181.45}], [{'coord': [112.7277137, 38.41578821], 'elevation': 435.4}], [{'coord': [113.9114206, 30.92704394], 'elevation': 800.67}], [{'coord': [112.2058553, 32.08988367], 'elevation': 1538.3}], [{'coord': [109.7341106, 28.3152203], 'elevation': 303.44}], [{'coord': [112.9386417, 27.8331964], 'elevation': 894.01}], [{'coord': [108.704336, 34.33099832], 'elevation': 1098.7}], [{'coord': [114.3171008, 29.84391853], 'elevation': 520.33}], [{'coord': [116.0413985, 43.93127123], 'elevation': 591.25}], [{'coord': [100.7962265, 22.01104779], 'elevation': 160.99}], [{'coord': [101.7762661, 36.61715389], 'elevation': 628.28}], [{'coord': [108.9396288, 34.26657426], 'elevation': 3241.49}], [{'coord': [102.636287, 37.92804404], 'elevation': 228.77}], [{'coord': [114.2999175, 30.59549293], 'elevation': 5515.76}], [{'coord': [111.2740684, 23.47949807], 'elevation': 573.7}], [{'coord': [106.1938101, 37.99692224], 'elevation': 210}], [{'coord': [118.3797487, 31.34062729], 'elevation': 1108.63}], [{'coord': [120.2984351, 31.56805091], 'elevation': 5758}], [{'coord': [87.61444413, 43.82445861], 'elevation': 1311}], [{'coord': [113.1253055, 40.99301248], 'elevation': 550}], [{'coord': [106.8180669, 39.68954559], 'elevation': 391.12}], [{'coord': [104.2486329, 23.36566622], 'elevation': 329.9}], [{'coord': [120.6953222, 27.99754975], 'elevation': 2925.57}], [{'coord': [109.5046201, 34.50129919], 'elevation': 801.42}], [{'coord': [119.1560345, 36.70623085], 'elevation': 3090.9}], [{'coord': [122.1153614, 37.51203397], 'elevation': 1944.7}], [{'coord': [89.18680113, 42.94982521], 'elevation': 185.3}], [{'coord': [109.1850114, 27.73477239], 'elevation': 296.9}], [{'coord': [117.8054873, 30.94680757], 'elevation': 466.6}], [{'coord': [108.9404213, 34.89781612], 'elevation': 187.73}], [{'coord': [122.2601902, 43.61706336], 'elevation': 1176.23}], [{'coord': [125.9340429, 41.7262472], 'elevation': 627.1}], [{'coord': [123.8359396, 42.28449702], 'elevation': 722.1}], [{'coord': [105.7210149, 34.58217819], 'elevation': 300.22}], [{'coord': [117.1946744, 39.0831461], 'elevation': 9108.83}], [{'coord': [118.1741145, 39.62915804], 'elevation': 4469.08}], [{'coord': [119.9183846, 32.45800045], 'elevation': 2002.58}], [{'coord': [117.0815522, 36.20000525], 'elevation': 2051.7}], [{'coord': [112.5443051, 37.87012419], 'elevation': 1778.05}], [{'coord': [121.416326, 28.65932803], 'elevation': 2415.12}], [{'coord': [82.97716272, 46.74465094], 'elevation': 300.2}], [{'coord': [105.5894809, 30.53562871], 'elevation': 495.23}], [{'coord': [113.3766354, 31.69183407], 'elevation': 401.66}], [{'coord': [126.9736599, 46.63471214], 'elevation': 733.4}], [{'coord': [116.9798454, 33.64089908], 'elevation': 650.3}], [{'coord': [118.2699985, 33.96333773], 'elevation': 1015.21}], [{'coord': [120.5811425, 31.30106785], 'elevation': 9000}], [{'coord': [124.8188255, 45.13981382], 'elevation': 1102.8}], [{'coord': [124.3441615, 43.16437442], 'elevation': 789.1}], [{'coord': [112.4258475, 39.32997887], 'elevation': 670.1}], [{'coord': [131.1514152, 46.64467677], 'elevation': 376.7}], [{'coord': [106.3633681, 39.01821095], 'elevation': 298.07}], [{'coord': [114.5088465, 38.04165214], 'elevation': 3401}], [{'coord': [110.7834788, 32.65274451], 'elevation': 736.8}], [{'coord': [123.4253224, 41.80328501], 'elevation': 5017}], [{'coord': [114.0527611, 22.54581913], 'elevation': 9510.91}], [{'coord': [120.5820428, 29.99840081], 'elevation': 2782.74}], [{'coord': [111.4626624, 27.24320199], 'elevation': 730.33}], [{'coord': [113.5923346, 24.81345609], 'elevation': 683.1}], [{'coord': [117.9384709, 28.45827785], 'elevation': 901}], [{'coord': [121.4691603, 31.23231042], 'elevation': 16872.42}], [{'coord': [115.6508955, 34.41554613], 'elevation': 1140}], [{'coord': [109.9354935, 33.87209676], 'elevation': 285.9}], [{'coord': [115.3703437, 22.7888421], 'elevation': 469.99}], [{'coord': [116.6774959, 23.35602649], 'elevation': 1203.25}], [{'coord': [91.76501828, 29.23914171], 'elevation': 54.03}], [{'coord': [118.0844472, 24.48248217], 'elevation': 2053.74}], [{'coord': [109.5078052, 18.25453332], 'elevation': 230.79}], [{'coord': [117.633822, 26.26685733], 'elevation': 972.71}], [{'coord': [111.1942272, 34.77339346], 'elevation': 874.39}], [{'coord': [119.5214538, 35.41665241], 'elevation': 1025.08}], [{'coord': [88.87854452, 29.27012232], 'elevation': 86.3}], [{'coord': [118.5823703, 24.9105711], 'elevation': 3564.76}], [{'coord': [118.8695953, 28.93892253], 'elevation': 752.78}], [{'coord': [103.7941393, 25.49300739], 'elevation': 1005.5}], [{'coord': [107.6277483, 35.73906858], 'elevation': 357.61}], [{'coord': [113.0505649, 23.68426231], 'elevation': 1112.5}], [{'coord': [120.377381, 36.06695117], 'elevation': 5666.19}], [{'coord': [119.5947199, 39.93427061], 'elevation': 930.49}], [{'coord': [108.650804, 21.98385822], 'elevation': 504.18}], [{'coord': [104.903924, 25.0909246], 'elevation': 324.52}], [{'coord': [107.5179504, 26.25750319], 'elevation': 356}], [{'coord': [107.9787081, 26.58709537], 'elevation': 312.57}], [{'coord': [123.911636, 47.35230182], 'elevation': 852.6}], [{'coord': [130.9972546, 45.76977855], 'elevation': 302}], [{'coord': [100.9689665, 22.78075735], 'elevation': 247.3}], [{'coord': [115.0234623, 35.76215406], 'elevation': 774.81}], [{'coord': [119.0029943, 25.45688325], 'elevation': 816.98}], [{'coord': [113.8493545, 27.62625401], 'elevation': 520.39}], [{'coord': [106.6608735, 35.54313997], 'elevation': 231.89}], [{'coord': [113.1865269, 33.76760361], 'elevation': 1312.1}], [{'coord': [122.0652316, 41.11791582], 'elevation': 926.5}], [{'coord': [101.7170599, 26.58590677], 'elevation': 523.99}], [{'coord': [98.85269467, 25.85586947], 'elevation': 53.36}], [{'coord': [119.521636, 26.66972812], 'elevation': 736.45}], [{'coord': [121.539795, 29.87088522], 'elevation': 5125.82}], [{'coord': [105.0551226, 29.58280293], 'elevation': 690.28}], [{'coord': [112.5224871, 32.9925948], 'elevation': 1955.84}], [{'coord': [120.8901076, 31.98215841], 'elevation': 3417.88}], [{'coord': [118.1724011, 26.64496038], 'elevation': 728.73}], [{'coord': [108.3615594, 22.82032196], 'elevation': 1800.43}], [{'coord': [118.791695, 32.06232359], 'elevation': 5010.36}], [{'coord': [106.1065663, 30.84015413], 'elevation': 827.82}], [{'coord': [115.8531859, 28.68647798], 'elevation': 2207.11}], [{'coord': [92.05761118, 31.47871485], 'elevation': 51.15}], [{'coord': [129.6261041, 44.54969954], 'elevation': 781}], [{'coord': [104.6764962, 31.46971942], 'elevation': 960.2}], [{'coord': [116.117641, 24.29100482], 'elevation': 612.36}], [{'coord': [103.8464298, 30.07824843], 'elevation': 552.25}], [{'coord': [110.9209445, 21.66576606], 'elevation': 1492.09}], [{'coord': [118.4994374, 31.69874146], 'elevation': 811.01}], [{'coord': [111.1378527, 37.51777337], 'elevation': 845.5}], [{'coord': [114.010622, 33.58290125], 'elevation': 682}], [{'coord': [112.4480866, 34.6191517], 'elevation': 2321.2}], [{'coord': [105.4386581, 28.87487998], 'elevation': 714.81}], [{'coord': [111.990481, 27.70499879], 'elevation': 680.72}], [{'coord': [104.9191903, 33.40270968], 'elevation': 169.4}], [{'coord': [117.0291323, 25.10336214], 'elevation': 991.49}], [{'coord': [104.8278129, 26.59626563], 'elevation': 500.64}], [{'coord': [116.5005646, 31.74703183], 'elevation': 676.1}], [{'coord': [109.411304, 24.32815154], 'elevation': 1260.3}], [{'coord': [118.3419832, 35.0521819], 'elevation': 2400}], [{'coord': [103.2082859, 35.60152658], 'elevation': 106.38}], [{'coord': [111.5126412, 36.0881667], 'elevation': 892.1}], [{'coord': [100.0783331, 23.88015807], 'elevation': 218.3}], [{'coord': [94.36032592, 29.65181336], 'elevation': 53.1}], [{'coord': [115.9796954, 36.45661771], 'elevation': 1606.51}], [{'coord': [125.1371162, 42.88538694], 'elevation': 410.1}], [{'coord': [123.1670176, 41.26732385], 'elevation': 735.3}], [{'coord': [102.266224, 27.88485261], 'elevation': 784.19}], [{'coord': [119.2157459, 34.59756402], 'elevation': 1150.81}], [{'coord': [119.9183972, 28.47103478], 'elevation': 644.04}], [{'coord': [100.2292387, 26.88031004], 'elevation': 143.59}], [{'coord': [103.7634075, 29.55481269], 'elevation': 743.92}], [{'coord': [116.7006858, 39.5198873], 'elevation': 1331.1}], [{'coord': [103.8319523, 36.06155856], 'elevation': 1100.39}], [{'coord': [117.670857, 36.21369533], 'elevation': 546.33}], [{'coord': [109.2171524, 23.75293894], 'elevation': 385.24}], [{'coord': [91.13932178, 29.64827666], 'elevation': 178.91}], [{'coord': [102.7207429, 25.04067606], 'elevation': 2120.37}], [{'coord': [76.16460238, 39.71414332], 'elevation': 38}], [{'coord': [84.88680374, 45.57907801], 'elevation': 710.2}], [{'coord': [114.3017875, 34.79857281], 'elevation': 930.22}], [{'coord': [75.98680993, 39.47018052], 'elevation': 375}], [{'coord': [98.49375654, 39.73164639], 'elevation': 405.03}], [{'coord': [115.9969126, 29.7076493], 'elevation': 1032.06}], [{'coord': [117.1762445, 29.3096995], 'elevation': 461.5}], [{'coord': [112.2340279, 30.33771138], 'elevation': 837.1}], [{'coord': [112.1934231, 31.03762004], 'elevation': 730.07}], [{'coord': [112.7462041, 37.68634055], 'elevation': 763.8}], [{'coord': [112.8456418, 35.4912631], 'elevation': 730.5}], [{'coord': [121.1214196, 41.09307352], 'elevation': 916}], [{'coord': [119.6427218, 29.08213636], 'elevation': 2094.7}], [{'coord': [102.1860474, 38.51964831], 'elevation': 210.51}], [{'coord': [116.3681371, 23.55239774], 'elevation': 1008.99}], [{'coord': [113.2354554, 35.21638822], 'elevation': 1247.61}], [{'coord': [113.0763915, 22.58141262], 'elevation': 1550.37}], [{'coord': [98.28854582, 39.772293], 'elevation': 183.91}], [{'coord': [120.75423, 30.75621991], 'elevation': 2296}], [{'coord': [130.3111332, 46.79770871], 'elevation': 512.5}], [{'coord': [113.6810911, 34.76924318], 'elevation': 343.4}], [{'coord': [116.581975, 35.41530996], 'elevation': 2542.8}], [{'coord': [116.9891449, 36.66506686], 'elevation': 3910.8}], [{'coord': [126.5438643, 43.83561954], 'elevation': 1800.6}], [{'coord': [114.9879616, 27.11641023], 'elevation': 720.53}], [{'coord': [130.9618926, 45.29292426], 'elevation': 419.5}], [{'coord': [114.4112285, 23.11433866], 'elevation': 1729.9}], [{'coord': [115.0331502, 30.20208147], 'elevation': 687}], [{'coord': [118.3322832, 29.71708254], 'elevation': 309.3}], [{'coord': [102.013349, 35.51994632], 'elevation': 43.68}], [{'coord': [114.8672466, 30.45655588], 'elevation': 862.3}], [{'coord': [116.994531, 32.62753812], 'elevation': 603.5}], [{'coord': [116.7928684, 33.95725992], 'elevation': 461.6}], [{'coord': [119.0098378, 33.61175391], 'elevation': 1345.07}], [{'coord': [109.993821, 27.55829783], 'elevation': 674.92}], [{'coord': [120.0819525, 30.89640398], 'elevation': 1301.56}], [{'coord': [120.8316503, 40.7095054], 'elevation': 531.4}], [{'coord': [119.7583897, 49.20960951], 'elevation': 932.01}], [{'coord': [111.7419269, 40.84086523], 'elevation': 1865.71}], [{'coord': [102.419055, 23.37166259], 'elevation': 650.42}], [{'coord': [112.566659, 26.89740922], 'elevation': 1420.34}], [{'coord': [115.692747, 37.73461477], 'elevation': 781.5}], [{'coord': [127.5211429, 50.24364023], 'elevation': 261.4}], [{'coord': [130.2902475, 47.34748904], 'elevation': 251}], [{'coord': [114.2913507, 35.7472903], 'elevation': 427.74}], [{'coord': [111.5616353, 24.40659891], 'elevation': 380}], [{'coord': [115.4747873, 35.23412684], 'elevation': 1151.58}], [{'coord': [114.6957615, 23.7461946], 'elevation': 477.19}], [{'coord': [108.081007, 24.6956751], 'elevation': 467}], [{'coord': [79.92030127, 37.11449924], 'elevation': 100.59}], [{'coord': [117.2217886, 31.82343995], 'elevation': 2702.5}], [{'coord': [120.1503805, 30.27641481], 'elevation': 5945.82}], [{'coord': [107.0188336, 33.06981208], 'elevation': 509.7}], [{'coord': [114.4870296, 36.61203878], 'elevation': 2342.2}], [{'coord': [97.36894734, 37.37665732], 'elevation': 365.49}], [{'coord': [100.6190909, 36.28683148], 'elevation': 69.89}], [{'coord': [110.3245171, 20.03281627], 'elevation': 590.55}], [{'coord': [102.1022646, 36.502147], 'elevation': 173.31}], [{'coord': [100.8994719, 36.95431158], 'elevation': 54.53}], [{'coord': [93.51328622, 42.81696646], 'elevation': 165.96}], [{'coord': [126.5288784, 45.80175924], 'elevation': 3665.9}], [{'coord': [100.2436805, 34.4731433], 'elevation': 20.43}], [{'coord': [110.2856192, 25.27640391], 'elevation': 1108.63}], [{'coord': [106.6265367, 26.65114407], 'elevation': 1121.82}], [{'coord': [109.5947374, 23.11442232], 'elevation': 527.8}], [{'coord': [113.2591135, 23.13183682], 'elevation': 10604.48}], [{'coord': [105.8396287, 32.43780735], 'elevation': 321.87}], [{'coord': [106.6294221, 30.45870446], 'elevation': 537.2}], [{'coord': [106.2384043, 36.01602421], 'elevation': 104.03}], [{'coord': [114.928843, 25.83240066], 'elevation': 1119.47}], [{'coord': [101.9607982, 30.05233857], 'elevation': 122.83}], [{'coord': [102.9095347, 34.98442561], 'elevation': 67.84}], [{'coord': [115.8087528, 32.89209703], 'elevation': 720}], [{'coord': [121.6649338, 42.01951879], 'elevation': 361.1}], [{'coord': [116.3531817, 27.95233706], 'elevation': 630.01}], [{'coord': [123.9514413, 41.87872723], 'elevation': 890.2}], [{'coord': [119.2917036, 26.07760642], 'elevation': 3068.21}], [{'coord': [113.1159282, 23.0240907], 'elevation': 5651.52}], [{'coord': [108.3432726, 21.6177666], 'elevation': 319.54}], [{'coord': [109.4832804, 30.27475683], 'elevation': 351.13}], [{'coord': [114.8898004, 30.3946239], 'elevation': 395.29}], [{'coord': [109.7755978, 39.60723695], 'elevation': 2643.2}], [{'coord': [118.669129, 37.43409498], 'elevation': 2359.94}], [{'coord': [113.7465722, 23.02325151], 'elevation': 4246.25}], [{'coord': [104.6235958, 35.58115528], 'elevation': 156.02}], [{'coord': [99.70114502, 27.82237393], 'elevation': 77.1}], [{'coord': [116.2968283, 37.45016095], 'elevation': 1657.82}], [{'coord': [104.3953334, 31.12898208], 'elevation': 921.3}], [{'coord': [98.58473943, 24.43651307], 'elevation': 140.63}], [{'coord': [124.3790872, 40.12576492], 'elevation': 728.9}], [{'coord': [124.7033777, 52.33379013], 'elevation': 98.18}], [{'coord': [113.2931201, 40.07562569], 'elevation': 694.3}], [{'coord': [125.0975828, 46.58807767], 'elevation': 2900.1}], [{'coord': [121.6097417, 38.91325595], 'elevation': 5158.1}], [{'coord': [100.2289929, 25.59492808], 'elevation': 474.9}], [{'coord': [107.463356, 31.21170088], 'elevation': 819.2}], [{'coord': [101.5265938, 25.04856457], 'elevation': 404.44}], [{'coord': [118.3117158, 32.30356473], 'elevation': 695.65}], [{'coord': [107.3608207, 22.38003899], 'elevation': 389.2}], [{'coord': [118.8806869, 42.25587957], 'elevation': 1080.18}], [{'coord': [117.4902514, 30.67658142], 'elevation': 300.8}], [{'coord': [117.9373554, 40.97720104], 'elevation': 880.5}], [{'coord': [104.0623615, 30.66102365], 'elevation': 5551.3}], [{'coord': [113.0092463, 25.77349554], 'elevation': 1081.8}], [{'coord': [116.6182465, 23.65972359], 'elevation': 559.2}], [{'coord': [120.444675, 41.5714384], 'elevation': 654.4}], [{'coord': [117.8594327, 31.59997305], 'elevation': 625}], [{'coord': [119.9697279, 31.81213755], 'elevation': 2976.7}], [{'coord': [111.6928965, 29.03469839], 'elevation': 1491.6}], [{'coord': [87.30511364, 44.00986351], 'elevation': 557}], [{'coord': [97.17147819, 31.14328311], 'elevation': 67.5}], [{'coord': [116.8330464, 38.30388067], 'elevation': 2203}], [{'coord': [82.06287061, 44.90456223], 'elevation': 128.27}], [{'coord': [115.7731346, 33.84601674], 'elevation': 512.78}], [{'coord': [117.9648236, 37.38135712], 'elevation': 1551.52}], [{'coord': [105.2807841, 27.30595926], 'elevation': 600.85}], [{'coord': [123.7605949, 41.29209215], 'elevation': 860.4}], [{'coord': [116.4011742, 39.90281066], 'elevation': 13777.9}], [{'coord': [109.1156021, 21.48359313], 'elevation': 397.6}], [{'coord': [99.16054296, 25.1149115], 'elevation': 260.9}], [{'coord': [115.4582785, 38.87304898], 'elevation': 2050.3}], [{'coord': [107.129072, 34.3736758], 'elevation': 976.09}], [{'coord': [109.8346622, 40.65628316], 'elevation': 2460.8}], [{'coord': [117.3838771, 32.91798917], 'elevation': 636.9}], [{'coord': [106.6148632, 23.90526956], 'elevation': 563.51}], [{'coord': [104.134792, 36.54472787], 'elevation': 311.18}], [{'coord': [126.4177183, 41.93748415], 'elevation': 433.17}], [{'coord': [122.8331446, 45.61772004], 'elevation': 441.5}], [{'coord': [106.740593, 31.86741366], 'elevation': 280.9}], [{'coord': [86.14261698, 41.76263044], 'elevation': 638}], [{'coord': [107.3810685, 40.76472139], 'elevation': 608.6}], [{'coord': [122.9891958, 41.1066585], 'elevation': 2200}], [{'coord': [114.3866674, 36.09742396], 'elevation': 1311.3}], [{'coord': [105.9442251, 26.25659385], 'elevation': 232.92}], [{'coord': [117.0514282, 30.52719638], 'elevation': 988.11}], [{'coord': [109.0244482, 32.68685351], 'elevation': 327.06}], [{'coord': [80.10344186, 32.50350883], 'elevation': 18.5}], [{'coord': [88.13788415, 47.84359539], 'elevation': 134.86}], [{'coord': [105.7246936, 38.85132383], 'elevation': 305.89}], [{'coord': [80.25843778, 41.16779774], 'elevation': 606.3}], [{'coord': [102.2229954, 31.90164005], 'elevation': 132.76}]]
        data=result.data;
          var points = [].concat.apply(
            [],
            data.map(function (track) {
              return track.map(function (seg) {
                return seg.coord.concat([1]);
              });
            })
          );
          
          
          myChart.setOption(
            (option = {
              animation: false,
              bmap: {
                center:[116.20,39.56],
                //center: [120.13066322374, 30.240018034923],
                zoom: 7,
                roam: true
              },
              visualMap: {
                show: false,
                top: 'top',
                min: 0,
                max: 2,
                seriesIndex: 0,
                calculable: true,
                inRange: {
                  color: ['blue', 'blue', 'green', 'yellow', 'red']
                }
              },
              series: [
                {
                  type: 'heatmap',
                  coordinateSystem: 'bmap',
                  data: points,
                  //data:data,
                  pointSize: 10,
                  blurSize: 6
        
                }
              ]
            })
          );
          // 添加百度地图插件
          var bmap = myChart.getModel().getComponent('bmap').getBMap();
          bmap.addControl(new BMap.MapTypeControl());
          //map.enableScrollWheelZoom(true);
          myChart.setOption(option);
       },
       error:function (msg) {
         console.log(msg);
                   alert('系统发生错误');
            }
      })
      
      
    </script>
 </body>
 </html>

用echarts实现地图感觉在数据展现上,问题还是比较多的,后来采用了百度地图api方式。

最后,谢谢关注,谢谢支持!

49bcbe764d606d8285f21d12864ef666.png

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

打赏作者

python与大数据分析

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

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

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

打赏作者

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

抵扣说明:

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

余额充值