{"id":13347,"date":"2023-01-06T11:34:06","date_gmt":"2023-01-06T02:34:06","guid":{"rendered":"http:\/\/www.gisdeveloper.co.kr\/?p=13347"},"modified":"2024-02-04T11:01:24","modified_gmt":"2024-02-04T02:01:24","slug":"three-js%ec%9d%98-%ed%96%89%eb%a0%ac-%eb%b3%80%ed%99%98","status":"publish","type":"post","link":"http:\/\/www.gisdeveloper.co.kr\/?p=13347","title":{"rendered":"three.js\uc758 \ud589\ub82c \ubcc0\ud658"},"content":{"rendered":"<p>Three.js\ub294 \uc774\ub3d9(position), \ud68c\uc804, \ud06c\uae30\ubcc0\ud658\uacfc \uac19\uc740 3\ucc28\uc6d0 \ubcc0\ud658\uc744 \uc704\ud574 \ud589\ub82c\uc744 \uc0ac\uc6a9\ud568. Object3D\uc758 \ud30c\uc0dd \ud074\ub798\uc2a4\uc758 \ubaa8\ub4e0 \uac1d\uccb4\ub294 matrix \uc18d\uc131\uc744 \uac00\uc9c0\uace0 \uc788\uace0 \uc774 \uc18d\uc131\uc740 \uac1d\uccb4\uc758 \uc704\uce58, \ud68c\uc804, \ud06c\uae30 \ubcc0\ud658\uac12\uc774 \uc800\uc7a5\ub418\uc5b4 \uc788\uc74c. \uc774 \uae00\uc740 \uac1d\uccb4\uc758 \ubcc0\ud658\uc744 \uc5b4\ub5bb\uac8c \uc5c5\ub370\uc774\ud2b8 \ud558\ub294\uc9c0 \uae30\uc220\ud568.<\/p>\n<p>\uac1d\uccb4\uc758 \ubcc0\ud658\uc744 \uc5c5\ub370\uc774\ud2b8\ud558\uae30 \uc704\ud574\uc11c\ub294 2\uac00\uc9c0 \ubc29\ubc95\uc774 \uc788\uc74c.<\/p>\n<p>1. \uac1d\uccb4\uc758 position, quaternion, scale \uc18d\uc131\uc744 \ubcc0\uacbd\ud558\uace0 \uc774 \uc18d\uc131\ub4e4\ub85c\ubd80\ud130 \uac1d\uccb4\uc758 \ud589\ub82c\uc744 \ub2e4\uc2dc \uacc4\uc0b0\uc2dc\ud0b4.<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"js\">\r\nobject.position.copy( start_position );\r\nobject.quaternion.copy( quaternion );\r\n<\/pre>\n<p>\uae30\ubcf8\uc801\uc73c\ub85c matrixAutoUpdate \uc18d\uc131\uc774 true\uc774\ubbc0\ub85c \ud589\ub82c\uc740 \uc790\ub3d9\uc801\uc73c\ub85c \uc7ac\uacc4\uc0b0\ub428. \ub9cc\uc57d \uac1d\uccb4\uac00 \uc815\uc801\uc774\uac70\ub098 \ud589\ub82c \uc7ac\uacc4\uc0b0\uc744 \uc218\ub3d9\uc73c\ub85c \uc81c\uc5b4\ud558\uace0\uc790 \ud55c\ub2e4\uba74 matrixAutoUpdate\ub97c false\ub85c \uc9c0\uc815\ud558\uc5ec \ub354 \ub098\uc740 \ud37c\ud3ec\uba3c\uc2a4\ub97c \uc5bb\uc744 \uc218 \uc788\uc74c. \uc774\ub54c \ub2e4\uc74c\ucc98\ub7fc \uc218\ub3d9\uc73c\ub85c \ud589\ub82c\uc744 \uc7ac\uacc4\uc0b0\ud560 \uc218 \uc788\uc74c.<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"js\">\r\nobject.updateMatrix();\r\n<\/pre>\n<p>2. \uac1d\uccb4\uc758 \ud589\ub82c\uc744 \uc9c1\uc811 \ubcc0\uacbd\ud574\ub3c4 \ub428. Matrix4 \ud074\ub798\uc2a4\ub294 \ud589\ub82c \ubcc0\uacbd\uc744 \uc704\ud55c \ub2e4\uc591\ud55c \ub9e4\uc11c\ub4dc\ub97c \uc81c\uacf5\ud568.<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"js\">\r\nobject.matrix.setRotationFromQuaternion( quaternion );\r\nobject.matrix.setPosition( start_position );\r\nobject.matrixAutoUpdate = false;\r\n<\/pre>\n<p>\uc717 \ucf54\ub4dc\uc758 \uacbd\uc6b0 matrixAutoUpdate\uc758 \uac12\uc740 false\ub85c \uc9c0\uc815\ud588\uace0 updateMatrix \ub9e4\uc11c\ub4dc\uac00 \ud638\ucd9c\ub418\uc9c0 \uc54a\ub3c4\ub85d \ubcf4\uc7a5\ud574\uc57c \ud568. updateMatrix \ub9e4\uc11c\ub4dc\ub97c \ud638\ucd9c\ud558\uba74 position, scale \ub4f1\uc758 \uc18d\uc131\uac12\uc73c\ub85c \ud589\ub82c\uc774 \uc7ac\uacc4\uc0b0\ub418\uc5b4 \ubc84\ub9bc.<\/p>\n<p>\uac1d\uccb4\uc758 \ud589\ub82c\uc5d0\ub294 \ubd80\ubaa8 \uac1d\uccb4\uc640 \uc5f0\uad00\ub41c \uac1d\uccb4\uc758 \ubcc0\ud658\uac12\uc774 \uc800\uc7a5\ub418\uc5b4 \uc788\uc74c. \uc6d4\ub4dc \uc88c\ud45c\uacc4\uc5d0 \ub300\ud55c \uac1d\uccb4\uc758 \ubcc0\ud658\uc744 \uc5bb\uae30 \uc704\ud574\uc11c\ub294 \uac1d\uccb4\uc758 Object3D.matrixWorld\uc5d0 \uc811\uadfc\ud574\uc57c \ud568.<\/p>\n<p>\ubd80\ubaa8 \ub610\ub294 \uc790\uc2dd \uac1d\uccb4\uc758 \ubcc0\ud658\uc774 \ubcc0\uacbd\ub420 \ub54c, \uc790\uc2dd \uac1d\uccb4\uc758 matrixWorld\ub97c \uc5c5\ub370\uc774\ud2b8\ub418\ub3c4\ub85d updateMatrixWorld \ub9e4\uc11c\ub4dc\ub97c \ud638\ucd9c\ud560 \uc218 \uc788\uc74c.<\/p>\n<p>Three.js\ub294 3\ucc28\uc6d0 \ud68c\uc804\uc744 \uc704\ud574 2\uac00\uc9c0 \ubc29\uc2dd\uc744 \uc81c\uacf5: \uc624\uc77c\ub7ec(Euler) \uac01\ub3c4\uc640 \ucffc\ud130\ub2c8\uc548(Quaternions). \uc774 2\uac00\uc9c0 \ubc29\uc2dd\uc740 \uc0c1\ud638\uac04\uc758 \ubcc0\ud658\uc774 \uac00\ub2a5\ud568. \uc624\uc77c\ub7ec \uac01\ub3c4 \ubc29\uc2dd\uc740 \uc9d0\ubc8c\ub77d(Gimbal Lock)\uc774\ub77c\uace0 \ubd88\ub9ac\uc6b0\ub294 \ubb38\uc81c\uac00 \uc788\uc74c\uc73c\ub85c \uac1d\uccb4\uc758 \ud68c\uc804\uc740 \ubc18\ub4dc\uc2dc \ucffc\ud130\ub2c8\uc548 \ubc29\uc2dd\uc744 \uc704\ud55c quaternion \uc18d\uc131\uc744 \uc774\uc6a9\ud574\uc57c \ud568.<\/p>\n<p><a href='https:\/\/threejs.org\/docs\/index.html#manual\/en\/introduction\/Matrix-transformations'>\uc774 \uae00\uc758 \uc6d0\ubb38<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Three.js\ub294 \uc774\ub3d9(position), \ud68c\uc804, \ud06c\uae30\ubcc0\ud658\uacfc \uac19\uc740 3\ucc28\uc6d0 \ubcc0\ud658\uc744 \uc704\ud574 \ud589\ub82c\uc744 \uc0ac\uc6a9\ud568. Object3D\uc758 \ud30c\uc0dd \ud074\ub798\uc2a4\uc758 \ubaa8\ub4e0 \uac1d\uccb4\ub294 matrix \uc18d\uc131\uc744 \uac00\uc9c0\uace0 \uc788\uace0 \uc774 \uc18d\uc131\uc740 \uac1d\uccb4\uc758 \uc704\uce58, \ud68c\uc804, \ud06c\uae30 \ubcc0\ud658\uac12\uc774 \uc800\uc7a5\ub418\uc5b4 \uc788\uc74c. \uc774 \uae00\uc740 \uac1d\uccb4\uc758 \ubcc0\ud658\uc744 \uc5b4\ub5bb\uac8c \uc5c5\ub370\uc774\ud2b8 \ud558\ub294\uc9c0 \uae30\uc220\ud568. \uac1d\uccb4\uc758 \ubcc0\ud658\uc744 \uc5c5\ub370\uc774\ud2b8\ud558\uae30 \uc704\ud574\uc11c\ub294 2\uac00\uc9c0 \ubc29\ubc95\uc774 \uc788\uc74c. 1. \uac1d\uccb4\uc758 position, quaternion, scale \uc18d\uc131\uc744 \ubcc0\uacbd\ud558\uace0 \uc774 \uc18d\uc131\ub4e4\ub85c\ubd80\ud130 \uac1d\uccb4\uc758 \ud589\ub82c\uc744 \ub2e4\uc2dc &hellip; <\/p>\n<p class=\"link-more\"><a href=\"http:\/\/www.gisdeveloper.co.kr\/?p=13347\" class=\"more-link\">\ub354 \ubcf4\uae30<span class=\"screen-reader-text\"> &#8220;three.js\uc758 \ud589\ub82c \ubcc0\ud658&#8221;<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[145],"tags":[],"class_list":["post-13347","post","type-post","status-publish","format-standard","hentry","category-three-js"],"_links":{"self":[{"href":"http:\/\/www.gisdeveloper.co.kr\/index.php?rest_route=\/wp\/v2\/posts\/13347","targetHints":{"allow":["GET"]}}],"collection":[{"href":"http:\/\/www.gisdeveloper.co.kr\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/www.gisdeveloper.co.kr\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/www.gisdeveloper.co.kr\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/www.gisdeveloper.co.kr\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=13347"}],"version-history":[{"count":4,"href":"http:\/\/www.gisdeveloper.co.kr\/index.php?rest_route=\/wp\/v2\/posts\/13347\/revisions"}],"predecessor-version":[{"id":14527,"href":"http:\/\/www.gisdeveloper.co.kr\/index.php?rest_route=\/wp\/v2\/posts\/13347\/revisions\/14527"}],"wp:attachment":[{"href":"http:\/\/www.gisdeveloper.co.kr\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=13347"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/www.gisdeveloper.co.kr\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=13347"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/www.gisdeveloper.co.kr\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=13347"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}