回転度合いがわかりやすくなるようプロパティの値を変更

ics-creative · Aug 23, 2024 · c9b8158 · c9b8158
1 parent 814616e
commit c9b8158
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 29 deletions.
diff --git a/src/assets/MultipleAnimationProject.theatre-project-state.json b/src/assets/MultipleAnimationProject.theatre-project-state.json
@@ -99,7 +99,7 @@
                       0
                     ],
                     "type": "bezier",
-                    "value": -2
+                    "value": -1
                   },
                   {
                     "id": "uG3Q9aZe4E",
@@ -113,19 +113,6 @@
                     ],
                     "type": "bezier",
                     "value": 0
-                  },
-                  {
-                    "id": "pexKV_qg-n",
-                    "position": 2,
-                    "connectedRight": true,
-                    "handles": [
-                      0.5,
-                      1,
-                      0.5,
-                      0
-                    ],
-                    "type": "bezier",
-                    "value": 0
                   }
                 ]
               },
@@ -202,7 +189,7 @@
                       0
                     ],
                     "type": "bezier",
-                    "value": 4
+                    "value": 2
                   },
                   {
                     "id": "njNXWkmj48",
@@ -215,7 +202,7 @@
                       0
                     ],
                     "type": "bezier",
-                    "value": 4
+                    "value": 2
                   },
                   {
                     "id": "0JDDjHwwK_",
@@ -228,7 +215,7 @@
                       0
                     ],
                     "type": "bezier",
-                    "value": 5.5
+                    "value": 2.75
                   }
                 ]
               },
@@ -260,7 +247,7 @@
                       0
                     ],
                     "type": "bezier",
-                    "value": -0.27848101265822783
+                    "value": -0.139
                   },
                   {
                     "id": "BFVtLG3d0n",
@@ -273,7 +260,7 @@
                       -0.02
                     ],
                     "type": "bezier",
-                    "value": -0.27848101265822783
+                    "value": -0.139
                   },
                   {
                     "id": "EAhPMZoH5q",
@@ -286,7 +273,7 @@
                       0
                     ],
                     "type": "bezier",
-                    "value": -0.5
+                    "value": -0.25
                   }
                 ]
               },
@@ -1764,7 +1751,7 @@
                       0
                     ],
                     "type": "bezier",
-                    "value": -1.72
+                    "value": -0.86
                   }
                 ]
               }
@@ -1865,6 +1852,7 @@
   },
   "definitionVersion": "0.4.0",
   "revisionHistory": [
+    "55nBwzuhxGE92wKj",
     "cuiNsTpzVE9K6MTV",
     "N0LTynzKmgTeiF7Z",
     "pCYik0kypfye7Lmu",

diff --git a/src/multiple-animation/main.js b/src/multiple-animation/main.js
@@ -136,9 +136,9 @@ scene.add(textGroup);
 // GUIから入力ができるよう変更させる回転を定義
 const textObjProps = {
   rotation: types.compound({
-    x: types.number(0, { range: [-2, 2] }), // −360 〜 360度 の想定
-    y: types.number(0, { range: [-2, 2] }),
-    z: types.number(0, { range: [-2, 2] }),
+    x: types.number(0, { range: [-1, 1] }), // −1回転 〜 1回転 の想定
+    y: types.number(0, { range: [-1, 1] }),
+    z: types.number(0, { range: [-1, 1] }),
   }),
   position: types.compound({
     px: types.number(0, { range: [-100, 100] }),
@@ -175,7 +175,7 @@ text2Obj.onValuesChange((values) => {
 const textGroupObj = scrollAnimSheet.object("TextGroup", textObjProps);
 textGroupObj.onValuesChange((values) => {
   const { x, y, z } = values.rotation;
-  textGroup.rotation.set(x * Math.PI, y * Math.PI, z * Math.PI);
+  textGroup.rotation.set(x * 2 * Math.PI, y * 2 * Math.PI, z * 2 * Math.PI);
   const { px, py, pz } = values.position;
   textGroup.position.set(px, py, pz);
 });
@@ -204,9 +204,9 @@ scene.add(cube); // Three.jsのシーンに追加
 // GUIから入力できるよう、変更させたいプロパティを定義
 const cubeObj = kvSheet.object("Cube", {
   rotation: types.compound({
-    x: types.number(cube.rotation.x, { range: [-2, 2] }),
-    y: types.number(cube.rotation.y, { range: [-2, 10] }),
-    z: types.number(cube.rotation.z, { range: [-2, 2] }),
+    x: types.number(cube.rotation.x, { range: [-1, 1] }),
+    y: types.number(cube.rotation.y, { range: [-1, 5] }),
+    z: types.number(cube.rotation.z, { range: [-1, 1] }),
   }),
   position: types.compound({
     px: types.number(cube.position.x, { range: [-100, 100] }),
@@ -224,7 +224,7 @@ const cubeObj = kvSheet.object("Cube", {
 // GUIからの入力をオブジェクトに反映
 cubeObj.onValuesChange((values) => {
   const { x, y, z } = values.rotation;
-  cube.rotation.set(x * Math.PI, y * Math.PI, z * Math.PI);
+  cube.rotation.set(x * 2 * Math.PI, y * 2 * Math.PI, z * 2 * Math.PI);
   const { px, py, pz } = values.position;
   cube.position.set(px, py, pz);
   const { sx, sy, sz } = values.scale;