我如何访问（在 Aframe 中）webGLRenderer.localClippingEnabled？

Question

我正在尝试在 AFrame 中创建局部裁剪平面，本质上是这种效果 https://threejs.org/examples/#webgl_clipping_intersection

要启用裁剪，您必须引用渲染器，并启用 localClippingEnabled，如下所示：

renderer.localClippingEnabled = true;

在 AFrame 中，webGLRenderer 通过组件渲染器公开，但不支持 localClippingEnabled 属性。即

<a-scene renderer="localClippingEnabled:true">

core:schema:warn Unknown 属性 localClippingEnabled for component/system undefined。

    AFRAME.registerComponent('matclipplane', {
      schema:{
        clipHeight:{type: 'number', default: 1}
      },
      init: function () {
        let el = this.el;
        let self = this;
        self.scene = el.sceneEl.object3D;
        let renderer = THREE.WebGLRenderer; // How to refernence the renderer?
        renderer.localClippingEnabled = true;

我试过在自定义组件中引用它，就像这样

   let renderer = THREE.WebGLRenderer;
   renderer.localClippingEnabled = true;

但它似乎不起作用。我不相信这是对 WebGLRenderer 的正确引用，因为在控制台中记录它不会显示属性 localClippingEnabled。

从我在三个示例中看到的情况来看，引用总是来自新建的渲染器。所以我尝试了，在控制台中，它看起来正确，在控制台中使用 localClippingEnable=true，但仍然不起作用，因为（我不认为）这个新的渲染器正在进行渲染。我怎样才能完成这项工作？

这是我正在处理的小故障。 https://glitch.com/~clipping-plane

Answer 1

根据docs，您可以将渲染器对象作为场景访问属性 (sceneEl.renderer)。

例如：

AFRAME.registerComponent('foo', {
   init: function() {
      console.log(this.el.sceneEl.renderer.localClippingEnabled)
      this.el.sceneEl.renderer.localClippingEnabled = true
   }
})

在 this fiddle 中查看。

我如何访问（在 Aframe 中）webGLRenderer.localClippingEnabled？

How do I access (in Aframe) webGLRenderer.localClippingEnabled?

aframe