是否可以从Blink公开WebGL上下文？

Question

我想做与https://www.mapbox.com/blog/mapbox-unity/相同的事情，但在XWalk视图中使用three.js。

简而言之，据我所知，mapbox插件是一个控制器，它可以访问Mapbox视图的OpenGL上下文和统一视图的OpenGL上下文。然后插件在统一OpenGL上下文中对地图的纹理进行渲染。

在我的例子中，我使用的不是统一，而是Three.js。我看到了一种通过将OpenGL上下文从WebGL共享到另一个活动的OpenGL上下文来实现这一点的方法。它需要：

• 通过Blink和OpenGL之前的绑定从webGL公开一个XWalk上下文
• 使用XWalk Java扩展将纹理缓冲区从OpenGL上下文共享到另一个活动。

重要注释：

• 目标平台: iOS，Android (因为MapboxGL不支持MapboxGL(使用D3D) )，保护将阻止运行在Windows等D3D平台上。
• mapboxGL不是一个选项，因为我需要离线地图和其他纯功能。

Answer 1

仅仅因为OpenGL可能在其他API(即D3D)上工作，就无法从WebGL one获取WebGL上下文。但是，要在Three.js上实现类似的功能，可以使用mapbox。只需将地图呈现到屏幕外的画布(未添加到DOM中)，并将其用作Three.js场景中平面的纹理。

大致上，它可能看起来有点像这样：

const map = new Map({ /* options */ });
const texture = new THREE.CanvasTexture(map.getCanvas(), /* ... */);

map.on('render', () => {
    requestAnimationFrame(render);
    texture.needsUpdate = true;
});

function render() {
    myThreejsRenderer.render(mySceneWhichUsesTexture, camera);
}