iOS: HTML5 с разработкой Three.js

Question

Я планирую разработать HTML5 с страницами Three.js, чтобы я мог легко создавать 3D-экраны с помощью этого и поддерживать мобильные платформы в кросс-платформенном методе. Я читал, что Three.js использует WebGL, но браузеры iOS и Android не поддерживают его, поэтому я не могу разработать такие комбинированные приложения.

Может кто-нибудь, пожалуйста, сообщите, могу ли я разработать HTML5 с страницами Three.js для достижения трехмерных взаимодействий в приложениях iOS и Android или нет в качестве веб-приложения? Если нет, сообщите мне официальные ссылки, где указано, что они не поддерживаются.

спасибо.

Answer 1

Three.js отлично работает без WebGL. Вы можете использовать средство рендеринга Canvas - это описано в документации Three.js, я уверен, что вы можете найти его на github, используя Google или даже Bing. Это не так быстро, как использование WebGL, но никто не участвует в гонках в Монте-Карло в Nissan Sentra.

Вы не должны ожидать высокой производительности 3D на любой мобильной платформе - в основном, потому что производительность javascript может быть оцепляюще медленной. Попытайтесь получить доступ к некоторым из примеров Three.js, используя мобильные устройства (как с webgl, так и без них), чтобы получить представление о производительности.

Answer 2

Я попытался запустить демонстрации на холсте Three.js на моем iPad Air, и это было ужасно. Обычно Safari падает, и даже если рендер работает, он выполняет 2-3 кадра в секунду. Так что кажется, что на устройствах iOS сейчас очень грубо

Answer 3

«но браузеры iOS и Android не поддерживают его» Я могу использовать Three.js и его демоверсии webgl на Android-браузере, начиная с версии 2.3.7. до 4.3+. Ваш аргумент недействителен: P

Answer 4

Поддержка браузера iOS и Android, а также веб-браузер, иногда вы можете уменьшить эффекты рендеринга, чтобы заставить его работать. Обычно это происходит. Для приложения скорость рендеринга в андроиде невелика. У Иоса лучше.

И вы можете подключить к нему какое-то средство рендеринга, такое как XWalkView, вот мой post, как использовать его для рендеринга 3D-моделей с трёхмерными в моем приложении android4.2.0. Для IOS существуют также релевантные решения.

Answer 5

iOS Safari и Android Chrome поддерживали WebGL уже несколько лет.

Проблема, о которой вы можете иметь в виду, - это веб-интерфейс Android или IOS UIWebView (элемент управления, который вы можете добавить в собственное приложение для отображения веб-страницы) может поддерживать или не поддерживать WebGL. WebGL is supported in WebViews as of Android 5.0 apparently, хотя у людей есть run into issues

Другой вариант - использовать что-то вроде CocoonJS. По-видимому, они предоставляют custom webview implementations для Android 4.0+ и iOS 8+.

Что касается производительности, то три .js будут выполнять только штрафы на простых сценах с мобильным телефоном. Есть много примеров. 3D на мобильном телефоне в целом, хотя требует оптимизированных активов (модели с меньшим количеством полигонов, меньшие текстуры, более простые шейдеры, меньше света и т. Д.) По сравнению с настольными компьютерами, и особенно с тэгами. Js

Answer 6

Выбранный ответ на этот вопрос рекомендует использовать Three.js CanvasRenderer, но, как показано here в документации three.js, CanvasRenderer устарела:

ПРИМЕЧАНИЕ: Холст визуализатор устарела и больше не часть ядра three.js ,

Важно отметить, что он все еще может быть использован для простых 3D-сцен и могут быть найдены на Github here

WebGL поддерживается в андроиды WebView V36 и выше, как видно here. В качестве альтернативы с более старым Android Chrome браузеры WebGL может быть разрешен путем ввода: chrome://flags в браузер и выбрав Включить ссылки, которая появляется под Включить WebGL заголовка в окне браузера, или путем обновления WebView из Android Google Play Store.

WebGL был поддержан на Mobile Safari с iOS 8.0b.

В mobilehtml5.org вы можете увидеть, что версии для мобильных устройств поддерживают определенные функции HTML5:

Sony Xperia Android 2.3 также поддерживает WebGL.