baiduPanorama
来自于:开发者立即使用
论坛示例
为帮助用户更好更快的使用模块,论坛维护了一个示例,示例中包含示例代码、知识点讲解、注意事项等,供您参考。
概述
baiduPanorama 模块封装了百度全景 SDK ,为移动平台提供的一套全景图服务接口,面向广大开发者提供全景图的检索、显示和交互功能,从而更加清晰方便地展示目标位置的周边环境。百度全景 SDK 提供的所有服务是免费的,接口无次数限制。您需申请密钥(key)后,才可使用百度全景SDK。任何非营利性产品请直接使用,商业目的产品使用前请参考使用须知。 在您使用百度全景 SDK 之前,请先阅读百度地图API使用条款。
注意:
1. 使用此模块之前必须先配置 config 文件
2. 不能同时添加的模块bMap, bmLocation, baiduNavigation
注意:本模块 iOS 平台上最低适配系统版本为 iOS 11.0
针对 iOS 平台配置方法:
- 名称:baiduPanorama
- 参数:apiKey
- 配置示例:
<feature name="baiduPanorama">
<param name="ios_api_key" value="百度ak"" />
</feature>
针对 android 平台配置方法:
- 配置示例:
<meta-data
name="com.baidu.lbsapi.API_KEY"
value="百度ak" />
注意事项:
- 1、Android从1.0.4版本开始,需用升级环境编译
模块接口
open
打开全景
open({params}, callback(ret))
params
rect:
- 类型:JSON 对象
- 描述:(可选项)模块的位置及尺寸
- 内部字段:
{
x: 0, //(可选项)数字类型;模块左上角的 x 坐标(相对于所属的 Window 或 Frame);默认值:0
y: 0, //(可选项)数字类型;模块左上角的 y 坐标(相对于所属的 Window 或 Frame);默认值:0
w: 80, //(可选项)数字类型;模块的宽度;若传'auto',页面从x位置开始自动充满所属的 Window 或 Frame 的宽度;默认:'auto'(Android平台下h要大于等于w,否则预览会拉伸)
h: 50 //(可选项)数字类型;模块的高度;若传'auto',页面从y位置开始自动充满所属的 Window 或 Frame 的高度;默认:'auto'(Android平台下h要大于等于w,否则预览会拉伸)
}
fixedOn:
- 类型:字符串
- 描述:(可选项)模块添加到指定 frame 的名字(只指 frame,传 window 无效)
- 默认:模块依附于当前 window
fixed:
- 类型:布尔
- 描述:(可选项)模块是否随所属 window 或 frame 滚动
- 默认值:true(不随之滚动)
callback(ret)
ret:
- 类型:JSON 对象
- 内部字段:
{
status: true //布尔类型;是否打开全景成功
}
示例代码
var baiduPanorama = api.require('baiduPanorama');
baiduPanorama.open({
rect: {
x: 0,
y: 0,
w: api.frameWidth,
h: api.frameHeight
},
fixedOn: api.frameName,
fixed: false
}, function(ret){
if( ret ){
alert( JSON.stringify( ret ) );
}
});
可用性
iOS系统,Android系统
可提供的1.0.0及更高版本
setPosition
设置全景图经纬度坐标,根据经纬度坐标展示附近的全景图
setPosition({params})
params
lon:
- 类型:数字
- 描述:经度
lat:
- 类型:数字
- 描述:纬度
示例代码
var baiduPanorama = api.require('baiduPanorama');
baiduPanorama.setPosition({
lon: 116.384767,
lat: 39.989539
});
可用性
iOS系统,Android系统
可提供的1.0.0及更高版本
setPID
设置全景图Id,根据全景图Id展示附近的全景图
setPID({params})
params
pid:
- 类型:字符串
- 描述:全景图ID
示例代码
var baiduPanorama = api.require('baiduPanorama');
baiduPanorama.setPID({
pid: '0900220000141205144547300IN'
});
可用性
iOS系统,Android系统
可提供的1.0.0及更高版本
setMercator
设置墨卡托坐标,根据地理坐标展示附近的全景图,本接口在 iOS 平台无效
setMercator({params})
params
x:
- 类型:数字
- 描述:百度墨卡托投影坐标x
y:
- 类型:数字
- 描述:百度墨卡托投影坐标y
示例代码
var baiduPanorama = api.require('baiduPanorama');
baiduPanorama.setMercator({
x: 12971348,
y: 4826239
});
可用性
iOS系统,Android系统
可提供的1.0.0及更高版本
setPOIID
设置地图POI Id,根据地图POI Id展示附近的全景图
setPOIID({params})
params
uid:
- 类型:字符串
- 描述:地图POI Id
panoType:
- 类型:字符串
- 描述:全景图类型
- 取值范围:内景 INTERIOR;外景 STREET
- 默认:STREET
示例代码
var baiduPanorama = api.require('baiduPanorama');
baiduPanorama.setPOIID({
uid: '7aea43b75f0ee3e17c29bd71',
panoType: 'STREET'
});
可用性
iOS系统,Android系统
可提供的1.0.0及更高版本
setPanoramaPitch
设置全景图的俯仰角
setPanoramaPitch({params})
params
pitch:
- 类型:数字
- 描述:俯仰角
- 取值范围:室外景[-15, 90], 室内景[-25, 90]
示例代码
var baiduPanorama = api.require('baiduPanorama');
baiduPanorama.setPanoramaPitch({
pitch: 60
});
可用性
iOS系统,Android系统
可提供的1.0.0及更高版本
setPanoramaHeading
设置全景图的偏航角
setPanoramaHeading({params})
params
heading:
- 类型:数字
- 描述:全景图的偏航角
- 取值范围:[0, 360]
示例代码
var baiduPanorama = api.require('baiduPanorama');
baiduPanorama.setPanoramaHeading({
heading: 60
});
可用性
iOS系统,Android系统
可提供的1.0.0及更高版本
setPanoramaLevel
设置全景图的缩放级别
setPanoramaLevel({params})
params
level:
- 类型:数字
- 描述:全景图的缩放级别
- 取值范围:[1,5],随着级别的增大清晰度逐渐提高
示例代码
var baiduPanorama = api.require('baiduPanorama');
baiduPanorama.setPanoramaLevel({
level: 2
});
可用性
iOS系统,Android系统
可提供的1.0.0及更高版本
setShowTopoLink
设置是否显示邻接街景箭头(有邻接全景的时候)
setShowTopoLink({params})
params
enable:
- 类型:布尔
- 描述:是否显示邻接街景箭头
- 默认:true
示例代码
var baiduPanorama = api.require('baiduPanorama');
baiduPanorama.setShowTopoLink({
enable: true
});
可用性
iOS系统,Android系统
可提供的1.0.0及更高版本
setPanoramaImageLevel
设置全景图片的显示级别
setPanoramaImageLevel({params})
params
level:
- 类型:字符串
- 描述:全景图片的显示级别
- 取值范围:
- 较低清晰度 low
- 中等清晰度 middle
- 较高清晰度 high
示例代码
var baiduPanorama = api.require('baiduPanorama');
baiduPanorama.setPanoramaImageLevel({
level: 'middle'
});
可用性
iOS系统,Android系统
可提供的1.0.0及更高版本
setArrowTextureByBitmap
设置箭头的纹理
setArrowTextureByBitmap({params})
params
path:
- 类型:字符串
- 描述:箭头图片地址,要求本地路径(widget://、fs://)
示例代码
var baiduPanorama = api.require('baiduPanorama');
baiduPanorama.setArrowTextureByBitmap({
path: 'widget://res/arrow.png'
});
可用性
iOS系统,Android系统
可提供的1.0.0及更高版本
getPanoramaPitch
获取当前全景图的俯仰角
getPanoramaPitch(callback(ret, err))
callback
ret:
- 类型:JSON 对象
- 内部字段:
{
pitch: 60, //数字型;取值范围:室外景[-15, 90], 室内景[-25, 90]
}
示例代码
var baiduPanorama = api.require('baiduPanorama');
baiduPanorama.getPanoramaPitch(function(ret) {
alert(JSON.stringify(ret));
});
可用性
iOS系统,Android系统
可提供的1.0.0及更高版本
getPanoramaHeading
获取当前全景图的偏航角
getPanoramaHeading(callback(ret, err))
callback
ret:
- 类型:JSON 对象
- 内部字段:
{
heading: 60, //数字型;取值范围:[0, 360]
}
示例代码
var baiduPanorama = api.require('baiduPanorama');
baiduPanorama.getPanoramaHeading(function(ret) {
alert(JSON.stringify(ret));
});
可用性
iOS系统,Android系统
可提供的1.0.0及更高版本
getPanoramaLevel
获取当前全景图获取缩放级别
getPanoramaLevel(callback(ret, err))
callback
ret:
- 类型:JSON 对象
- 内部字段:
{
level: 3, //数字型;取值范围:[1, 5]
}
示例代码
var baiduPanorama = api.require('baiduPanorama');
baiduPanorama.getPanoramaLevel(function(ret) {
alert(JSON.stringify(ret));
});
可用性
iOS系统,Android系统
可提供的1.0.0及更高版本
addImgMarker
在地图上添加图片标注
addImgMarker({params}, callback(ret))
params
id:
- 类型:字符串
- 描述:标注id
lon:
- 类型:数字
- 描述:经度
lat:
- 类型:数字
- 描述:纬度
img:
- 类型:字符串
- 描述:标注图标地址,要求本地路径(fs://、widget://)
height:
- 类型:数字
- 描述:(可选项)所添加的标注高度,单位为 m
size:
- 类型:JSON 对象
- 描述:(可选项)所添加的标注的大小,本参数暂仅支持 iOS 平台
- 内部字段:
{
width: 153, //(可选项)数字类型;标注的宽;默认:153
height: 69 //(可选项)数字类型;标注的高;默认:69
}
callback(ret)
ret:
- 类型:JSON 对象
- 内部字段:
{
id: '10', //字符串类型;标注 ID
eventType: 'click' //字符串类型;交互事件类型
//取值范围:
//click(用户点击标注事件)
//add(用户添加标注事件)
}
示例代码
var baiduPanorama = api.require('baiduPanorama');
baiduPanorama.addImgMarker({
id: '10',
lon: 116.297,
lat: 40.109,
icon: 'widget://res/marker.png',
height: 20.3
}, function(ret) {
alert(JSON.stringify(ret));
});
可用性
iOS系统,Android系统
可提供的1.0.0及更高版本
addTextMarker
在地图上添加文字标注
addTextMarker({params}, callback(ret, err))
params
id:
- 类型:字符串
- 描述:标注 id
lon:
- 类型:数字
- 描述:经度
lat:
- 类型:数字
- 描述:纬度
text:
- 类型:字符串
- 描述:文字标注信息
height:
- 类型:数字
- 描述:(可选项)所添加的标注高度
fontColor:
- 类型:字符串
- 描述:(可选项)所添加的标注文字颜色,支持rgb、rgba、#;
- 默认:'#000'
bgColor:
- 类型:字符串
- 描述:(可选项)所添加的标注文字背景颜色,支持rgb、rgba、#;
- 默认:'#FFF'
fontSize:
- 类型:数字
- 描述:(可选项)所添加的标注文字大小
padding:
- 类型:JSON 类型
- 描述:(可选项)文字的 padding 值
- 内部字段:
{
left: 10, //(可选项)数字类型;左边距;默认:10
top: 10, //(可选项)数字类型;上边距;默认:10
right: 10', //(可选项)数字类型;右边距;默认:10
bottom: 10 //(可选项)数字类型;下边距;默认:10
}
callback(ret, err)
ret:
- 类型:JSON 对象
- 内部字段:
{
id: '10', //数字类型;标注ID
eventType: 'click', //字符串类型;交互事件类型
//取值范围:
//click(用户点击标注事件)
//add(用户添加标注事件)
}
示例代码
var baiduPanorama = api.require('baiduPanorama');
baiduPanorama.addTextMarker({
id:'11',
lon: 116.297,
lat: 40.109,
text: 'hello',
height: 20.3,
fontColor: '#0f0',
fontSize: 12,
bgColor: '#00F',
padding:{
left:10,
top:10,
right:10,
bottom:10
}
}, function(ret) {
alert(JSON.stringify(ret));
});
可用性
iOS系统,Android系统
可提供的1.0.0及更高版本
removeMarkers
移除指定 id 的标注
removeMarkers({params})
params
ids:
- 类型:数组
- 描述:要移除的标注id(数字),如果数组为空,则移除所有标注
示例代码
var baiduPanorama = api.require('baiduPanorama');
baiduPanorama.removeMarkers({
ids: ['1','2','3']
});
可用性
iOS系统,Android系统
可提供的1.0.0及更高版本
setIndoorAlbumVisiblity
设置内景相册控件是否显示,本接口仅对内景有效,应在调用开启内景接口(setPID、setPOIID等)前调用本接口
setIndoorAlbumVisiblity({params})
params
visibility:
- 类型:布尔
- 描述:是否显示相册控件
示例代码
var baiduPanorama = api.require('baiduPanorama');
baiduPanorama.setIndoorAlbumVisiblity({
visibility: true
});
可用性
iOS系统,Android系统
可提供的1.0.0及更高版本
getPanoramaByIIdWithJson
利用内景 ID 获取室内全景描述信息,其中包含室内相册相关信息
getPanoramaByIIdWithJson({params}, callback(ret, err))
params
iid:
- 类型:字符串
- 描述:内景ID
callback
ret:
- 类型:JSON 对象
- 描述:内景相册的描述信息
示例代码
var baiduPanorama = api.require('baiduPanorama');
baiduPanorama.getPanoramaByIIdWithJson({
iid:'978602fdf6c5856bddee8b62'
},function(ret) {
alert(JSON.stringify(ret));
});
可用性
iOS系统,Android系统
可提供的1.0.0及更高版本
getPanoramaRecommendInfo
利用全景 ID 获取服务推荐的描述信息
getPanoramaRecommendInfo({params}, callback(ret, err))
params
pid:
- 类型:字符串类型
- 描述:全景ID
callback
ret:
- 类型:JSON 对象
- 描述:全景poi点的描述信息
示例代码
var baiduPanorama = api.require('baiduPanorama');
baiduPanorama.getPanoramaRecommendInfo({
pid:'0900220000141205144547300IN'
}, function(ret) {
alert(JSON.stringify(ret));
});
可用性
iOS系统,Android系统
可提供的1.0.0及更高版本
getPoiInfoByUidWithJson
利用百度地图uid获取POI信息
getPoiInfoByUidWithJson({params}, callback(ret, err))
params
uid:
- 类型:字符串类型
- 描述:百度地图uid
callback
ret:
- 类型:JSON 对象
- 描述:POI信息
示例代码
var baiduPanorama = api.require('baiduPanorama');
baiduPanorama.getPoiInfoByUidWithJson({
uid:'bff8fa7deabc06b9c9213da4'
},function(ret) {
alert(JSON.stringify(ret));
});
可用性
iOS系统,Android系统
可提供的1.0.0及更高版本
hasStreetPanoByUid
根据百度地图POIID(uid)判断是否有外景信息,iOS 上从 getPoiInfoByUidWithJson 接口获取该信息
hasStreetPanoByUid({params}, callback(ret, err))
params
uid:
- 类型:字符串
- 描述:百度地图uid
callback
ret:
- 类型:JSON 对象
- 描述:POI信息
示例代码
var baiduPanorama = api.require('baiduPanorama');
baiduPanorama.hasStreetPanoByUid(({
uid:'bff8fa7deabc06b9c9213da4'
},function(ret) {
alert(JSON.stringify(ret));
});
可用性
iOS系统,Android系统
可提供的1.0.0及更高版本
hasInnerPanoByUid
根据百度地图POIID(uid)判断是否有内景信息,iOS 上从 getPoiInfoByUidWithJson 接口获取该信息
hasInnerPanoByUid(callback(ret, err))
params
uid:
- 类型:字符串
- 描述:百度地图uid
callback
ret:
- 类型:JSON 对象
- 内部字段:
{
status: true, //布尔类型;
}
示例代码
var baiduPanorama = api.require('baiduPanorama');
baiduPanorama.hasInnerPanoByUid(({
uid:'bff8fa7deabc06b9c9213da4'
},function(ret) {
alert(JSON.stringify(ret));
});
可用性
iOS系统,Android系统
可提供的1.0.0及更高版本
hasStreetPanoByLatLon
根据百度经纬度坐标判断是否有外景信息
hasStreetPanoByLatLon(callback(ret, err))
params
lon:
- 类型:数字类型
- 描述:经度
lat:
- 类型:数字类型
- 描述:纬度
callback
ret:
- 类型:JSON 对象
- 内部字段:
{
status: true, //布尔类型;
}
示例代码
var baiduPanorama = api.require('baiduPanorama');
baiduPanorama.hasStreetPanoByLatLon({
lon: 116.384767,
lat: 39.989539
},function(ret) {
alert(JSON.stringify(ret));
});
可用性
iOS系统,Android系统
可提供的1.0.0及更高版本
hasStreetPanoByMercator
根据墨卡托坐标判断是否有外景信息
hasStreetPanoByMercator(callback(ret, err))
params
x:
- 类型:数字
- 描述:百度墨卡托投影坐标x
y:
- 类型:数字
- 描述:百度墨卡托投影坐标y
callback
ret:
- 类型:JSON 对象
- 内部字段:
{
status: true, //布尔类型;
}
示例代码
var baiduPanorama = api.require('baiduPanorama');
baiduPanorama.hasStreetPanoByMercator({
x: 12971348,
y: 4826239
},function(ret) {
alert(JSON.stringify(ret));
});
可用性
iOS系统,Android系统
可提供的1.0.0及更高版本
loadPanoramBeginListener
全景图开始加载的监听
loadPanoramBeginListener({params}, callback(ret))
params
enable:
- 类型:布尔
- 描述:(可选项)是否启动全景图开始加载监听
- 默认:true
callback(ret)
ret:
- 类型:JSON 对象
- 内部字段:
{
status: //布尔类型;全景图开始加载事件监听成功
}
示例代码
var baiduPanorama = api.require('baiduPanorama');
baiduPanorama.loadPanoramBeginListener({
enable : false
},function(ret) {
alert(JSON.stringify(ret));
});
可用性
iOS系统,Android系统
可提供的1.0.0及更高版本
descriptionLoadEndListener
全景图描述信息加载完成的监听,iOS 平台不支持本接口
descriptionLoadEndListener({params}, callback(ret))
params
enable:
- 类型:布尔
- 描述:(可选项)是否启动全景图加载完成监听
- 默认:true
callback(ret)
ret:
- 类型:JSON 对象
- 描述:全景描述信息
示例代码
var baiduPanorama = api.require('baiduPanorama');
baiduPanorama.descriptionLoadEndListener({
enable : false
},function(ret) {
alert(JSON.stringify(ret));
});
可用性
iOS系统,Android系统
可提供的1.0.0及更高版本
messageListener
全景操作的回调监听(旋转、点击等),iOS 平台不支持本接口
messageListener({params}, callback(ret))
params
enable:
- 类型:布尔
- 描述:(可选项)是否启动全景操作的回调监听
- 默认:true
callback(ret)
ret:
- 类型:JSON 对象
- 内部字段:
{
status: true, //布尔类型;
msgName: //字符串类型;消息名称
msgType: //字符串类型;消息类型
}
示例代码
var baiduPanorama = api.require('baiduPanorama');
baiduPanorama.messageListener({
enable : false
},function(ret) {
alert(JSON.stringify(ret));
});
可用性
iOS系统,Android系统
可提供的1.0.0及更高版本
loadPanoramaEndListener
全景图加载完成的监听
loadPanoramaEndListener({params}, callback(ret))
params
enable:
- 类型:布尔
- 描述:(可选项)是否启动全景图加载完成的监听
- 默认:true
callback(ret)
ret:
- 类型:JSON 对象
- 描述:全景描述信息
示例代码
var baiduPanorama = api.require('baiduPanorama');
baiduPanorama.loadPanoramaEndListener({
enable : false
}, function(ret) {
alert(JSON.stringify(ret));
});
可用性
iOS系统,Android系统
可提供的1.0.0及更高版本
loadPanoramaErrorListener
全景加载异常的监听
loadPanoramaErrorListener({params}, callback(ret))
params
enable:
- 类型:布尔
- 描述:(可选项)是否启动全景加载异常监听
- 默认:true
callback(ret)
ret:
- 类型:JSON 对象
- 内部字段:
{
status: //布尔类型;
}
示例代码
var baiduPanorama = api.require('baiduPanorama');
baiduPanorama.loadPanoramaErrorListener({
enable : false
}, function(ret) {
alert(JSON.stringify(ret));
});
可用性
iOS系统,Android系统
可提供的1.0.0及更高版本
setAgreePrivacy
隐私合规接口(此接口仅支持iOS)
自模块 1.0.9后请务必同意该接口,否则该模块将不能正常使用,隐私政策可参考百度地图官网
setAgreePrivacy(callback(ret, err))
示例代码
var baiduPanorama = api.require('baiduPanorama');
baiduPanorama.setAgreePrivacy({
agree:true
});
可用性
iOS系统
可提供的1.0.9及更高版本