A-Frame\u306e\u30b7\u30fc\u30f3\u306bThree-VRM\u3067\u30ed\u30fc\u30c9\u3057\u305f\u30e2\u30c7\u30eb\u3092setObject3D\u95a2\u6570\u3092\u4f7f\u3063\u3066\u5165\u308c\u305f\u6240\u3001A-Frame\u3067\u8aad\u307f\u8fbc\u3093\u3067\u3044\u308bThree.js\u3068Three-VRM\u3067\u8aad\u307f\u8fbc\u3093\u3067\u3044\u308bThree.js\u306e\u30a4\u30f3\u30b9\u30bf\u30f3\u30b9\u304c\u9055\u3046\u70ba\u306bA-Frame\u5074\u3067\u5f3e\u304b\u308c\u305f\u3002<\/p>\n\n\n\n
[Error : Entity.setObject3D<\/code> was called with an object that was not an instance of THREE.Object3D.]<\/p>\n\n\n\nA-Frame\u3067\u4f7f\u7528\u3057\u3066\u3044\u308b\u30b7\u30fc\u30f3(sceneEl)\u306b\u76f4\u63a5\u8ffd\u52a0\u3057\u3066\u3057\u3066\u307f\u3066\u3082\u5f3e\u304b\u308c\u307e\u3059\u3002<\/p>\n\n\n\n[Error : “Trying to add an element that doesn’t have an object3D<\/code>“]<\/p>\n\n\n\n\u305d\u3053\u3067\u4eca\u56de\u306fA-Frame\u3068\u9055\u3046\u30b7\u30fc\u30f3\u3092Three.js\u3067\u4f5c\u6210\u3057\u3066\u304b\u3089A-Frame\u306e\u30b7\u30fc\u30f3\u306b\u91cd\u306d\u308b\u65b9\u6cd5\u3067\u8868\u793a\u3055\u305b\u3066\u307f\u307e\u3057\u305f\u3002<\/p>\n\n\n\n<\/video><\/figure>\n\n\n\n<\/p>\n\n\n\n\n\nTable of Contents<\/p>\nToggle<\/span><\/path><\/svg><\/svg><\/span><\/span><\/span><\/a><\/span><\/div>\n\u30e9\u30a4\u30d6\u30e9\u30ea\u306e\u30d0\u30fc\u30b8\u30e7\u30f3<\/a><\/li>\u5b9f\u88c5\u30a4\u30e1\u30fc\u30b8<\/a><\/li>\u30b0\u30ed\u30fc\u30d0\u30eb\u5909\u6570\u306e\u8a2d\u5b9a<\/a><\/li>\u30b7\u30fc\u30f3\u306e\u4f5c\u6210\u3068VRM\u30e2\u30c7\u30eb\u306e\u8aad\u307f\u8fbc\u307f<\/a><\/li>\u30b7\u30fc\u30f3\u306e\u30ec\u30f3\u30c0\u30ea\u30f3\u30b0<\/a><\/li>\u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3\u95a2\u6570<\/a><\/li>\u30b3\u30fc\u30c9\u5168\u4f53<\/a><\/li><\/ul><\/nav><\/div>\n<\/span>\u30e9\u30a4\u30d6\u30e9\u30ea\u306e\u30d0\u30fc\u30b8\u30e7\u30f3<\/span><\/h2>\n\n\n\n\nA-Frame : 1.5.0<\/p>\n\n\n\nTree : r158<\/p>\n\n\n\nThree-VRM : 2.0.7<\/p>\n\n\n\ns-module-shims : 1.8.2<\/p>\n<\/blockquote>\n\n\n\n<\/span>\u5b9f\u88c5\u30a4\u30e1\u30fc\u30b8<\/span><\/h2>\n\n\n\n<\/circle><\/circle><\/circle><\/g><\/svg><\/span><\/path><\/path><\/svg><\/span>### \u5b9f\u88c5\u306e\u6982\u5ff5\u7684\u30a4\u30e1\u30fc\u30b8 ###<\/span><\/span>\n<\/span>\n<!<\/span>DOCTYPE<\/span> <\/span>html<\/span>><\/span><\/span>\n<<\/span>html<\/span> <\/span>lang<\/span>=<\/span>"jp"<\/span>><\/span><\/span>\n<\/span>\n <\/span><<\/span>head<\/span>><\/span><\/span>\n <\/span><!-- \u30e9\u30a4\u30d6\u30e9\u30ea\u306e\u8aad\u307f\u8fbc\u307f --><\/span><\/span>\n <\/span><\/<\/span>head<\/span>><\/span><\/span>\n<\/span>\n <\/span><<\/span>body<\/span>><\/span><\/span>\n <\/span><!-- a-frame\u306e\u8981\u7d20\u914d\u7f6e --><\/span><\/span>\n <\/span><<\/span>a-scene<\/span>><\/span><\/span>\n <\/span><<\/span>a-entity<\/span> <\/span>vrm<\/span>=<\/span>""<\/span>><\/<\/span>a-entity<\/span>><\/span><\/span>\n <\/span><\/<\/span>a-scene<\/span>><\/span><\/span>\n<\/span>\n <\/span><<\/span>script<\/span> <\/span>type<\/span>=<\/span>"module"<\/span>><\/span><\/span>\n <\/span>\/\/ VRM\u30e2\u30c7\u30eb\u306e\u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3\u95a2\u6570<\/span><\/span>\n <\/span>function<\/span> <\/span>vrmModelAnimate<\/span>() {}<\/span><\/span>\n <\/span><\/span>\n <\/span>\/\/ A-Frame\u306e\u30a8\u30f3\u30c6\u30a3\u30c6\u30a3\u306bVRM\u30e2\u30c7\u30eb\u3092\u8a2d\u5b9a<\/span><\/span>\n <\/span>AFRAME<\/span>.<\/span>registerComponent<\/span>(<\/span>"three-scene"<\/span>, {<\/span><\/span>\n <\/span>init<\/span>:<\/span> <\/span>function<\/span>() {<\/span><\/span>\n <\/span>\/\/ VRM\u30e2\u30c7\u30eb\u306e\u8aad\u307f\u8fbc\u307f<\/span><\/span>\n },<\/span><\/span>\n <\/span>tick<\/span>:<\/span> <\/span>function<\/span> (<\/span>time<\/span>, <\/span>timeDelta<\/span>) {<\/span><\/span>\n <\/span>\/\/ VRM\u30e2\u30c7\u30eb\u306e\u8868\u793a update<\/span><\/span>\n <\/span>\/\/ A-Frame\u306e\u30ec\u30f3\u30c0\u30e9\u30fc\u3092\u4f7f\u3063\u3066\u30ab\u30e1\u30e9\u6620\u50cf\u306e\u4e0a\u306bVRM\u30e2\u30c7\u30eb\u8868\u793a<\/span><\/span>\n }<\/span><\/span>\n });<\/span><\/span>\n <\/span><\/<\/span>script<\/span>><\/span><\/span>\n <\/span><\/<\/span>body<\/span>><\/span><\/span>\n<\/<\/span>html<\/span>><\/span><\/span><\/code><\/pre><\/div>\n\n\n\n\u3000<\/p>\n\n\n\n<\/span>\u30b0\u30ed\u30fc\u30d0\u30eb\u5909\u6570\u306e\u8a2d\u5b9a<\/span><\/h2>\n\n\n\nVRM\u30e2\u30c7\u30eb\u3092\u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3\u3055\u305b\u308b\u6642\u8a08\u3068A-Frame\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u95a2\u6570\u304b\u3089\u53c2\u7167\u51fa\u6765\u308b\u5909\u6570\u3092\u7528\u610f\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<\/circle><\/circle><\/circle><\/g><\/svg><\/span><\/path><\/path><\/svg><\/span>const<\/span> <\/span>clock<\/span> = <\/span>new<\/span> <\/span>THREE<\/span>.<\/span>Clock<\/span>();<\/span><\/span>\nclock<\/span>.<\/span>start<\/span>();<\/span><\/span>\nlet<\/span> <\/span>avatar<\/span> = <\/span>undefined<\/span>;<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n\u3000<\/p>\n\n\n\n<\/span>\u30b7\u30fc\u30f3\u306e\u4f5c\u6210\u3068VRM\u30e2\u30c7\u30eb\u306e\u8aad\u307f\u8fbc\u307f<\/span><\/h2>\n\n\n\n\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u306einit\u95a2\u6570\u5185\u3067\u5b9f\u65bd\u3055\u305b\u307e\u3059<\/p>\n\n\n\n<\/circle><\/circle><\/circle><\/g><\/svg><\/span><\/path><\/path><\/svg><\/span>init<\/span>: <\/span>function<\/span>
Entity.setObject3D<\/code> was called with an object that was not an instance of THREE.Object3D.]<\/p>\n\n\n\nA-Frame\u3067\u4f7f\u7528\u3057\u3066\u3044\u308b\u30b7\u30fc\u30f3(sceneEl)\u306b\u76f4\u63a5\u8ffd\u52a0\u3057\u3066\u3057\u3066\u307f\u3066\u3082\u5f3e\u304b\u308c\u307e\u3059\u3002<\/p>\n\n\n\n[Error : “Trying to add an element that doesn’t have an object3D<\/code>“]<\/p>\n\n\n\n\u305d\u3053\u3067\u4eca\u56de\u306fA-Frame\u3068\u9055\u3046\u30b7\u30fc\u30f3\u3092Three.js\u3067\u4f5c\u6210\u3057\u3066\u304b\u3089A-Frame\u306e\u30b7\u30fc\u30f3\u306b\u91cd\u306d\u308b\u65b9\u6cd5\u3067\u8868\u793a\u3055\u305b\u3066\u307f\u307e\u3057\u305f\u3002<\/p>\n\n\n\n<\/video><\/figure>\n\n\n\n<\/p>\n\n\n\n\n\nTable of Contents<\/p>\nToggle<\/span><\/path><\/svg><\/svg><\/span><\/span><\/span><\/a><\/span><\/div>\n\u30e9\u30a4\u30d6\u30e9\u30ea\u306e\u30d0\u30fc\u30b8\u30e7\u30f3<\/a><\/li>\u5b9f\u88c5\u30a4\u30e1\u30fc\u30b8<\/a><\/li>\u30b0\u30ed\u30fc\u30d0\u30eb\u5909\u6570\u306e\u8a2d\u5b9a<\/a><\/li>\u30b7\u30fc\u30f3\u306e\u4f5c\u6210\u3068VRM\u30e2\u30c7\u30eb\u306e\u8aad\u307f\u8fbc\u307f<\/a><\/li>\u30b7\u30fc\u30f3\u306e\u30ec\u30f3\u30c0\u30ea\u30f3\u30b0<\/a><\/li>\u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3\u95a2\u6570<\/a><\/li>\u30b3\u30fc\u30c9\u5168\u4f53<\/a><\/li><\/ul><\/nav><\/div>\n<\/span>\u30e9\u30a4\u30d6\u30e9\u30ea\u306e\u30d0\u30fc\u30b8\u30e7\u30f3<\/span><\/h2>\n\n\n\n\nA-Frame : 1.5.0<\/p>\n\n\n\nTree : r158<\/p>\n\n\n\nThree-VRM : 2.0.7<\/p>\n\n\n\ns-module-shims : 1.8.2<\/p>\n<\/blockquote>\n\n\n\n<\/span>\u5b9f\u88c5\u30a4\u30e1\u30fc\u30b8<\/span><\/h2>\n\n\n\n<\/circle><\/circle><\/circle><\/g><\/svg><\/span><\/path><\/path><\/svg><\/span>### \u5b9f\u88c5\u306e\u6982\u5ff5\u7684\u30a4\u30e1\u30fc\u30b8 ###<\/span><\/span>\n<\/span>\n<!<\/span>DOCTYPE<\/span> <\/span>html<\/span>><\/span><\/span>\n<<\/span>html<\/span> <\/span>lang<\/span>=<\/span>"jp"<\/span>><\/span><\/span>\n<\/span>\n <\/span><<\/span>head<\/span>><\/span><\/span>\n <\/span><!-- \u30e9\u30a4\u30d6\u30e9\u30ea\u306e\u8aad\u307f\u8fbc\u307f --><\/span><\/span>\n <\/span><\/<\/span>head<\/span>><\/span><\/span>\n<\/span>\n <\/span><<\/span>body<\/span>><\/span><\/span>\n <\/span><!-- a-frame\u306e\u8981\u7d20\u914d\u7f6e --><\/span><\/span>\n <\/span><<\/span>a-scene<\/span>><\/span><\/span>\n <\/span><<\/span>a-entity<\/span> <\/span>vrm<\/span>=<\/span>""<\/span>><\/<\/span>a-entity<\/span>><\/span><\/span>\n <\/span><\/<\/span>a-scene<\/span>><\/span><\/span>\n<\/span>\n <\/span><<\/span>script<\/span> <\/span>type<\/span>=<\/span>"module"<\/span>><\/span><\/span>\n <\/span>\/\/ VRM\u30e2\u30c7\u30eb\u306e\u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3\u95a2\u6570<\/span><\/span>\n <\/span>function<\/span> <\/span>vrmModelAnimate<\/span>() {}<\/span><\/span>\n <\/span><\/span>\n <\/span>\/\/ A-Frame\u306e\u30a8\u30f3\u30c6\u30a3\u30c6\u30a3\u306bVRM\u30e2\u30c7\u30eb\u3092\u8a2d\u5b9a<\/span><\/span>\n <\/span>AFRAME<\/span>.<\/span>registerComponent<\/span>(<\/span>"three-scene"<\/span>, {<\/span><\/span>\n <\/span>init<\/span>:<\/span> <\/span>function<\/span>() {<\/span><\/span>\n <\/span>\/\/ VRM\u30e2\u30c7\u30eb\u306e\u8aad\u307f\u8fbc\u307f<\/span><\/span>\n },<\/span><\/span>\n <\/span>tick<\/span>:<\/span> <\/span>function<\/span> (<\/span>time<\/span>, <\/span>timeDelta<\/span>) {<\/span><\/span>\n <\/span>\/\/ VRM\u30e2\u30c7\u30eb\u306e\u8868\u793a update<\/span><\/span>\n <\/span>\/\/ A-Frame\u306e\u30ec\u30f3\u30c0\u30e9\u30fc\u3092\u4f7f\u3063\u3066\u30ab\u30e1\u30e9\u6620\u50cf\u306e\u4e0a\u306bVRM\u30e2\u30c7\u30eb\u8868\u793a<\/span><\/span>\n }<\/span><\/span>\n });<\/span><\/span>\n <\/span><\/<\/span>script<\/span>><\/span><\/span>\n <\/span><\/<\/span>body<\/span>><\/span><\/span>\n<\/<\/span>html<\/span>><\/span><\/span><\/code><\/pre><\/div>\n\n\n\n\u3000<\/p>\n\n\n\n<\/span>\u30b0\u30ed\u30fc\u30d0\u30eb\u5909\u6570\u306e\u8a2d\u5b9a<\/span><\/h2>\n\n\n\nVRM\u30e2\u30c7\u30eb\u3092\u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3\u3055\u305b\u308b\u6642\u8a08\u3068A-Frame\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u95a2\u6570\u304b\u3089\u53c2\u7167\u51fa\u6765\u308b\u5909\u6570\u3092\u7528\u610f\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<\/circle><\/circle><\/circle><\/g><\/svg><\/span><\/path><\/path><\/svg><\/span>const<\/span> <\/span>clock<\/span> = <\/span>new<\/span> <\/span>THREE<\/span>.<\/span>Clock<\/span>();<\/span><\/span>\nclock<\/span>.<\/span>start<\/span>();<\/span><\/span>\nlet<\/span> <\/span>avatar<\/span> = <\/span>undefined<\/span>;<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n\u3000<\/p>\n\n\n\n<\/span>\u30b7\u30fc\u30f3\u306e\u4f5c\u6210\u3068VRM\u30e2\u30c7\u30eb\u306e\u8aad\u307f\u8fbc\u307f<\/span><\/h2>\n\n\n\n\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u306einit\u95a2\u6570\u5185\u3067\u5b9f\u65bd\u3055\u305b\u307e\u3059<\/p>\n\n\n\n<\/circle><\/circle><\/circle><\/g><\/svg><\/span><\/path><\/path><\/svg><\/span>init<\/span>: <\/span>function<\/span>
A-Frame\u3067\u4f7f\u7528\u3057\u3066\u3044\u308b\u30b7\u30fc\u30f3(sceneEl)\u306b\u76f4\u63a5\u8ffd\u52a0\u3057\u3066\u3057\u3066\u307f\u3066\u3082\u5f3e\u304b\u308c\u307e\u3059\u3002<\/p>\n\n\n\n
[Error : “Trying to add an element that doesn’t have an object3D<\/code>“]<\/p>\n\n\n\n\u305d\u3053\u3067\u4eca\u56de\u306fA-Frame\u3068\u9055\u3046\u30b7\u30fc\u30f3\u3092Three.js\u3067\u4f5c\u6210\u3057\u3066\u304b\u3089A-Frame\u306e\u30b7\u30fc\u30f3\u306b\u91cd\u306d\u308b\u65b9\u6cd5\u3067\u8868\u793a\u3055\u305b\u3066\u307f\u307e\u3057\u305f\u3002<\/p>\n\n\n\n<\/video><\/figure>\n\n\n\n<\/p>\n\n\n\n\n\nTable of Contents<\/p>\nToggle<\/span><\/path><\/svg><\/svg><\/span><\/span><\/span><\/a><\/span><\/div>\n\u30e9\u30a4\u30d6\u30e9\u30ea\u306e\u30d0\u30fc\u30b8\u30e7\u30f3<\/a><\/li>\u5b9f\u88c5\u30a4\u30e1\u30fc\u30b8<\/a><\/li>\u30b0\u30ed\u30fc\u30d0\u30eb\u5909\u6570\u306e\u8a2d\u5b9a<\/a><\/li>\u30b7\u30fc\u30f3\u306e\u4f5c\u6210\u3068VRM\u30e2\u30c7\u30eb\u306e\u8aad\u307f\u8fbc\u307f<\/a><\/li>\u30b7\u30fc\u30f3\u306e\u30ec\u30f3\u30c0\u30ea\u30f3\u30b0<\/a><\/li>\u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3\u95a2\u6570<\/a><\/li>\u30b3\u30fc\u30c9\u5168\u4f53<\/a><\/li><\/ul><\/nav><\/div>\n<\/span>\u30e9\u30a4\u30d6\u30e9\u30ea\u306e\u30d0\u30fc\u30b8\u30e7\u30f3<\/span><\/h2>\n\n\n\n\nA-Frame : 1.5.0<\/p>\n\n\n\nTree : r158<\/p>\n\n\n\nThree-VRM : 2.0.7<\/p>\n\n\n\ns-module-shims : 1.8.2<\/p>\n<\/blockquote>\n\n\n\n<\/span>\u5b9f\u88c5\u30a4\u30e1\u30fc\u30b8<\/span><\/h2>\n\n\n\n<\/circle><\/circle><\/circle><\/g><\/svg><\/span><\/path><\/path><\/svg><\/span>### \u5b9f\u88c5\u306e\u6982\u5ff5\u7684\u30a4\u30e1\u30fc\u30b8 ###<\/span><\/span>\n<\/span>\n<!<\/span>DOCTYPE<\/span> <\/span>html<\/span>><\/span><\/span>\n<<\/span>html<\/span> <\/span>lang<\/span>=<\/span>"jp"<\/span>><\/span><\/span>\n<\/span>\n <\/span><<\/span>head<\/span>><\/span><\/span>\n <\/span><!-- \u30e9\u30a4\u30d6\u30e9\u30ea\u306e\u8aad\u307f\u8fbc\u307f --><\/span><\/span>\n <\/span><\/<\/span>head<\/span>><\/span><\/span>\n<\/span>\n <\/span><<\/span>body<\/span>><\/span><\/span>\n <\/span><!-- a-frame\u306e\u8981\u7d20\u914d\u7f6e --><\/span><\/span>\n <\/span><<\/span>a-scene<\/span>><\/span><\/span>\n <\/span><<\/span>a-entity<\/span> <\/span>vrm<\/span>=<\/span>""<\/span>><\/<\/span>a-entity<\/span>><\/span><\/span>\n <\/span><\/<\/span>a-scene<\/span>><\/span><\/span>\n<\/span>\n <\/span><<\/span>script<\/span> <\/span>type<\/span>=<\/span>"module"<\/span>><\/span><\/span>\n <\/span>\/\/ VRM\u30e2\u30c7\u30eb\u306e\u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3\u95a2\u6570<\/span><\/span>\n <\/span>function<\/span> <\/span>vrmModelAnimate<\/span>() {}<\/span><\/span>\n <\/span><\/span>\n <\/span>\/\/ A-Frame\u306e\u30a8\u30f3\u30c6\u30a3\u30c6\u30a3\u306bVRM\u30e2\u30c7\u30eb\u3092\u8a2d\u5b9a<\/span><\/span>\n <\/span>AFRAME<\/span>.<\/span>registerComponent<\/span>(<\/span>"three-scene"<\/span>, {<\/span><\/span>\n <\/span>init<\/span>:<\/span> <\/span>function<\/span>() {<\/span><\/span>\n <\/span>\/\/ VRM\u30e2\u30c7\u30eb\u306e\u8aad\u307f\u8fbc\u307f<\/span><\/span>\n },<\/span><\/span>\n <\/span>tick<\/span>:<\/span> <\/span>function<\/span> (<\/span>time<\/span>, <\/span>timeDelta<\/span>) {<\/span><\/span>\n <\/span>\/\/ VRM\u30e2\u30c7\u30eb\u306e\u8868\u793a update<\/span><\/span>\n <\/span>\/\/ A-Frame\u306e\u30ec\u30f3\u30c0\u30e9\u30fc\u3092\u4f7f\u3063\u3066\u30ab\u30e1\u30e9\u6620\u50cf\u306e\u4e0a\u306bVRM\u30e2\u30c7\u30eb\u8868\u793a<\/span><\/span>\n }<\/span><\/span>\n });<\/span><\/span>\n <\/span><\/<\/span>script<\/span>><\/span><\/span>\n <\/span><\/<\/span>body<\/span>><\/span><\/span>\n<\/<\/span>html<\/span>><\/span><\/span><\/code><\/pre><\/div>\n\n\n\n\u3000<\/p>\n\n\n\n<\/span>\u30b0\u30ed\u30fc\u30d0\u30eb\u5909\u6570\u306e\u8a2d\u5b9a<\/span><\/h2>\n\n\n\nVRM\u30e2\u30c7\u30eb\u3092\u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3\u3055\u305b\u308b\u6642\u8a08\u3068A-Frame\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u95a2\u6570\u304b\u3089\u53c2\u7167\u51fa\u6765\u308b\u5909\u6570\u3092\u7528\u610f\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<\/circle><\/circle><\/circle><\/g><\/svg><\/span><\/path><\/path><\/svg><\/span>const<\/span> <\/span>clock<\/span> = <\/span>new<\/span> <\/span>THREE<\/span>.<\/span>Clock<\/span>();<\/span><\/span>\nclock<\/span>.<\/span>start<\/span>();<\/span><\/span>\nlet<\/span> <\/span>avatar<\/span> = <\/span>undefined<\/span>;<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n\u3000<\/p>\n\n\n\n<\/span>\u30b7\u30fc\u30f3\u306e\u4f5c\u6210\u3068VRM\u30e2\u30c7\u30eb\u306e\u8aad\u307f\u8fbc\u307f<\/span><\/h2>\n\n\n\n\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u306einit\u95a2\u6570\u5185\u3067\u5b9f\u65bd\u3055\u305b\u307e\u3059<\/p>\n\n\n\n<\/circle><\/circle><\/circle><\/g><\/svg><\/span><\/path><\/path><\/svg><\/span>init<\/span>: <\/span>function<\/span>
object3D<\/code>“]<\/p>\n\n\n\n\u305d\u3053\u3067\u4eca\u56de\u306fA-Frame\u3068\u9055\u3046\u30b7\u30fc\u30f3\u3092Three.js\u3067\u4f5c\u6210\u3057\u3066\u304b\u3089A-Frame\u306e\u30b7\u30fc\u30f3\u306b\u91cd\u306d\u308b\u65b9\u6cd5\u3067\u8868\u793a\u3055\u305b\u3066\u307f\u307e\u3057\u305f\u3002<\/p>\n\n\n\n<\/video><\/figure>\n\n\n\n<\/p>\n\n\n\n\n\nTable of Contents<\/p>\nToggle<\/span><\/path><\/svg><\/svg><\/span><\/span><\/span><\/a><\/span><\/div>\n\u30e9\u30a4\u30d6\u30e9\u30ea\u306e\u30d0\u30fc\u30b8\u30e7\u30f3<\/a><\/li>\u5b9f\u88c5\u30a4\u30e1\u30fc\u30b8<\/a><\/li>\u30b0\u30ed\u30fc\u30d0\u30eb\u5909\u6570\u306e\u8a2d\u5b9a<\/a><\/li>\u30b7\u30fc\u30f3\u306e\u4f5c\u6210\u3068VRM\u30e2\u30c7\u30eb\u306e\u8aad\u307f\u8fbc\u307f<\/a><\/li>\u30b7\u30fc\u30f3\u306e\u30ec\u30f3\u30c0\u30ea\u30f3\u30b0<\/a><\/li>\u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3\u95a2\u6570<\/a><\/li>\u30b3\u30fc\u30c9\u5168\u4f53<\/a><\/li><\/ul><\/nav><\/div>\n<\/span>\u30e9\u30a4\u30d6\u30e9\u30ea\u306e\u30d0\u30fc\u30b8\u30e7\u30f3<\/span><\/h2>\n\n\n\n\nA-Frame : 1.5.0<\/p>\n\n\n\nTree : r158<\/p>\n\n\n\nThree-VRM : 2.0.7<\/p>\n\n\n\ns-module-shims : 1.8.2<\/p>\n<\/blockquote>\n\n\n\n<\/span>\u5b9f\u88c5\u30a4\u30e1\u30fc\u30b8<\/span><\/h2>\n\n\n\n<\/circle><\/circle><\/circle><\/g><\/svg><\/span><\/path><\/path><\/svg><\/span>### \u5b9f\u88c5\u306e\u6982\u5ff5\u7684\u30a4\u30e1\u30fc\u30b8 ###<\/span><\/span>\n<\/span>\n<!<\/span>DOCTYPE<\/span> <\/span>html<\/span>><\/span><\/span>\n<<\/span>html<\/span> <\/span>lang<\/span>=<\/span>"jp"<\/span>><\/span><\/span>\n<\/span>\n <\/span><<\/span>head<\/span>><\/span><\/span>\n <\/span><!-- \u30e9\u30a4\u30d6\u30e9\u30ea\u306e\u8aad\u307f\u8fbc\u307f --><\/span><\/span>\n <\/span><\/<\/span>head<\/span>><\/span><\/span>\n<\/span>\n <\/span><<\/span>body<\/span>><\/span><\/span>\n <\/span><!-- a-frame\u306e\u8981\u7d20\u914d\u7f6e --><\/span><\/span>\n <\/span><<\/span>a-scene<\/span>><\/span><\/span>\n <\/span><<\/span>a-entity<\/span> <\/span>vrm<\/span>=<\/span>""<\/span>><\/<\/span>a-entity<\/span>><\/span><\/span>\n <\/span><\/<\/span>a-scene<\/span>><\/span><\/span>\n<\/span>\n <\/span><<\/span>script<\/span> <\/span>type<\/span>=<\/span>"module"<\/span>><\/span><\/span>\n <\/span>\/\/ VRM\u30e2\u30c7\u30eb\u306e\u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3\u95a2\u6570<\/span><\/span>\n <\/span>function<\/span> <\/span>vrmModelAnimate<\/span>() {}<\/span><\/span>\n <\/span><\/span>\n <\/span>\/\/ A-Frame\u306e\u30a8\u30f3\u30c6\u30a3\u30c6\u30a3\u306bVRM\u30e2\u30c7\u30eb\u3092\u8a2d\u5b9a<\/span><\/span>\n <\/span>AFRAME<\/span>.<\/span>registerComponent<\/span>(<\/span>"three-scene"<\/span>, {<\/span><\/span>\n <\/span>init<\/span>:<\/span> <\/span>function<\/span>() {<\/span><\/span>\n <\/span>\/\/ VRM\u30e2\u30c7\u30eb\u306e\u8aad\u307f\u8fbc\u307f<\/span><\/span>\n },<\/span><\/span>\n <\/span>tick<\/span>:<\/span> <\/span>function<\/span> (<\/span>time<\/span>, <\/span>timeDelta<\/span>) {<\/span><\/span>\n <\/span>\/\/ VRM\u30e2\u30c7\u30eb\u306e\u8868\u793a update<\/span><\/span>\n <\/span>\/\/ A-Frame\u306e\u30ec\u30f3\u30c0\u30e9\u30fc\u3092\u4f7f\u3063\u3066\u30ab\u30e1\u30e9\u6620\u50cf\u306e\u4e0a\u306bVRM\u30e2\u30c7\u30eb\u8868\u793a<\/span><\/span>\n }<\/span><\/span>\n });<\/span><\/span>\n <\/span><\/<\/span>script<\/span>><\/span><\/span>\n <\/span><\/<\/span>body<\/span>><\/span><\/span>\n<\/<\/span>html<\/span>><\/span><\/span><\/code><\/pre><\/div>\n\n\n\n\u3000<\/p>\n\n\n\n<\/span>\u30b0\u30ed\u30fc\u30d0\u30eb\u5909\u6570\u306e\u8a2d\u5b9a<\/span><\/h2>\n\n\n\nVRM\u30e2\u30c7\u30eb\u3092\u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3\u3055\u305b\u308b\u6642\u8a08\u3068A-Frame\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u95a2\u6570\u304b\u3089\u53c2\u7167\u51fa\u6765\u308b\u5909\u6570\u3092\u7528\u610f\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<\/circle><\/circle><\/circle><\/g><\/svg><\/span><\/path><\/path><\/svg><\/span>const<\/span> <\/span>clock<\/span> = <\/span>new<\/span> <\/span>THREE<\/span>.<\/span>Clock<\/span>();<\/span><\/span>\nclock<\/span>.<\/span>start<\/span>();<\/span><\/span>\nlet<\/span> <\/span>avatar<\/span> = <\/span>undefined<\/span>;<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n\u3000<\/p>\n\n\n\n<\/span>\u30b7\u30fc\u30f3\u306e\u4f5c\u6210\u3068VRM\u30e2\u30c7\u30eb\u306e\u8aad\u307f\u8fbc\u307f<\/span><\/h2>\n\n\n\n\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u306einit\u95a2\u6570\u5185\u3067\u5b9f\u65bd\u3055\u305b\u307e\u3059<\/p>\n\n\n\n<\/circle><\/circle><\/circle><\/g><\/svg><\/span><\/path><\/path><\/svg><\/span>init<\/span>: <\/span>function<\/span>
\u305d\u3053\u3067\u4eca\u56de\u306fA-Frame\u3068\u9055\u3046\u30b7\u30fc\u30f3\u3092Three.js\u3067\u4f5c\u6210\u3057\u3066\u304b\u3089A-Frame\u306e\u30b7\u30fc\u30f3\u306b\u91cd\u306d\u308b\u65b9\u6cd5\u3067\u8868\u793a\u3055\u305b\u3066\u307f\u307e\u3057\u305f\u3002<\/p>\n\n\n\n<\/video><\/figure>\n\n\n\n<\/p>\n\n\n\n\n\nTable of Contents<\/p>\nToggle<\/span><\/path><\/svg><\/svg><\/span><\/span><\/span><\/a><\/span><\/div>\n\u30e9\u30a4\u30d6\u30e9\u30ea\u306e\u30d0\u30fc\u30b8\u30e7\u30f3<\/a><\/li>\u5b9f\u88c5\u30a4\u30e1\u30fc\u30b8<\/a><\/li>\u30b0\u30ed\u30fc\u30d0\u30eb\u5909\u6570\u306e\u8a2d\u5b9a<\/a><\/li>\u30b7\u30fc\u30f3\u306e\u4f5c\u6210\u3068VRM\u30e2\u30c7\u30eb\u306e\u8aad\u307f\u8fbc\u307f<\/a><\/li>\u30b7\u30fc\u30f3\u306e\u30ec\u30f3\u30c0\u30ea\u30f3\u30b0<\/a><\/li>\u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3\u95a2\u6570<\/a><\/li>\u30b3\u30fc\u30c9\u5168\u4f53<\/a><\/li><\/ul><\/nav><\/div>\n<\/span>\u30e9\u30a4\u30d6\u30e9\u30ea\u306e\u30d0\u30fc\u30b8\u30e7\u30f3<\/span><\/h2>\n\n\n\n\nA-Frame : 1.5.0<\/p>\n\n\n\nTree : r158<\/p>\n\n\n\nThree-VRM : 2.0.7<\/p>\n\n\n\ns-module-shims : 1.8.2<\/p>\n<\/blockquote>\n\n\n\n<\/span>\u5b9f\u88c5\u30a4\u30e1\u30fc\u30b8<\/span><\/h2>\n\n\n\n<\/circle><\/circle><\/circle><\/g><\/svg><\/span><\/path><\/path><\/svg><\/span>### \u5b9f\u88c5\u306e\u6982\u5ff5\u7684\u30a4\u30e1\u30fc\u30b8 ###<\/span><\/span>\n<\/span>\n<!<\/span>DOCTYPE<\/span> <\/span>html<\/span>><\/span><\/span>\n<<\/span>html<\/span> <\/span>lang<\/span>=<\/span>"jp"<\/span>><\/span><\/span>\n<\/span>\n <\/span><<\/span>head<\/span>><\/span><\/span>\n <\/span><!-- \u30e9\u30a4\u30d6\u30e9\u30ea\u306e\u8aad\u307f\u8fbc\u307f --><\/span><\/span>\n <\/span><\/<\/span>head<\/span>><\/span><\/span>\n<\/span>\n <\/span><<\/span>body<\/span>><\/span><\/span>\n <\/span><!-- a-frame\u306e\u8981\u7d20\u914d\u7f6e --><\/span><\/span>\n <\/span><<\/span>a-scene<\/span>><\/span><\/span>\n <\/span><<\/span>a-entity<\/span> <\/span>vrm<\/span>=<\/span>""<\/span>><\/<\/span>a-entity<\/span>><\/span><\/span>\n <\/span><\/<\/span>a-scene<\/span>><\/span><\/span>\n<\/span>\n <\/span><<\/span>script<\/span> <\/span>type<\/span>=<\/span>"module"<\/span>><\/span><\/span>\n <\/span>\/\/ VRM\u30e2\u30c7\u30eb\u306e\u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3\u95a2\u6570<\/span><\/span>\n <\/span>function<\/span> <\/span>vrmModelAnimate<\/span>() {}<\/span><\/span>\n <\/span><\/span>\n <\/span>\/\/ A-Frame\u306e\u30a8\u30f3\u30c6\u30a3\u30c6\u30a3\u306bVRM\u30e2\u30c7\u30eb\u3092\u8a2d\u5b9a<\/span><\/span>\n <\/span>AFRAME<\/span>.<\/span>registerComponent<\/span>(<\/span>"three-scene"<\/span>, {<\/span><\/span>\n <\/span>init<\/span>:<\/span> <\/span>function<\/span>() {<\/span><\/span>\n <\/span>\/\/ VRM\u30e2\u30c7\u30eb\u306e\u8aad\u307f\u8fbc\u307f<\/span><\/span>\n },<\/span><\/span>\n <\/span>tick<\/span>:<\/span> <\/span>function<\/span> (<\/span>time<\/span>, <\/span>timeDelta<\/span>) {<\/span><\/span>\n <\/span>\/\/ VRM\u30e2\u30c7\u30eb\u306e\u8868\u793a update<\/span><\/span>\n <\/span>\/\/ A-Frame\u306e\u30ec\u30f3\u30c0\u30e9\u30fc\u3092\u4f7f\u3063\u3066\u30ab\u30e1\u30e9\u6620\u50cf\u306e\u4e0a\u306bVRM\u30e2\u30c7\u30eb\u8868\u793a<\/span><\/span>\n }<\/span><\/span>\n });<\/span><\/span>\n <\/span><\/<\/span>script<\/span>><\/span><\/span>\n <\/span><\/<\/span>body<\/span>><\/span><\/span>\n<\/<\/span>html<\/span>><\/span><\/span><\/code><\/pre><\/div>\n\n\n\n\u3000<\/p>\n\n\n\n<\/span>\u30b0\u30ed\u30fc\u30d0\u30eb\u5909\u6570\u306e\u8a2d\u5b9a<\/span><\/h2>\n\n\n\nVRM\u30e2\u30c7\u30eb\u3092\u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3\u3055\u305b\u308b\u6642\u8a08\u3068A-Frame\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u95a2\u6570\u304b\u3089\u53c2\u7167\u51fa\u6765\u308b\u5909\u6570\u3092\u7528\u610f\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<\/circle><\/circle><\/circle><\/g><\/svg><\/span><\/path><\/path><\/svg><\/span>const<\/span> <\/span>clock<\/span> = <\/span>new<\/span> <\/span>THREE<\/span>.<\/span>Clock<\/span>();<\/span><\/span>\nclock<\/span>.<\/span>start<\/span>();<\/span><\/span>\nlet<\/span> <\/span>avatar<\/span> = <\/span>undefined<\/span>;<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n\u3000<\/p>\n\n\n\n<\/span>\u30b7\u30fc\u30f3\u306e\u4f5c\u6210\u3068VRM\u30e2\u30c7\u30eb\u306e\u8aad\u307f\u8fbc\u307f<\/span><\/h2>\n\n\n\n\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u306einit\u95a2\u6570\u5185\u3067\u5b9f\u65bd\u3055\u305b\u307e\u3059<\/p>\n\n\n\n<\/circle><\/circle><\/circle><\/g><\/svg><\/span><\/path><\/path><\/svg><\/span>init<\/span>: <\/span>function<\/span>
<\/p>\n\n\n\n
Table of Contents<\/p>\nToggle<\/span><\/path><\/svg><\/svg><\/span><\/span><\/span><\/a><\/span><\/div>\n\u30e9\u30a4\u30d6\u30e9\u30ea\u306e\u30d0\u30fc\u30b8\u30e7\u30f3<\/a><\/li>\u5b9f\u88c5\u30a4\u30e1\u30fc\u30b8<\/a><\/li>\u30b0\u30ed\u30fc\u30d0\u30eb\u5909\u6570\u306e\u8a2d\u5b9a<\/a><\/li>\u30b7\u30fc\u30f3\u306e\u4f5c\u6210\u3068VRM\u30e2\u30c7\u30eb\u306e\u8aad\u307f\u8fbc\u307f<\/a><\/li>\u30b7\u30fc\u30f3\u306e\u30ec\u30f3\u30c0\u30ea\u30f3\u30b0<\/a><\/li>\u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3\u95a2\u6570<\/a><\/li>\u30b3\u30fc\u30c9\u5168\u4f53<\/a><\/li><\/ul><\/nav><\/div>\n<\/span>\u30e9\u30a4\u30d6\u30e9\u30ea\u306e\u30d0\u30fc\u30b8\u30e7\u30f3<\/span><\/h2>\n\n\n\n\nA-Frame : 1.5.0<\/p>\n\n\n\nTree : r158<\/p>\n\n\n\nThree-VRM : 2.0.7<\/p>\n\n\n\ns-module-shims : 1.8.2<\/p>\n<\/blockquote>\n\n\n\n<\/span>\u5b9f\u88c5\u30a4\u30e1\u30fc\u30b8<\/span><\/h2>\n\n\n\n<\/circle><\/circle><\/circle><\/g><\/svg><\/span><\/path><\/path><\/svg><\/span>### \u5b9f\u88c5\u306e\u6982\u5ff5\u7684\u30a4\u30e1\u30fc\u30b8 ###<\/span><\/span>\n<\/span>\n<!<\/span>DOCTYPE<\/span> <\/span>html<\/span>><\/span><\/span>\n<<\/span>html<\/span> <\/span>lang<\/span>=<\/span>"jp"<\/span>><\/span><\/span>\n<\/span>\n <\/span><<\/span>head<\/span>><\/span><\/span>\n <\/span><!-- \u30e9\u30a4\u30d6\u30e9\u30ea\u306e\u8aad\u307f\u8fbc\u307f --><\/span><\/span>\n <\/span><\/<\/span>head<\/span>><\/span><\/span>\n<\/span>\n <\/span><<\/span>body<\/span>><\/span><\/span>\n <\/span><!-- a-frame\u306e\u8981\u7d20\u914d\u7f6e --><\/span><\/span>\n <\/span><<\/span>a-scene<\/span>><\/span><\/span>\n <\/span><<\/span>a-entity<\/span> <\/span>vrm<\/span>=<\/span>""<\/span>><\/<\/span>a-entity<\/span>><\/span><\/span>\n <\/span><\/<\/span>a-scene<\/span>><\/span><\/span>\n<\/span>\n <\/span><<\/span>script<\/span> <\/span>type<\/span>=<\/span>"module"<\/span>><\/span><\/span>\n <\/span>\/\/ VRM\u30e2\u30c7\u30eb\u306e\u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3\u95a2\u6570<\/span><\/span>\n <\/span>function<\/span> <\/span>vrmModelAnimate<\/span>() {}<\/span><\/span>\n <\/span><\/span>\n <\/span>\/\/ A-Frame\u306e\u30a8\u30f3\u30c6\u30a3\u30c6\u30a3\u306bVRM\u30e2\u30c7\u30eb\u3092\u8a2d\u5b9a<\/span><\/span>\n <\/span>AFRAME<\/span>.<\/span>registerComponent<\/span>(<\/span>"three-scene"<\/span>, {<\/span><\/span>\n <\/span>init<\/span>:<\/span> <\/span>function<\/span>() {<\/span><\/span>\n <\/span>\/\/ VRM\u30e2\u30c7\u30eb\u306e\u8aad\u307f\u8fbc\u307f<\/span><\/span>\n },<\/span><\/span>\n <\/span>tick<\/span>:<\/span> <\/span>function<\/span> (<\/span>time<\/span>, <\/span>timeDelta<\/span>) {<\/span><\/span>\n <\/span>\/\/ VRM\u30e2\u30c7\u30eb\u306e\u8868\u793a update<\/span><\/span>\n <\/span>\/\/ A-Frame\u306e\u30ec\u30f3\u30c0\u30e9\u30fc\u3092\u4f7f\u3063\u3066\u30ab\u30e1\u30e9\u6620\u50cf\u306e\u4e0a\u306bVRM\u30e2\u30c7\u30eb\u8868\u793a<\/span><\/span>\n }<\/span><\/span>\n });<\/span><\/span>\n <\/span><\/<\/span>script<\/span>><\/span><\/span>\n <\/span><\/<\/span>body<\/span>><\/span><\/span>\n<\/<\/span>html<\/span>><\/span><\/span><\/code><\/pre><\/div>\n\n\n\n\u3000<\/p>\n\n\n\n<\/span>\u30b0\u30ed\u30fc\u30d0\u30eb\u5909\u6570\u306e\u8a2d\u5b9a<\/span><\/h2>\n\n\n\nVRM\u30e2\u30c7\u30eb\u3092\u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3\u3055\u305b\u308b\u6642\u8a08\u3068A-Frame\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u95a2\u6570\u304b\u3089\u53c2\u7167\u51fa\u6765\u308b\u5909\u6570\u3092\u7528\u610f\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<\/circle><\/circle><\/circle><\/g><\/svg><\/span><\/path><\/path><\/svg><\/span>const<\/span> <\/span>clock<\/span> = <\/span>new<\/span> <\/span>THREE<\/span>.<\/span>Clock<\/span>();<\/span><\/span>\nclock<\/span>.<\/span>start<\/span>();<\/span><\/span>\nlet<\/span> <\/span>avatar<\/span> = <\/span>undefined<\/span>;<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n\u3000<\/p>\n\n\n\n<\/span>\u30b7\u30fc\u30f3\u306e\u4f5c\u6210\u3068VRM\u30e2\u30c7\u30eb\u306e\u8aad\u307f\u8fbc\u307f<\/span><\/h2>\n\n\n\n\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u306einit\u95a2\u6570\u5185\u3067\u5b9f\u65bd\u3055\u305b\u307e\u3059<\/p>\n\n\n\n<\/circle><\/circle><\/circle><\/g><\/svg><\/span><\/path><\/path><\/svg><\/span>init<\/span>: <\/span>function<\/span>
\nA-Frame : 1.5.0<\/p>\n\n\n\nTree : r158<\/p>\n\n\n\nThree-VRM : 2.0.7<\/p>\n\n\n\ns-module-shims : 1.8.2<\/p>\n<\/blockquote>\n\n\n\n<\/span>\u5b9f\u88c5\u30a4\u30e1\u30fc\u30b8<\/span><\/h2>\n\n\n\n<\/circle><\/circle><\/circle><\/g><\/svg><\/span><\/path><\/path><\/svg><\/span>### \u5b9f\u88c5\u306e\u6982\u5ff5\u7684\u30a4\u30e1\u30fc\u30b8 ###<\/span><\/span>\n<\/span>\n<!<\/span>DOCTYPE<\/span> <\/span>html<\/span>><\/span><\/span>\n<<\/span>html<\/span> <\/span>lang<\/span>=<\/span>"jp"<\/span>><\/span><\/span>\n<\/span>\n <\/span><<\/span>head<\/span>><\/span><\/span>\n <\/span><!-- \u30e9\u30a4\u30d6\u30e9\u30ea\u306e\u8aad\u307f\u8fbc\u307f --><\/span><\/span>\n <\/span><\/<\/span>head<\/span>><\/span><\/span>\n<\/span>\n <\/span><<\/span>body<\/span>><\/span><\/span>\n <\/span><!-- a-frame\u306e\u8981\u7d20\u914d\u7f6e --><\/span><\/span>\n <\/span><<\/span>a-scene<\/span>><\/span><\/span>\n <\/span><<\/span>a-entity<\/span> <\/span>vrm<\/span>=<\/span>""<\/span>><\/<\/span>a-entity<\/span>><\/span><\/span>\n <\/span><\/<\/span>a-scene<\/span>><\/span><\/span>\n<\/span>\n <\/span><<\/span>script<\/span> <\/span>type<\/span>=<\/span>"module"<\/span>><\/span><\/span>\n <\/span>\/\/ VRM\u30e2\u30c7\u30eb\u306e\u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3\u95a2\u6570<\/span><\/span>\n <\/span>function<\/span> <\/span>vrmModelAnimate<\/span>() {}<\/span><\/span>\n <\/span><\/span>\n <\/span>\/\/ A-Frame\u306e\u30a8\u30f3\u30c6\u30a3\u30c6\u30a3\u306bVRM\u30e2\u30c7\u30eb\u3092\u8a2d\u5b9a<\/span><\/span>\n <\/span>AFRAME<\/span>.<\/span>registerComponent<\/span>(<\/span>"three-scene"<\/span>, {<\/span><\/span>\n <\/span>init<\/span>:<\/span> <\/span>function<\/span>() {<\/span><\/span>\n <\/span>\/\/ VRM\u30e2\u30c7\u30eb\u306e\u8aad\u307f\u8fbc\u307f<\/span><\/span>\n },<\/span><\/span>\n <\/span>tick<\/span>:<\/span> <\/span>function<\/span> (<\/span>time<\/span>, <\/span>timeDelta<\/span>) {<\/span><\/span>\n <\/span>\/\/ VRM\u30e2\u30c7\u30eb\u306e\u8868\u793a update<\/span><\/span>\n <\/span>\/\/ A-Frame\u306e\u30ec\u30f3\u30c0\u30e9\u30fc\u3092\u4f7f\u3063\u3066\u30ab\u30e1\u30e9\u6620\u50cf\u306e\u4e0a\u306bVRM\u30e2\u30c7\u30eb\u8868\u793a<\/span><\/span>\n }<\/span><\/span>\n });<\/span><\/span>\n <\/span><\/<\/span>script<\/span>><\/span><\/span>\n <\/span><\/<\/span>body<\/span>><\/span><\/span>\n<\/<\/span>html<\/span>><\/span><\/span><\/code><\/pre><\/div>\n\n\n\n\u3000<\/p>\n\n\n\n<\/span>\u30b0\u30ed\u30fc\u30d0\u30eb\u5909\u6570\u306e\u8a2d\u5b9a<\/span><\/h2>\n\n\n\nVRM\u30e2\u30c7\u30eb\u3092\u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3\u3055\u305b\u308b\u6642\u8a08\u3068A-Frame\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u95a2\u6570\u304b\u3089\u53c2\u7167\u51fa\u6765\u308b\u5909\u6570\u3092\u7528\u610f\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<\/circle><\/circle><\/circle><\/g><\/svg><\/span><\/path><\/path><\/svg><\/span>const<\/span> <\/span>clock<\/span> = <\/span>new<\/span> <\/span>THREE<\/span>.<\/span>Clock<\/span>();<\/span><\/span>\nclock<\/span>.<\/span>start<\/span>();<\/span><\/span>\nlet<\/span> <\/span>avatar<\/span> = <\/span>undefined<\/span>;<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n\u3000<\/p>\n\n\n\n<\/span>\u30b7\u30fc\u30f3\u306e\u4f5c\u6210\u3068VRM\u30e2\u30c7\u30eb\u306e\u8aad\u307f\u8fbc\u307f<\/span><\/h2>\n\n\n\n\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u306einit\u95a2\u6570\u5185\u3067\u5b9f\u65bd\u3055\u305b\u307e\u3059<\/p>\n\n\n\n<\/circle><\/circle><\/circle><\/g><\/svg><\/span><\/path><\/path><\/svg><\/span>init<\/span>: <\/span>function<\/span>
A-Frame : 1.5.0<\/p>\n\n\n\n
Tree : r158<\/p>\n\n\n\n
Three-VRM : 2.0.7<\/p>\n\n\n\n
s-module-shims : 1.8.2<\/p>\n<\/blockquote>\n\n\n\n
### \u5b9f\u88c5\u306e\u6982\u5ff5\u7684\u30a4\u30e1\u30fc\u30b8 ###<\/span><\/span>\n<\/span>\n<!<\/span>DOCTYPE<\/span> <\/span>html<\/span>><\/span><\/span>\n<<\/span>html<\/span> <\/span>lang<\/span>=<\/span>"jp"<\/span>><\/span><\/span>\n<\/span>\n <\/span><<\/span>head<\/span>><\/span><\/span>\n <\/span><!-- \u30e9\u30a4\u30d6\u30e9\u30ea\u306e\u8aad\u307f\u8fbc\u307f --><\/span><\/span>\n <\/span><\/<\/span>head<\/span>><\/span><\/span>\n<\/span>\n <\/span><<\/span>body<\/span>><\/span><\/span>\n <\/span><!-- a-frame\u306e\u8981\u7d20\u914d\u7f6e --><\/span><\/span>\n <\/span><<\/span>a-scene<\/span>><\/span><\/span>\n <\/span><<\/span>a-entity<\/span> <\/span>vrm<\/span>=<\/span>""<\/span>><\/<\/span>a-entity<\/span>><\/span><\/span>\n <\/span><\/<\/span>a-scene<\/span>><\/span><\/span>\n<\/span>\n <\/span><<\/span>script<\/span> <\/span>type<\/span>=<\/span>"module"<\/span>><\/span><\/span>\n <\/span>\/\/ VRM\u30e2\u30c7\u30eb\u306e\u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3\u95a2\u6570<\/span><\/span>\n <\/span>function<\/span> <\/span>vrmModelAnimate<\/span>() {}<\/span><\/span>\n <\/span><\/span>\n <\/span>\/\/ A-Frame\u306e\u30a8\u30f3\u30c6\u30a3\u30c6\u30a3\u306bVRM\u30e2\u30c7\u30eb\u3092\u8a2d\u5b9a<\/span><\/span>\n <\/span>AFRAME<\/span>.<\/span>registerComponent<\/span>(<\/span>"three-scene"<\/span>, {<\/span><\/span>\n <\/span>init<\/span>:<\/span> <\/span>function<\/span>() {<\/span><\/span>\n <\/span>\/\/ VRM\u30e2\u30c7\u30eb\u306e\u8aad\u307f\u8fbc\u307f<\/span><\/span>\n },<\/span><\/span>\n <\/span>tick<\/span>:<\/span> <\/span>function<\/span> (<\/span>time<\/span>, <\/span>timeDelta<\/span>) {<\/span><\/span>\n <\/span>\/\/ VRM\u30e2\u30c7\u30eb\u306e\u8868\u793a update<\/span><\/span>\n <\/span>\/\/ A-Frame\u306e\u30ec\u30f3\u30c0\u30e9\u30fc\u3092\u4f7f\u3063\u3066\u30ab\u30e1\u30e9\u6620\u50cf\u306e\u4e0a\u306bVRM\u30e2\u30c7\u30eb\u8868\u793a<\/span><\/span>\n }<\/span><\/span>\n });<\/span><\/span>\n <\/span><\/<\/span>script<\/span>><\/span><\/span>\n <\/span><\/<\/span>body<\/span>><\/span><\/span>\n<\/<\/span>html<\/span>><\/span><\/span><\/code><\/pre><\/div>\n\n\n\n\u3000<\/p>\n\n\n\n<\/span>\u30b0\u30ed\u30fc\u30d0\u30eb\u5909\u6570\u306e\u8a2d\u5b9a<\/span><\/h2>\n\n\n\nVRM\u30e2\u30c7\u30eb\u3092\u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3\u3055\u305b\u308b\u6642\u8a08\u3068A-Frame\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u95a2\u6570\u304b\u3089\u53c2\u7167\u51fa\u6765\u308b\u5909\u6570\u3092\u7528\u610f\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<\/circle><\/circle><\/circle><\/g><\/svg><\/span><\/path><\/path><\/svg><\/span>const<\/span> <\/span>clock<\/span> = <\/span>new<\/span> <\/span>THREE<\/span>.<\/span>Clock<\/span>();<\/span><\/span>\nclock<\/span>.<\/span>start<\/span>();<\/span><\/span>\nlet<\/span> <\/span>avatar<\/span> = <\/span>undefined<\/span>;<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n\u3000<\/p>\n\n\n\n<\/span>\u30b7\u30fc\u30f3\u306e\u4f5c\u6210\u3068VRM\u30e2\u30c7\u30eb\u306e\u8aad\u307f\u8fbc\u307f<\/span><\/h2>\n\n\n\n\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u306einit\u95a2\u6570\u5185\u3067\u5b9f\u65bd\u3055\u305b\u307e\u3059<\/p>\n\n\n\n<\/circle><\/circle><\/circle><\/g><\/svg><\/span><\/path><\/path><\/svg><\/span>init<\/span>: <\/span>function<\/span>
\u3000<\/p>\n\n\n\n
VRM\u30e2\u30c7\u30eb\u3092\u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3\u3055\u305b\u308b\u6642\u8a08\u3068A-Frame\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u95a2\u6570\u304b\u3089\u53c2\u7167\u51fa\u6765\u308b\u5909\u6570\u3092\u7528\u610f\u3057\u307e\u3059\u3002<\/p>\n\n\n\n
const<\/span> <\/span>clock<\/span> = <\/span>new<\/span> <\/span>THREE<\/span>.<\/span>Clock<\/span>();<\/span><\/span>\nclock<\/span>.<\/span>start<\/span>();<\/span><\/span>\nlet<\/span> <\/span>avatar<\/span> = <\/span>undefined<\/span>;<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n\u3000<\/p>\n\n\n\n<\/span>\u30b7\u30fc\u30f3\u306e\u4f5c\u6210\u3068VRM\u30e2\u30c7\u30eb\u306e\u8aad\u307f\u8fbc\u307f<\/span><\/h2>\n\n\n\n\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u306einit\u95a2\u6570\u5185\u3067\u5b9f\u65bd\u3055\u305b\u307e\u3059<\/p>\n\n\n\n<\/circle><\/circle><\/circle><\/g><\/svg><\/span><\/path><\/path><\/svg><\/span>init<\/span>: <\/span>function<\/span>
\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u306einit\u95a2\u6570\u5185\u3067\u5b9f\u65bd\u3055\u305b\u307e\u3059<\/p>\n\n\n\n
init<\/span>: <\/span>function<\/span>