Изучаем WebGL: июля 2010

Первым шагом к WebGL является браузер, который поддерживает эту технологию; WebGL поддерживается в бета версиях всех основных браузерав, кроме Internet Explorer, так что первым делом нужно раздобыть подходящую версию браузера для вашего компьютера. Webgl браузер доступен для следующих операционных систем:

Windows:

Если у вас достаточно свежая ATI или Nvidia видеокарта, проблем не должно быть. Пробуем установить Firefox или Chromium, как вам будет угодно, - если возникают проблемы посмотрите эти пару советов.
Если у вас графический чипсет от Intel (часто бывает в ноутбуках), то готовьтесь к проблемам. Видео драйверы от Intel поддерживают OpenGL не полностью, а сейчас поддержка WebGL в браузерах обеспечивается силами OpenGL. Все же стоит попробовать инструкции для установки Firefox или Chromium, но вполне вероятно, что они не будут работать. Если не получится, можно попробовать особую версию Firefox с функцией программного рендеринга (3D-графика просчитывается на CPU, вместо GPU видеокарты). Это будет медленнее, но по крайней мере вы сможете попробовать какую то часть WebGL контента!

Macintosh: если вы работаете в Snow Leopard (OS X 10.6), все должно быть прекрасно, я рекомендую использовать бета версию WebKit, который будет работать в качестве альтернативной версии Safari. Если вы работаете в Leopard (OS X 10.5), то вы не сможете использовать эту версию WebKit, но вы можете использовать как Firefox так и Chromium. Пользователи Snow Leopard конечно, тоже могут использовать Firefox или Chromium. Если у вас старая версия OS X, к сожалению, я не знаю ни одного WebGL браузера который вы сможете использовать прямо сейчас :-(

Linux: ситуация в значительной степени такая же, как с Windows:

Если у вас ATI или Nvidia видеокарта, а также последние версии драйверов, то все должно работать нормально как в Firefox так и в Chromium (по состоянию на 22 июня 2010 я слышал о проблемах с Firefox WebGL в 64-битных Linux, так что Chromium может быть вашим лучшим вариантом).
Если видеокарта от Intel, как и пользователям Windows вам, вероятно, придется использовать медленный программный рендеринг, попробуйте Firefox илиChromium , но они, вероятно, не будет работать с настройками по умолчанию. Но ситуация лучше, чем у Windows пользователей, - нужно убедиться, что Mesa установлен (лучше всего установить последнюю версию с помощью менеджера пакетов вашего дистрибутива), а затем вы сможете использовать Mesa версию Firefox.

Firefox

Бета версия Firefox известна под кодовым именем Minefield. Он обновляется каждую ночь, и уже вполне стабилен. Он может быть установлен рядом с основной версией Firefox, так что в случае чего можно его без проблем удалить и продолжить работать в привычном Firefox.

Чтобы получить Minefield:

Перейдите на страницу nightly builds и скачайте подходящую версию для вашего компьютера.
Установите его (предварительно закрыв все запущенные окна Firefox).
Запустите Minefield.
Перейдите на страницу "about:config"
Фильтруем по "webgl"
Ставим значение "webgl.enabled_for_all_sites" в "true".

(Спасибо Владимиру Вукичевичу за эту информацию)
Далее, нажмите здесь, чтобы попробовать WebGL.

Запуск Minefield с программным рендером в Windows

Если ваше графическое оборудование не поддерживает OpenGL 2.0, то сейчас единственный способ получить работающий на вашей машине WebGL это использование библиотеки под названием Mesa. Mesa попросту программно эмулирует видеокарту, так что это немного медленно, - но это лучше, чем ничего! Как запустить это на Windows:

Скачать эту версию Minefield.
Установите его (предварительно закрыв все запущенные окна Firefox).
Скачать эту версию библиотеки Меsа, любезно предоставленную Владимиром Вукичевичем
Разархивируйте zip архив Меsа; он содержит один DLL файл, называемый OSMESA32.DLL,его вы должны положить куда-нибудь на вашей машине.
Запустите Minefield.
Перейдите на страницу "about:config"
Фильтруем по "webgl"
Ставим значение "webgl.enabled_for_all_sites" в "true".
Настраиваем поле "webgl.osmesalib" чтобы оно указывало на OSMESA32.DLL. Например, если вы извлекали его в "C:\Temp", установите "webgl.osmesalib" в "C:\Temp\osmesa32.dll"
Ставим значение "webgl.software_rendering" в "true".

(Еще раз спасибо Владимиру Вукичевичу за информацию)
На этом всё. Нажмите здесь, чтобы попробовать WebGL.

Запуск Minefield с программным рендером на Linux

Если ваше графическое оборудование не поддерживает OpenGL 2.0, то сейчас единственный способ получить рабочий на вашей машине WebGL - использование библиотеки под названием Mesa. Mesa попросту программно эмулирует видеокарту, так что это немного медленно, - но это лучше, чем ничего! Вот как можно его установить.

Скачайте последнюю версию Minefield.
Установите его (предварительно закрыв все запущенные окна Firefox).
С помощью менеджера пакетов вашего дистрибутива Linux убедитесь, что Mesa установлена и обновлена до последней версии.
Запускайте Minefield.
Перейдите на страницу "about:config"
Фильтруем по "webgl"
Ставим значение "webgl.enabled_for_all_sites" в "true".
Ставим значение "webgl.software_rendering" в "true".
В опции "webgl.osmesalib" указываем путь к вашей OSMesa shared library (обычно что-то вроде /usr/lib/libOSMesa.so).

На этом всё. Нажмите здесь, чтобы попробовать WebGL.

Safari

Помните, Safari поддерживает WebGL только на Маках с Snow Leopard (OS X 10.6), если вы используете Leopard (10.5), Windows или Linux, то вы должны будете использовать Firefox или Chromium. (Если вы используете старую версию OS/X, я не знаю ни одного браузера с поддержкой WebGL :-()
Если вы используете Snow Leopard, вам необходимо:

Убедится, что вы используете, по крайней мере 4 версию Safari.
Скачайте и установите WebKit nightly build.
Запуcтите терминал, и в нем команду:
defaults write com.apple.Safari WebKitWebGLEnabled -bool YES
Запустите только что установленный WebKit.

(Спасибо Крису Маррину за информацию)
Далее, нажмите здесь, чтобы попробовать WebGL .

Chromium

Разработчики Chrome в настоящее время рекомендуют использовать ночные сборки Chromium`а. Chromium - это браузер с открытым исходным кодом на котором основан Chrome. Процедура несколько отличается для каждой поддерживаемой операционной системы, здесь приведены инструкции для Windows , Macintosh и Linux . (Предупреждение - я пробовал только версии Windows, но говорят другие версии тоже работают хорошо.

Для Windows

Перейдите на эту страницу и скачайте chrome-win32.zip
Распакуйте файл куда удобно.
Откройте окно командной строки и перейдите в chrome-win32 каталог, который вы распаковали.
Убедитесь, что все окна Chrome закрыты
Выполните следующую команду:
chrome.exe --enable-webgl

Для Macintosh

Перейти на эту страницу и скачайте chrome-mac.zip
Распакуйте файл куда удобно.
Откройте окно терминала и перейдите в chrome-mac каталог, который вы распаковали.
Убедитесь, что все окна Chrome закрыты
Выполните следующую команду:
./Chromium.app/Contents/MacOS/Chromium --enable-webgl

Для Linux

Если вы используете 32-разрядный Linux, перейдите на эту страницу и скачайте chrome-linux.zip. Если вы хотите 64-разрядную версию, вы можете перейти на эту страницу, скрольте до упора вниз, чтобы найти самый свежий каталог, перейдите в него, и скачайте chrome-linux.zip оттуда.

Распакуйте файл куда удобно, и перейдите в chrome-linux каталог.
Убедитесь, что все окна Chrome закрыты
Выполните следующую команду:
./chromium --enable-webgl

(Спасибо Мохамеду Мансуру за информацию)
Далее, нажмите здесь, чтобы попробовать WebGL .

Некоторые примеры WebGL

Как только ваш браузер будет установлен, вы сможете видеть WebGL контент. Посмотрим на второй WebGL урок. Вы должны увидеть красно-зелено-синий треугольник, и голубой квадрат. Если вы не видите квадрат и треугольник, почитайте руководство по устранению неполадок ниже.
Если все-таки работает, то всё отлично! Вот несколько интересных страниц с WebGL контентом:

От Мерфи, вращающаяся сфера с шахматной доской (сейчас не работает в Chromium`е, к сожалению).
Еще демо: Кубы Мандельброта.
От Google: блестящий чайник (кликните и перетащите что бы по-вращать его), "Сан-Анджелес", Particle Effects
От Ilmari Heikkinen, спираль вращающихся кубов и программа для рисования.
От Pl4n3, забавный прешелец...
... Или что-то походящее на игру с значительно менее дружелюмными пришельцами
Copperlicht это высокоуровневая библиотека построенная поверх WebGL, и это их порт Quake уровня
Реальный пример использования WebGL: ChemDoodle 3D рисует молекулы на веб-страницах.
Jacob Seidelin, 2 демонстрации - музыкальная Солнечная система (warning: техно-саундтрек) и Миры WebGL (последний не работает в Minefield в данный момент, к сожалению).
Несколько портов демо-сцены на WebGL: первый, второй , третий и четвёртый (последнему нужно несколько секунд чтобы загрузится - но оно того стоит!).

Если вы хотите двигаться дальше и узнать о том, как создать свою собственную WebGL страницу, читайте первый урок по WebGL.
Урок 1>>

Решаем проблемы

Для Windows и Linux пользователей: самая распространенная причина, по которой WebGL не работает - проблемы с графическими драйверами. Все текущие реализации WebGL основаны на OpenGL (ожидается, что это изменение в будущем), а поддержка OpenGL обеспечивается поставщиком графического драйвера. Для WebGL необходимо наличие как минимум OpenGL 2.0 для запуска; проблемы с видеокартами Intel существуют от того, что Intel не обеспечил поддержку OpenGL в драйверах для большинства своих графических устройств.
Если у вас ATI или Nvidia видеокарта, первое, что нужно сделать, это проверить версию OpenGL на вашем компьютере. Для Windows, это можно сделать с помощью GLview. На Linux, нужно выполнить команду glxinfo и найти строку с заголовком "OpenGL version string". Если номер версии меньше, чем 2.0, вам необходимо обновить драйвер.
Если после обновления вы всё еще испытываете проблемы - есть вероятность что подходящий OpenGL не доступен для вашей видеокарты или операционной системы. Возможно имеет смысл попробовать программный рендер. Вот инструкции для Windows и для Linux.

Урок 1>>

Оригинал на английском языке: http://learningwebgl.com/blog/?p=11

Изучаем WebGL

суббота, 3 июля 2010 г.

Урок 0: Приступая к работе