<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">
<title>360度环视</title>
<style type="text/css">
html,
body,
#viewDiv {
padding: 0;
margin: 0;
height: 100%;
width: 100%;
}
#optionsDiv {
position: absolute;
bottom: 17px;
width: 100%;
padding: 20px 0;
z-index: 1;
text-align: center;
}
</style>
<link rel="stylesheet" href="http://localhost:8080/api412/esri/css/esri.css">
<script src="http://localhost:8080/api412/init.js"></script>
<script>
require([
"esri/Map",
"esri/views/SceneView",
"dojo/domReady!"
], function (Map, SceneView) {
var map = new Map({
"basemap": "hybrid",
"ground": "world-elevation"
});
var sceneView = new SceneView({
map: map,
container: "viewDiv",
scale: 80000,
center: [86.859291, 28.143449]
});
var btn2 = document.getElementById('btn2');
btn2.addEventListener('click', move);
btn2.addEventListener('click', remove);
//btn2.removeEventListener('click', showMsg); //去除绑定
//核心算法
var i = 0;
var x0=86.859291;var y0=28.143449; var R=0.02; //旋转半径，1度代表110公里
var X1; var Y1;
function move(){
setTimeout(function(){
i=i+1 //每次变换角度值
if(i<360){
move()
}
X1=x0+R*Math.cos((360-i)*Math.PI/180);
Y1=y0+R*Math.sin((360-i)*Math.PI/180);
sceneView.goTo({
//target: [-122, 38, 50000], //zoom: 13, //显示级别
heading: 360-i, //方向角
lng:X1, //经度
lat:Y1, //维度
altitude:80000, //高程
tilt: 45 //倾斜角度
});
}, 50) //毫秒
}
function remove(){ i=0; }
});
</script>
</head>
<body>
<div id="viewDiv">
<div id="optionsDiv">
<button id="btn2">360度环视</button>
</div>
</div>
</body>
</html>
1238
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
