zoukankan      html  css  js  c++  java
  • Echarts 如何使用 bmap 的 API

    使用 Echarts 在绘制 Binning on map 的图形时(其实也就是 在地图上绘制热力色块图)

    解决因为数据量过大,希望在拖拽加载或者缩放加载的时候,根据可视区域的经纬度范围,来请求相应的数据,这时候就要用到百度地图 Bmap 的拖拽和缩放的 API

    而且要获取的 Bmap 一定是引入到该图中的 map

    搜了好久才找到以下方法:

    var bmap = myChart.getModel().getComponent('bmap').getBMap();
    这时候我们就可以用 Bmap 的API来进行操作了
    // 拖拽结束
    bmap.addEventListener('dragend',()=>{
        var bssw = bmap.getBounds().getSouthWest();   //可视区域左下角
        var bsne = bmap.getBounds().getNorthEast();   //可视区域右上角
        console.log('可视区域左下角',bmap.getBounds().getSouthWest())
        console.log('可视区域右上角',bmap.getBounds().getNorthEast())
        console.log(("当前地图可视范围是:" + bssw.lng + "," + bssw.lat + "到" + bsne.lng + "," + bsne.lat));
    })
    // 缩放结束
    bmap.addEventListener("zoomend",()=>{
        var bssw = bmap.getBounds().getSouthWest();   //可视区域左下角
        var bsne = bmap.getBounds().getNorthEast();   //可视区域右上角
        console.log('可视区域左下角',bmap.getBounds().getSouthWest())
        console.log('可视区域右上角',bmap.getBounds().getNorthEast())
        console.log(("当前地图可视范围是:" + bssw.lng + "," + bssw.lat + "到" + bsne.lng + "," + bsne.lat));
    })
    bmap.addControl(new BMap.MapTypeControl());// 添加地图类型控件(地图/卫星/三维)
    bmap.addControl(new BMap.OverviewMapControl());//添加可折叠的缩略地图控件
    bmap.addControl(new BMap.ScaleControl());//平移和缩放
  • 相关阅读:
    工资低的.Net程序员,活该你工资低
    React- jsx的使用 使用 camelCase 语法来设置内联样式. React 会在指定元素数字后自动添加 px
    React 使用jsx
    node.js 简介
    转换成数值 parseInt与parseFloat; (toString) 转化为字符串
    函数 封装性划分私有空间
    favicon 不显示的问题总结1
    js进阶 offset
    前端缓存技术
    图片的预加载与懒加载
  • 原文地址:https://www.cnblogs.com/z-one/p/9237480.html
Copyright © 2011-2022 走看看