86 lines
2.8 KiB
HTML
86 lines
2.8 KiB
HTML
<!DOCTYPE html>
|
|
<html class="no-js css-menubar" lang="zh-cn">
|
|
<head>
|
|
<title>弹窗子页面</title>
|
|
<meta charset="utf-8" />
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
|
|
<!-- 移动设备 viewport -->
|
|
<meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no,minimal-ui" />
|
|
<meta name="author" content="火星科技 http://mars3d.cn " />
|
|
<!-- 360浏览器默认使用Webkit内核 -->
|
|
<meta name="renderer" content="webkit" />
|
|
|
|
<script type="text/javascript" src="http://api.map.baidu.com/api?v=3.0&ak=qObioeG8HeeQVrOVAGScPVhDzlmv6rL9"></script>
|
|
<style type="text/css">
|
|
body,
|
|
html {
|
|
width: 100%;
|
|
height: 100%;
|
|
margin: 0;
|
|
font-family: "微软雅黑";
|
|
}
|
|
#streetscapeMap {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
</style>
|
|
</head>
|
|
|
|
<body>
|
|
<div id="streetscapeMap"></div>
|
|
|
|
<!--页面js-->
|
|
<script>
|
|
var panorama
|
|
|
|
window.onload = function () {
|
|
var request = getRequest()
|
|
|
|
var baiduMpt = new BMap.Point(request.lng, request.lat)
|
|
var map = new BMap.Map("streetscapeMap") // mars3d.Map三维地图对象
|
|
map.centerAndZoom(baiduMpt, 15)
|
|
map.addTileLayer(new BMap.PanoramaCoverageLayer())
|
|
|
|
panorama = new BMap.Panorama("streetscapeMap")
|
|
panorama.setPosition(baiduMpt) //根据经纬度坐标展示全景图
|
|
panorama.setPov({ heading: -40, pitch: 6 })
|
|
panorama.addEventListener("position_changed", function (e) {
|
|
//全景图位置改变后，普通地图中心点也随之改变
|
|
var pos = panorama.getPosition() //街景变换返回触发的回调函数
|
|
|
|
if (parent) {
|
|
pos = parent.mars3d.PointTrans.bd2wgs([pos.lng, pos.lat])
|
|
parent.postMessage({ lng: pos[0], lat: pos[1] })
|
|
}
|
|
|
|
// var pov = panorama.getPov()
|
|
})
|
|
}
|
|
|
|
//外部传入坐标，更新街景
|
|
function setPosition(point) {
|
|
let bdPoint = parent.mars3d.PointTrans.wgs2bd([point.lng, point.lat])
|
|
panorama.setPosition(new BMap.Point(bdPoint[0], bdPoint[1])) //根据经纬度坐标展示全景图
|
|
}
|
|
|
|
//url参数获取
|
|
function getRequest(target) {
|
|
var theRequest = new Object()
|
|
try {
|
|
//屏蔽跨域时报错
|
|
target = target || window
|
|
var url = target.location.search //获取url中"?"符后的字串
|
|
if (url.indexOf("?") != -1) {
|
|
var str = url.substr(1)
|
|
var strs = str.split("&")
|
|
for (var i = 0; i < strs.length; i++) {
|
|
theRequest[strs[i].split("=")[0]] = decodeURI(strs[i].split("=")[1])
|
|
}
|
|
}
|
|
} catch (e) {}
|
|
return theRequest
|
|
}
|
|
</script>
|
|
</body>
|
|
</html>
|