Можно ли открыть контекст WebGL из Blink?

Я хотел бы сделать то же самое, что и https://www.mapbox.com/blog/mapbox-unity/, но с файлом three.js в представлении XWalk.

Короче говоря, как я понимаю, плагин mapbox — это контроллер, который имеет доступ к контексту OpenGL представления Mapbox и к контексту OpenGL представления Unity. Затем плагин выполняет рендеринг текстуры карты в контексте Unity OpenGL.

В моем случае я использую не Unity, а Three.js. Я вижу способ сделать это, поделившись контекстом OpenGL из WebGL с другим контекстом OpenGL из другого действия. Это необходимо:

  • предоставить контекст OpenGL из webGL через привязку между Blink и XWalk
  • используйте расширение XWalk Java для совместного использования буфера текстуры из контекста OpenGL с другим действием.

Важные примечания:

  • целевые платформы: iOS, Android (Поскольку MapboxGL не поддерживает Windows (с использованием D3D), защита не позволит работать на платформе D3D, такой как Windows phone.)
  • mapboxGL-JS не подходит, так как мне нужна автономная карта и другие нативные функции.

webgl opengl blink xwalkview
person dagatsoin    schedule 15.12.2016    source источник
comment
Я сомневаюсь, что есть какой-либо способ сделать это. Тем не менее, mapbox предоставляет хорошо функционирующий рендерер webgl. Он с открытым исходным кодом и может быть модифицирован для рендеринга карт на текстуру/FBO. Так что вы можете использовать эту текстуру в threejs или где-то еще.   -  person pleup    schedule 16.12.2016
comment
Хороший вопрос, но мне нужно использовать его в автономном режиме, поэтому я не могу использовать версию JS.   -  person dagatsoin    schedule 16.12.2016

Ответы (1)


arrow_upward
2
arrow_downward

Невозможно получить контекст OpenGL из контекста WebGL просто потому, что WebGL может работать с другими API (например, D3D). Однако для достижения аналогичного результата с Three.js вы можете использовать mapbox-gl-js. Просто визуализируйте карту на закадровом холсте (не добавленном в 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);
}
person Kirill Dmitrenko    schedule 31.01.2017
comment
Спасибо за ваш ответ, но mapbox gl-js не вариант. Мне нужна встроенная функция, такая как автономные карты. Я отредактировал свой вопрос об этом. (и про D3D тоже) - person dagatsoin; 31.01.2017