Three.js - 无法在 Mapbox GL JS 自定义 WebGL 层上渲染立方体

Question

我正在尝试使用此示例渲染多维数据集：添加 3D model 。

three.js 上的示例工作高达 117 个版本。 由于 118 版本示例不起作用：页面刷新后立方体立即消失。 我研究了变更日志，最明显的变化是从 v118 开始 three.js 使用 WebGL2 作为默认渲染引擎。 所以我更改了代码以使用 WebGL1，但立方体仍然消失了。

  this.renderer = new THREE.WebGL1Renderer({
  canvas: map.getCanvas(),
  context: gl,
  antialias: true
});

这是重现问题的codepen 。 （重新加载页面以查看立方体片刻）

Answer 1

我遇到了同样的问题，但是通过将render() function 中的renderer.state.reset() renderer.resetState()替换为在 r124 中引入并在 r126 中改进的 renderer.resetState() 解决了这个问题。

Mapbox 示例也已更新。