среда, 21 сентября 2011 г.

Получение Flash-панорамы на примере Vue - сцены


Доброго времени суток друзья.
Предлагаю Вашему вниманию реализацию 3D сцены во флеш файле, которую можно покрутить мышкой, как бы стоя на месте рассматривать по сторонам. Попробуйте покрутить следующую панораму.







За основу берется сцена программы Vue-extreme. Отличная программа по созданию природных ландшафтов, атмосферы и экосистемы. Курс по программе я преподаю на лекциях, приходите :) .
Вы также можете взять любую программу 3D моделирования, в которой можно рендерить и настраивать камеры, будь то 3DMax, Maya и т.д.

Итак начнем!!

Подготовка материала для создания панорамы.

1. В программе Vue переименуйте камеру Main camera в имя "0" на панели объектов.
2. Перейдите в настройки камеры и укажите пропорции визуализации Sqare (1:1). RMB на самере, в контекстном меню выбрать Edit Object.
3. Укажите угол обзора камеры по горизонтали и вертикали 90 грд.


4. Нажмите на кнопку сохранить камеру на панели Preview render, и создастся новая камера. Назовите ее следующим порядковым номером. Дубликат камеры несет в себе настройки дублируемой.
5. Выставьте 6 камер в порядке как на рисунке, пользуясь трансформацией и панелью Orientation. Камеры должны располагаться перпендикулярно друг другу.



6. Привяжите все камеры к нулевой. Выделяем камеру и на панели анимации справа вверху Link to "0".



7. В дальнейшем не трогайте все камеры, кроме нулевой.
8. Выставлять ракурс не обязательно, т.к. панорама возьмёт на себя все стороны. Достаточно выставить нулевую камеру в нужную Вам позицию в сцене.
9. Рендерим каждую камеру и сохраняем в одну папку.

Создание панорамы, используя программу Pano2QTVR

Для создания панорамы у вас должны быть 6 квадратных рисунков.

Забираем Pano2QTVR и ставим.
После запуска программы Pano2QTVR мы получаем окно


1. Нажимаем кнопку «Создать новый проект». Указываем путь, где будет располагаться наш файл проекта.
2. Переходим в вкладку Project
a. Указываем тип проекта Кубическая
b. Указываем путь к шести нашим файлам с правильным названием в нумерации.
c. Выбираем в пункте Output format - Flash


Правило наименования файлов для кубической модели.


У нас должны быть названия, начиная нумерацию с нуля.
Image_0_0.jpg
Image_0_1.jpg
Image_0_2.jpg
Image_0_3.jpg
Image_0_4.jpg
Image_0_5.jpg

3. Заходим вкладку конфигурация.
a. Указываем размер квадрата-сегмента, на экспорте в flash файла
b. Указываем размер начального окна Flash-документа. (после можно изменять размер окна стандартными методами)


4. Можно создать активные зоны. С помощью их можно создать кнопки на панораме. Например, дверь в интерьере будет подгружать другой флеш-файл с панорамой комнаты за дверью. Выбираем вкладку Активные зоны.
a. Соглашаемся с разрешением активных зон.
b. Выбираем одну из 6 сторон куба (можно на нескольких картинках указывать активные зоны)
c. Выбираем инструмент выделения и мышкой кликаем по рисунку пока не замкнем зону красного цвета
d. Указываем заголовок, который будет высвечиваться во время просмотра панорамы
e. Указываем путь URL к файлу, который будет вызываться при нажатии на зону. Это может быть другая панорама, документ или сайт в интернете и т.д.


После создания активных зон, программа создаст png-файлы, несущие информацию об активных областях. Не потеряйте их и не удаляйте.
5. Выбираем в низу Output format: Flash
6. Нажимаем кнопку Create, после процесса сборки, программа выдаст файл панорамы.
6. Появится консольная страничка, где ведется информация о сборке флеш-файла. Если в строке написана будет ошибка, значит Вам придется разобраться. Ошибки бывают от неправильного названия имени картинок, не верных линков.
Если все удачно получилось то вы увидите результат.











Чтобы разместить флешку у себя на сайте надо в HTML ввести:




<img src="http://img2.blogblog.com/img/video_object.png" style="background-color: #b2b2b2; height: 266px; width: 600px; " class="BLOGGER-object-element tr_noresize tr_placeholder" id="BLOGGER_object_6" data-original-id="BLOGGER_object_6" />
Надеюсь урок вам пригодиться, если будут вопросы обязательно пишите!!!

4 комментария:

Светлана Узких комментирует...

супер! Спасибо за такой подробный урок!

Maxym Tanygyn комментирует...

Всегда пожалуйста!!!

Анонимный комментирует...

Спасибо большое! С наступающим!)

Maxym Tanygyn комментирует...

Вот ссылка на прогу https://sites.google.com/site/mnexusmaterials/goods-1/Pano2QTVR.v1.6.3.rar

Отправить комментарий

Контакты: gmail mnexuss@gmail.com | ICQ 201882385 | Add me to Skype