4

立方体の上に CircleGeometry をレンダリングしようとしています (カメラの視点から、両方を示しています)。立方体は単色で、円は円弧だけで背景色のないキャンバスになっています。

  • Canvasrenderer を使用すると、キャンバスの透明度は問題なく、アークは印刷されます。
  • WebGL レンダラーを使用すると、完全な円がページの背景色で塗りつぶされ、円弧だけが表示されるため、透明度が失われます。

このためのテストを作成します: http://jsfiddle.net/f4u7s/6/ ここで、WebGL と CanvasRendering を切り替えて問題を表示できます。（探す

// ------------> Switch HERE
    //renderer = new THREE.CanvasRenderer();
    renderer = new THREE.WebGLRenderer();

)

CanvasRenderer で動作する three.js テクスチャに似ていますが、提案された解決策 (mesh.dynamic = true) を使用しても、WebGLRenderer チケットでは黒く表示されますが、問題はまだここにあります。

何か不足していますか？

4

1 に答える 1

12

transparentに設定する必要がありますtrue。

plane = new THREE.Mesh(
    new THREE.CircleGeometry(50, 50),
    new THREE.MeshBasicMaterial({
        map: texture,
        transparent: true
    })
);

更新されたフィドル: http://jsfiddle.net/f4u7s/10/

于 2012-11-13T13:55:52.490 に答える