body标签中放入两个按钮方便我们触发事件
<div id="cesiumContainer">
<span style="font-size:24px;">
<div id="latlng_show" style="width:340px;height:100px;position:absolute;bottom:40px;right:200px;z-index:1;font-size:15px;">
<div style="width:100px;height:30px;float:left;">
<button onclick="test1()">获取当前视角</button>
</div>
<div style="width:100px;height:30px;float:left;">
<button onclick="test2()">返回视角</button>
</div>
</div>
</span>
</div>
script中写入下面代码
var viewer = new Cesium.Viewer('cesiumContainer');
//去掉版权
viewer._cesiumWidget._creditContainer.style.display="none";
var testPitch;
var testHeading;
var x;
var y;
var z;
var storage;
function test1(){
//获取当前视角的pitch
var pitch = viewer.camera.pitch;
//获取当前视角的heading
var heading = viewer.camera.heading;
//获取当前视角的postion(位置)
var position = viewer.camera.position;
x=position.x;
y=position.y;
z=position.z;
testPitch = pitch;
testHeading = heading;
console.log("获取当前视角x,y,z",position.x,position.y,position.z,"pitch",pitch,"heading",heading);
var ObjectJson={
"x":x,
"y":y,
"z":z,
"pitch":pitch,
"heading":heading
}
console.log("ObjectJson",ObjectJson);
if(!window.localStorage){
window.alert("该浏览器不支持LocalStorage")
}else{
storage = window.localStorage;
storage.setItem("positionJson",JSON.stringify(ObjectJson));
console.log("storage.positionJson",storage.positionJson);
}
}
function test2(){
console.log("开始返回视角");
console.log("x:",x,"y:",y,"z:",z,"testPitch",testPitch,"testHeading",testHeading);
var dataJson = storage.getItem("positionJson")
Json=JSON.parse(dataJson);
console.log("Json",Json)
viewer.camera.flyTo({ //定位到范围中心点
destination: {
x:Json.x,
y:Json.y,
z:Json.z
// x: x,
// y: y,
// z: z
},
orientation: {
heading:Json.heading,
pitch:Json.pitch,
// heading: testHeading,//左右方向
// pitch: testPitch, //上下方向
roll: 0.0
},
})
}
这样可以实现一个基本的视角的保存以及还原,我这里是用了JSON保存数据和传入数据。当然也可以不用JSON存储的方法,单单用变量也行,这方面就看你自己怎么操作了。