Вопрос - ответ
30 января 2016 01:36
30 января 2016 10:21
Плеер - это простое приложение для просмотра сцены. Далее буду называть его webplayer. Он используется при экспорте из Blender в html формат. Так же через него можно просматривать экспортнутые в .json сцены.
Поскольку это приложение, то его можно написать. Пример этого есть у нас на сайте. Вот ссылочка.
Этот урок есть в SDK по адресу SDK/deploy/tutorials/examples/interactive_web_application
Вы можете просто взять и изменить код этого урока на тот, который нужен вам. Вам нужно будет переопределить функцию main_canvas_click. Это обработчик события клика по канвасу (клик мышкой или тач на мобильном устройстве).
У вас она будет иметь примерный вид:
Поскольку это приложение, то его можно написать. Пример этого есть у нас на сайте. Вот ссылочка.
Этот урок есть в SDK по адресу SDK/deploy/tutorials/examples/interactive_web_application
Вы можете просто взять и изменить код этого урока на тот, который нужен вам. Вам нужно будет переопределить функцию main_canvas_click. Это обработчик события клика по канвасу (клик мышкой или тач на мобильном устройстве).
У вас она будет иметь примерный вид:
function main_canvas_click(e) {
if (e.preventDefault)
e.preventDefault();
var x = e.clientX;
var y = e.clientY;
var obj = m_scenes.pick_object(x, y);
if (obj && m_scenes.get_object_name(obj) == "NAME_FROM_BLENDER")
window.open("lalalalalalalalala"); //поместите тут адрес нужной страницы
}
30 января 2016 12:57
От себя добавлю, что это если канвас находится в нуле, то есть в верхнем левом углу и размеры его не меняются. Если нет, то надо координаты немного по-другому определять
в m_app.init({ добавить
в функции определение координат будет иметь вид
var m_cont = require("container");
в m_app.init({ добавить
track_container_position: true, //пересчитывать позицию Canvas’а
в функции определение координат будет иметь вид
function main_canvas_click(e) {
if (e.preventDefault)
e.preventDefault();
var x = e.clientX;
var y = e.clientY;
var canvas_xy = m_cont.client_to_canvas_coords(x, y, _vec2_tmp);
//console.log("x=" + _vec2_tmp[0] + " " + "y=" + _vec2_tmp[1]);
var objPicked = m_scenes.pick_object(_vec2_tmp[0], _vec2_tmp[1]);
Дорогу осилит идущий
30 января 2016 15:07
Ответ на сообщение пользователя Семенцов РоманПочитав о тачах, выяснил что в массиве event.touches находятся координаты всех касаний на экране. А в массиве event.targetTouches находятся касания к текущему DOM элементу.
С мультитачем надо быть аккуратным, не все мобильные девайсы его поддерживают. Лучше добавить небольшую проверку на его наличие.
В примере я не учел использование мультитача, у меня перед глазами в этот момент стояло приложение-раннер от третьего лица. Вообще для использования мультитача надо обрабатывать массив с координатами нажатий (event.touches) и смотреть, какое из них должно поворачивать камеру.
Посмотрел в /src/addons/mouse.js функции get_coords_x, get_coords_y возвращаются координаты первого касания из общего массива event.touches. Заменив это на event.targetTouches я получил "псевдо мультитач", так как элементы управления не являются детьми канваса (в моём случае), то b4w теперь обрабатывает только касания по канвасу.
Чуть модифицировал аддон mouse.js, добавил пару методов.
![winking](/static/pybb/emoticons/winking.png)
И уже по традиции видео работы
![smiling-sunglasses](/static/pybb/emoticons/smiling-sunglasses.png)
Не стой, где попало… Попадет еще раз.
http://naviris.ru/
http://naviris.ru/
31 января 2016 07:14
Обоими способами пробовала, никак… видимо не судьба, буду ждать обнову х)
Все равно, спасибо! :)![smiling]()
![smiling]()
![smiling-face-smiling-eyes]()
Если можно, еще один вопрос, пожалуйста… Когда экспортирую только .json и .bin, то где можно поменять css border-radius или другим способом закруглить углы?
Через .html все отображалось (задавала радиус границы див тегу), но ссылки не открывались вообще (загрузка шла и серый экран, вместо плеера)
Через .json ссылки открываются в окне, заменяя контент - это терпимо, но вот прямоугольник ну совсем никуда мне в круговой дизайн не пойдет :с
Все равно, спасибо! :)
![smiling](/static/pybb/emoticons/smiling.png)
![smiling](/static/pybb/emoticons/smiling.png)
![smiling-face-smiling-eyes](/static/pybb/emoticons/smiling-face-smiling-eyes.png)
Если можно, еще один вопрос, пожалуйста… Когда экспортирую только .json и .bin, то где можно поменять css border-radius или другим способом закруглить углы?
Через .html все отображалось (задавала радиус границы див тегу), но ссылки не открывались вообще (загрузка шла и серый экран, вместо плеера)
Через .json ссылки открываются в окне, заменяя контент - это терпимо, но вот прямоугольник ну совсем никуда мне в круговой дизайн не пойдет :с
31 января 2016 08:27
Ответ на сообщение пользователя halingjiМожет быть в качестве временного способа вам подойдёт способ с якорями?
Обоими способами пробовала, никак… видимо не судьба, буду ждать обнову х)
![](https://www.blend4web.com/media/uploads/4fd7bd72-263b-4739-bf75-790fd2ffdbae/anchor.png)
По поводу рамки…
Если вы вставляете на страницу при помощи тега iframe, то у него по умолчанию отображается рамка. Можете в стилях указать следующие "border: none; border-radius: 10px;", и тогда элемент будет отображаться без рамок и с округлёнными краями.
Пример:
<iframe src="scena.html" style="border: none; border-radius: 10px;"></iframe>
Не стой, где попало… Попадет еще раз.
http://naviris.ru/
http://naviris.ru/
31 января 2016 11:57
Все равно, спасибо! :)
Ну я так просто не сдамся.
Вы используете SDK или одиночную версию аддона?
Я для вас подготовил пример-заготовку. Я сделал его с использованием менеджера проектов (доступен в SDK). Вам надо будет произвести импорт этого примера для просмотра.
Установите SDK
Запустите Blender и откройте менеджер проектов:
![](https://www.blend4web.com/media/uploads/903bc9a6-8264-4938-b3ea-ad3ee9493c2c/example_m1.png)
Перейдите в проекты и импортируйте мой пример.
![](https://www.blend4web.com/media/uploads/98bc0a4f-a95c-46a9-9180-f39e9735b83a/example_0.png)
У вас в директории SDK/apps_dev/ будет создана директория page_redirect/ (это я так назвал этот пример), в которой будут лежать .html, .js и .css файлы. Я попробовал чуть скруглить края, как вы говорили
![](https://www.blend4web.com/media/uploads/cf034393-c4cd-4625-9a3c-79765696a854/example_2.png)
Но вы можете сделать там все что угодно, задать любые стили. Для этого вам нужно подправить указанный .css файл
Сам .blend-файл после импорта будет находиться в директории: SDK/blender/page_redirect/
Попробуйте покликать на объекты сцены, будет открываться новое окно в браузере по клику на элемент.
Если я что-то забыл рассказать или что-то будет не понятно, пожалуйста, задавайте вопросы. Вот пример полноэкранного приложения (доказательство, что оно работает
![smiling](/static/pybb/emoticons/smiling.png)
![](https://www.blend4web.com/media/uploads/af52d3a3-959b-4e96-b5cc-eb881fd40157/example_1.png)
01 февраля 2016 07:32
Может быть в качестве временного способа вам подойдёт способ с якорями?
Я бы с удовольствием, но вот у меня нет таких подпунктов в якорях :)
![](https://www.blend4web.com/media/uploads/0bf0520d-a87c-4adf-8f4e-d5cf664e19c3/Screenshot_5.png)
По поводу рамки…
Если вы вставляете на страницу при помощи тега iframe, то у него по умолчанию отображается рамка. Можете в стилях указать следующие "border: none; border-radius: 10px;", и тогда элемент будет отображаться без рамок и с округлёнными краями.
Пример:
<iframe src="scena.html" style="border: none; border-radius: 10px;"></iframe>
Видимо, я неправильно объяснила :)
Как раз с ай фреймом я закруглить смогла, но через ай фрейм не прогружаются страницы, а вот json прогружает страницы, пусть и на этой же вкладке, но json подключен через js и див тег, менять стили #contactFrameWrap - не работает.
<script type="text/javascript" src="../b4w.min.js"></script>
<script type="text/javascript" src="../contactMenu.js"></script>
<div id="contactFrameWrap"></div>
Как-то так~
01 февраля 2016 08:53