Question

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

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

renderer.localClippingEnabled = true;

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

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

core：schema：warn组件/系统localClippingEnabled的未知属性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。

根据我在THREEjs示例中看到的内容，引用始终来自新构造的渲染器。因此，我尝试了这一点，并且在控制台中看起来不错，在控制台中使用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小提琴中检查一下。

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

1 个答案: