結合A幀與Three.js

是否有可能將Three.js元素添加到A幀場景？假設一個幀被在three.js所建，並

three Version: ^0.74.0

登錄到您的控制檯它不應該是一個奇怪的事情嗎？

我想這個代碼到我的一幀場景元素：

let scene = document.getElementsByTagName('a-scene'); 
console.log(scene); 

var sphereMaterial = new THREE.MeshLambertMaterial({ }); 
var sphere = new THREE.Mesh(new THREE.SphereGeometry(15, 10, 10), sphereMaterial); 
    sphere.position.set(150, 20, -170); 
    scene.add(sphere);

但它不工作，因爲場景的對象可是沒有一個附加功能..也許是因爲A型架的場景是不是一個實例一個正常的WebGLRenderer？

有沒有人有這方面的經驗？這將非常棒！

來源

2016-06-29 Fabian Tjoe A On

A-Frame構建於three.js之上，並公開所有底層功能。

<a-scene> .object3D使您可以訪問THREE.Scene。

每個<a-entity>有一個object3D這是一個組。您使用getObject3D(name)和getOrCreateObject3D(name, constructor向羣組添加內容。

要在A框架框架中添加three.js元素，請使用A框架提供的實體組件系統。

AFRAME.registerComponent('mythreejsthing', { 
    schema: { 
    // ... Define schema to pass properties from DOM to this component 
    }, 

    init: function() { 
    var el = this.el; // Entity. 
    var mythreejsobject = // ... Create three.js object. 
    el.setObject3D('mesh', mythreejsobject); 
    } 
});

https://aframe.io/docs/0.2.0/core/entity.html#object3d https://aframe.io/docs/0.2.0/core/component.html

來源

2016-07-13 18:00:41 ngokevin

很清楚的，感謝凱文 –

你能不能給我的模式括號內所發生的例子嗎？我試過這個，我沒有看到我的Three.JS對象 –

這將是一個最小的例子，然後，基於Kevins的答案。 http://codepen.io/dirkk0/pen/YpNrQR – dirkk0

結合A幀與Three.js

回答

相關問題