百度地图（14）-全景图

1. 百度地图提供了两种全景图的方式，一种是提供全景图控件，第二种是提供接口。

 

2. 全景图控件

1   function addPanoramaControl(){
2     map.addTileLayer(new BMap.PanoramaCoverageLayer());
3 
4     var stCtrl = new BMap.PanoramaControl(); //构造全景控件
5     stCtrl.setOffset(new BMap.Size(20, 60));
6     map.addControl(stCtrl);//添加全景控件
7   }

 

3. 全景图接口

 1   function addPanoramaByXy(){
 2     map.addTileLayer(new BMap.PanoramaCoverageLayer());
 3     var panorama = new BMap.Panorama(\'results\');
 4     panorama.setPov({heading:-40,pitch:6});
 5     map.removeEventListener("click");
 6     map.addEventListener("click",function (e) {
 7       var pt = e.point;
 8       panorama.setPosition(pt);
 9     })
10   }

自定义显示全景图的触发事件（“click”），自定义全景图显示的div（“results“）。

定义 BMap.Panorma 对象，然后在地图点击时，根据点击位置，使用setPosition 查看该点击位置的全景图。

 

4. 页面显示

通过控件加载全景图，会有默认的控件图标，点击后在地图上的蓝色路线上移动，会有全景图的预览。点击后进入全景图画面。

 

 

 

 自定义接口通过代码定义触发事件，自定义全景图的窗口。

 

 

5. 代码参考

https://github.com/WhatGIS/bdMap