ExtJS Panel中的Three.js场景

Question

我没有设法在ExtJS面板中渲染一个Three.js场景。 有没有人知道这个的演示代码？

Answer 1

我想到了这一点，所以我将回答我自己的问题，因为这可能有助于其他人。

将ExtJS面板定义如下：

xtype : 'panel',
id : '3dviewer',
region : 'center',
layout : 'fit'

这样的Three.js WebGL渲染器：

renderer = new THREE.WebGLRenderer({
    antialias : true
});
renderer.setSize(width, height);

可以将渲染器dom元素添加到面板中，如下所示：

Ext.getCmp('3dviewer').body.appendChild(renderer.domElement);