Skip to content

基础概念

本文档将介绍百度地图 JavaScript API GL 版本中的一些基础概念,帮助您更好地理解和使用 API。

命名空间

百度地图 JavaScript API GL 版本使用 BMapGL 作为命名空间,所有的类和对象都在这个命名空间下。例如:

javascript
var map = new BMapGL.Map('container');
var point = new BMapGL.Point(116.404, 39.915);

坐标体系

百度地图使用经纬度坐标系统,通过 Point 类表示一个地理坐标点:

javascript
// 创建一个坐标点(经度,纬度)
var point = new BMapGL.Point(116.404, 39.915);

地图控件

地图控件是地图上的一些辅助工具,包括:

  • 平移缩放控件ZoomControl
  • 比例尺控件ScaleControl
  • 3D 导航控件NavigationControl3D
  • 定位控件LocationControl
  • 地图类型控件MapTypeControl

覆盖物

覆盖物是添加在地图上的标注、线段、多边形等对象:

  • 点标注Marker
  • 信息窗口InfoWindow
  • 折线Polyline
  • 多边形Polygon
  • 圆形Circle

事件系统

百度地图提供了丰富的事件处理机制,可以监听地图、覆盖物等对象的各种事件:

javascript
// 监听地图点击事件
map.addEventListener('click', function(e) {
    console.log('点击位置:', e.latlng);
});

// 监听标注点击事件
marker.addEventListener('click', function() {
    console.log('标注被点击');
});

自定义样式

可以通过 setMapStyleV2 方法自定义地图的显示样式:

javascript
map.setMapStyleV2({
    styleJson: [
        {
            "featureType": "all",
            "elementType": "all",
            "stylers": {
                "lightness": 10,
                "saturation": -100
            }
        }
    ]
});

3D 视角

GL 版本支持 3D 视角展示,可以通过以下方法控制:

javascript
// 设置地图倾斜角度
map.setTilt(60);

// 设置地图旋转角度
map.setHeading(45);

图层

地图支持多种图层叠加:

  • 瓦片图层TileLayer
  • 自定义图层CustomLayer
  • 3D 建筑图层Building3DLayer
  • 热力图图层HeatmapLayer

下一步

基于 MIT 许可发布