示例中心
功能在线体验
控制台
您现在的位置: 开发 > 地图 JS API > 开发指南 > 创建地图 > 3D地图 >

高德 开发 地图 JS API 开发指南 创建地图 3D地图

更新时间:2018年03月14日

简介

JS API 3D 地图是基于矢量地图数据提供的新的地图视图效果,相比 2D 地图增加了对旋转、视角倾斜等地图功能的支持。3D 地图基于 WEBGL 开发,在保证流畅度的同时,增加了对无级别缩放等功能的支持,最新版本在3D视图下,室内地图、热力图等都将展示为三维效果。

开启 3D 地图

开启 3D 地图视图效果,需要引用JSAPI v1.4.0以上版本的JSAPI,同时在 Map 初始化的时候给地图添加viewMode:3D属性即可,如增加 pitch 属性可以修改地图的初始俯仰角度,俯仰角的有效范围为0度-83度。

  • 3D地图
  • 3D室内地图
var map = new AMap.Map('container', {
    pitch:75,
    viewMode:'3D',
    zoom: 17,
    expandZoomRange:true,
    zooms:[3,20],
    center:[116.333926,39.997245]
  });
  var map = new AMap.Map('mapDiv', {
              resizeEnable: true,
              center:[116.518542, 39.924677],
              zoom:18,
              pitch:50,
              viewMode:'3D'
        });
        map.on('indoor_create',function(){
              map.indoorMap.showIndoorMap('B000A856LJ',5);
        })

Object3D

  v1.4.5版本之后,JSAPI提供了创建三维物体的能力,用户可以使用相关新接口创建三维立体,同时支持纹理贴图、模型加载等,查看相关接口的参考文档示例。


注意事项

1)3D地图效果下,如果使用自定义栅格图,需要保证栅格图片服务返回的图片资源是带有Access-Control-Allow-Origin:*的响应Header的,否则将无法加载自定义栅格图

2)3D地图目前兼容windows、Mac、iOS、Android等多平台下的众多浏览器,但是由于地图绘制依赖WebGL等前端环境,如果终端环境无法满足3D绘制的要求,我们将仍然使用原有2D视图进行绘制。

3)支持3D地图的JSAPI版本为V1.4.0之后的版本,V1.4.5版本之后3D视图下支持除如下功能的所有API接口:

名称

说明

 AMap.Polygon 

仅不支持绘制带洞的多边形 

 AMap.CloudLayer 

云图图层

 PointSimplifier 

 海量点展示组件 

 PathSimplifier 

 轨迹展示组件 

 DistrictExplorer 

 行政区划浏览 

 DistrictCluster 

 行政区聚合 


移动端
示例中心
功能
在线体验
常见问题