// 旋转相机
rotateCamera (axis, speed, dt) {
// var camera = viewer.getCamera()
// var pivot = camera.pivot;
// camera.target = pivot;
// var target = camera.target
// var dt = 1;
// dt+=1;
// var posx = target.x + 1000*Math.cos(dt * 3.14 /180);
// var posy = target.y + 1000*Math.cos(1 * 3.14 /180);
// camera.position.x = posx
// camera.position.y = posy
var nav = viewerAll.navigation;
var up = nav.getCameraUpVector()
var pos = nav.getPosition()
var matrix = new THREE.Matrix4().makeRotationAxis(
axis, speed * dt);
// viewer.impl.invalidate (true)
pos.applyMatrix4(matrix)
up.applyMatrix4(matrix)
nav.setView(pos, new THREE.Vector3(0,0,1))
nav.setCameraUpVector(up)
}
runAnimation () {
if(viewer.animateFlag){
var dt = 0.01;
dt+=0.01;
var axis = new THREE.Vector3(0,0,1);
viewer.vmethods.rotateCamera(axis, 10.0 * Math.PI/180, dt);
window.requestAnimationFrame(viewer.vmethods.runAnimation);
}
}1
文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。
转载请注明本文地址:https://www.ucloud.cn/yun/103989.html
摘要:全景旋转首先学习一下基础坐标系这个只要记住一下轴各自方向就可以,下面分析会用到。 开始 从这里开始准备攻略webgl(准备挖新坑),Flutter框架当然也会继续补充,但是今天学习的不是webgl,而是css3d-engine这个库,因为之前搞活动看到了一个全景旋转活动就是使用这个库完成,颇为惊艳(一开始以为是webgl实现的,但是看了代码才知道用CSS3就可以完成,虽然觉得还是应该用...
摘要:全景旋转首先学习一下基础坐标系这个只要记住一下轴各自方向就可以,下面分析会用到。 开始 从这里开始准备攻略webgl(准备挖新坑),Flutter框架当然也会继续补充,但是今天学习的不是webgl,而是css3d-engine这个库,因为之前搞活动看到了一个全景旋转活动就是使用这个库完成,颇为惊艳(一开始以为是webgl实现的,但是看了代码才知道用CSS3就可以完成,虽然觉得还是应该用...
摘要:全景旋转首先学习一下基础坐标系这个只要记住一下轴各自方向就可以,下面分析会用到。 开始 从这里开始准备攻略webgl(准备挖新坑),Flutter框架当然也会继续补充,但是今天学习的不是webgl,而是css3d-engine这个库,因为之前搞活动看到了一个全景旋转活动就是使用这个库完成,颇为惊艳(一开始以为是webgl实现的,但是看了代码才知道用CSS3就可以完成,虽然觉得还是应该用...
摘要:手机屏幕朝上,水平静止放置,轴重力加速度为,为。当手机水平放置,拨动手机,使其慢慢旋转,重力加速度的数据并没有变化。四元数的基本数学方程为其中表示旋转角度,表示旋转轴。四元数表示一个完整的旋转。 前言 随着智能硬件的普及,手机,平板,PC甚至路边的电子广告牌,现代浏览器已经无处不在。在浏览器里编织出我们自己的一片天地已经轻车熟路,但是这还不够,H5赋予了浏览器太多的新特性,等待我们去使...
阅读 1245·2021-11-15 18:06
阅读 2582·2021-10-08 10:04
阅读 2889·2019-08-28 18:03
阅读 1182·2019-08-26 13:42
阅读 2147·2019-08-26 11:31
阅读 2647·2019-08-23 17:13
阅读 1183·2019-08-23 16:45
阅读 2265·2019-08-23 14:11