时间戳

首页 > 解决方案 > 我想将我的四元数坐标更改为旋转坐标

reactjs - 我想将我的四元数坐标更改为旋转坐标

问题描述

我[x,y,z,w]从传感器获取四元数坐标。我想改变那个坐标，这样我就可以旋转我的 React VR 应用场景来旋转那个场景。我需要将四元数坐标更改为旋转坐标。但是这里的旋转是不平滑的，为了平滑旋转“四元坐标”必须转换为旋转。

import {VRInstance} from 'react-vr-web';
import scene from 'three.js';
//let us assume x,y,z,w are my coordinate in quaternion formate which I //am taking through web socket
function init(bundle, parent, options) 
{
 //scene=new scene()//three.js

  const vr = new VRInstance(bundle, 'musical_exp_react_vr_pusher', 
 parent, {
    // Add custom options here
    ...options,
  });
  vr.render = function() {
  //but its not working as I took the quaternion coordiate
 //smoothness is not there
 vr.scene.rotationx=x;
 vr.scene.rotationx=y;
 vr.scene.rotationx=z;

 //it is also not working
 vr.scene.quaternion.x=x;
 vr.scene.quaternion.y=y;
 vr.scene.quaternion.z=z;

  // Any custom behavior you want to perform on each frame goes here
  };
  // Begin the animation loop
  vr.start();
  return vr;
 }

 window.ReactVR = {init};

主要问题是我需要从四元数坐标中找到旋转轴坐标。

标签： reactjsreact-nativequaternionsreact-360

解决方案

四元数和欧拉角是两个独立的概念，不能通过简单的赋值转换。根据您的框架使用的欧拉角的类型，转换算法可能有点复杂。

Three.js 在Euler.setFromQuaternion()方法中实现了这种转换。

但是，查看 three.js 的文档，似乎四元数分配应该按您的意愿工作 - 您只需要分配四元数的所有 4 个元素（您的代码缺少 W 元素）。

推荐阅读