javascript - ExtJS 面板中的 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);