1.默认方式(在进行定位导航操作时不设置任何动画)
shiftCamera(60)代表旋转60度如果需要跳转至指定位置,即可将注释部分放入到goto语句中。下面都是类似的
document.getElementById("default").addEventListener("click", () => { view.goTo(shiftCamera(60)).catch(catchAbortError); // { // position: { // x: 13.4, // y: 52.52, // z: 700000, // spatialReference: { // wkid: 4326 // } // }, // heading: 0, // tilt: 0 // }, });
2.缓慢移动
document.getElementById("linearSlow").addEventListener("click", () => { view .goTo( shiftCamera(60), // Animation options for a slow linear camera flight { speedFactor: 0.1, easing: "linear" } ) .catch(catchAbortError); });
3.快速移动
document.getElementById("linearFast").addEventListener("click", () => { view .goTo( shiftCamera(60), // Animation options for a fast linear camera flight { speedFactor: 6, easing: "linear" } ) .catch(catchAbortError); });
4.逐渐加快
document.getElementById("expoIncrease").addEventListener("click", () => { view .goTo( shiftCamera(60), // Animation options for a camera flight with an increasing speed { duration: 4000, easing: "in-expo" } ) .catch(catchAbortError); });
5.在固定时间移动
document.getElementById("fixedDuration").addEventListener("click", () => { view .goTo(shiftCamera(30), { duration: 10000, maxDuration: 10000 // Make sure to set maxDuration if the duration is bigger than 8000 ms }) .catch(catchAbortError); });
6.跳转至相应位置,并产生摆动的效果
function customEasing(t) { return 1 - Math.abs(Math.sin(-1.7 + t * 4.5 * Math.PI)) * Math.pow(0.5, t * 10); } document.getElementById("bounceBerlin").addEventListener("click", () => { view .goTo( { position: { x: 13.4, y: 52.52, z: 700000, spatialReference: { wkid: 4326 } }, heading: 0, tilt: 0 }, { speedFactor: 0.3, easing: customEasing } ) .catch(catchAbortError); });