ts
/** 90度を示すラジアン値 */
const ANGLE90 = (Math.PI / 180) * 90;
// THREE: 六角中のMeshを生成
const mesh = new THREE.Mesh(
new THREE.CylinderGeometry(1, 1, 3, 6),
new THREE.MeshLambertMaterial({ color: 0xEEDBA5 })); // 適当な色
// Cannon.jsとThree.jsの向きの違いを調整するためのクォータニオン
const adjusted = new THREE.Quaternion();
adjusted.setFromEuler(new THREE.Euler(ANGLE90, ANGLE90, 0));
//
// いろいろ省略
//
function update() {
// Cannon.jsからThree.jsに反映: 位置情報
mesh.position.set(
body.position.x,
body.position.y,
body.position.z);
// Cannon.jsからThree.jsに反映: 向き情報
mesh.quaternion.set(
body.quaternion.x,
body.quaternion.y,
body.quaternion.z,
body.quaternion.w);
// Cannon.jsとThree.jsの向きの違いを調整
mesh.quaternion.multiply(adjusted);
}