Форум

Координаты клика по плоскости

30 июля 2015 11:44 #3256
Здравствуйте, хотел узнать есть ли функционал позволяющий определить координату плоскости по которой был произведен клик.
Нашел примерный функционал в https://www.blend4web.com/tutorials/examples/cartoon_interior/cartoon_interior.html. Там объект водится за текущей координатой мышки относительно плоскости(mousemove вместо click). Как я понял координаты (spawner_pos) берутся у объекта spawner, но что он из себя предстваляет я не пойму
30 июля 2015 14:45 #3258
Здравстуйте, функционал такой есть, их даже два.

1) Как это сделано в приложении cartoon_interior.html:
- по 2d координатам канваса рассчитывается направляющий вектор луча, выходящего из камеры:
var camera_ray = m_cam.calc_ray(cam, x, y, _vec3_tmp);

calc_ray

- затем ищется точка пересечения этого луча с заданной плоскостью (задается через нормаль):
var point = m_util.line_plane_intersect(FLOOR_PLANE_NORMAL, 0, cam_trans, camera_ray, _vec3_tmp2);


Вот выдержка из статьи:
Рассмотрим подробнее функцию line_plane_intersect():

var point = m_util.line_plane_intersect(FLOOR_PLANE_NORMAL, 0,
cam_trans, camera_ray, _vec3_tmp3);

Она служит для определения точки пересечения прямой и плоскости. Первые два параметра задают плоскость, а именно нормаль (использована константа FLOOR_PLANE_NORMAL) и расстояние от плоскости до центра координат (равно нулю). Эти значения были подобраны в соответствии с моделью комнаты. Также подаются координаты камеры в мировом пространстве (cam_trans) и направляющий вектор прямой (camera_ray).


2) С другой стороны можно воспользоваться возможностями физики движка как в демке "Ray Test" приложения Code Snippets:

    var from = new Float32Array(3);
    var to = new Float32Array(3);
    ...
    var ray_test_cb = function(id, hit_fract, obj_hit, hit_time, hit_pos, hit_norm) {...}

    var mouse_cb = function(e) {
        var x = e.clientX;
        var y = e.clientY;
        m_cam.calc_ray(m_scenes.get_active_camera(), x, y, to);

        m_vec3.scale(to, 100, to);
        var obj_src = m_scenes.get_active_camera();
        var id = m_phy.append_ray_test_ext(obj_src, from, to, "ANY",
                ray_test_cb, true, false, true, true);
    }


Здесь также рассчитывается луч, и далее создается тест на пересечение лучом препятствий (функция append_ray_test_ext). В коллбэк ray_test_cb должна прийти позиция в параметре hit_pos. Параметр "ANY" означает пересечение с любым объектом.
Команда Blend4Web
31 июля 2015 22:50 #3272
Спасибо, попробовал первый способ, все отлично работало пока не уменьшил экран до появления скрола. При скроле некорректно работает первый способ, добавил скрол в демке https://www.blend4web.com/tutorials/examples/cartoon_interior/cartoon_interior.html?v=20150731181610 , возникла аналогичная проблема(
Сделал подобные действия с Ray Test получил тот же результат.

Избавился от проблема переназначив координаты курсора
с
var x = m_mouse.get_coords_x(e);
var y = m_mouse.get_coords_y(e);

на
var x = e.pageX;
var y = e.pageY;
03 августа 2015 18:57 #3297
Спасибо, попробовал первый способ, все отлично работало пока не уменьшил экран до появления скрола.
Рад, что заработало, а случай со скроллом мы посмотрим на предмет багов.
Команда Blend4Web
17 августа 2015 18:45 #3449
В тему:
код целиком был вставлен из примера. Только пришлось заменить нормаль пересечения пола с [0, 1, 0] на [0, 0,1 ] для изменения плоскости пересечения. Объекты изначально уже в сцене. при активации (нажатии мышкой ) и попытке перетащить, объекты дергаются в центр экрана и оттуда начинают перетаскиваться. Даже если позиция объекта была изменена перетаскиванием, при следующей попытке перетащить он снова дергается в центр и оттуда перетаскивается.
А задача: таскать объект по вертикальной плоскости на всю ее ширину. Да еще и по сетке хотелось бы.
Коплю деньги на коммерческий B4W.
18 августа 2015 11:16 #3457

Ответ на сообщение пользователя Йеджи Заборовски
В тему:
код целиком был вставлен из примера. Только пришлось заменить нормаль пересечения пола с [0, 1, 0] на [0, 0,1 ] для изменения плоскости пересечения. Объекты изначально уже в сцене. при активации (нажатии мышкой ) и попытке перетащить, объекты дергаются в центр экрана и оттуда начинают перетаскиваться. Даже если позиция объекта была изменена перетаскиванием, при следующей попытке перетащить он снова дергается в центр и оттуда перетаскивается.
А задача: таскать объект по вертикальной плоскости на всю ее ширину. Да еще и по сетке хотелось бы.

Дергаться может, если сильно скачет точка пересечения луча и плоскости. Идеальным будет расположение плоскости перпендикулярно направлению взгляда камеры. Проверьте нормаль: [0,0,1] означает направление по -Y в блендере.
Команда Blend4Web
24 августа 2015 11:46 #3524

Избавился от проблема переназначив координаты курсора
с
var x = m_mouse.get_coords_x(e);
var y = m_mouse.get_coords_y(e);

на
var x = e.pageX;
var y = e.pageY;

Да, действительно, при получении координат canvas'а нужно учитывать скроллинг. Функции get_coords_x/y возвращают координаты clientX/Y, которые соответствуют текущему вьюпорту браузера и не берут в расчет скроллинг вообще. В вашем случае, как я понял, скроллится только окно браузера - для этого идеально подходят свойства pageX/Y.

Но есть и более сложные варианты расположения canvas'а, например, скроллинг внутри отдельных элементов страницы, смещение canvas'а относительно верхнего левого угла, изменение его позиции javascript'ом и т.д. Для этого в движке есть функционал по пересчету координат, как им пользоваться, описано в соответствующем разделе документации.
Команда Blend4Web
 
Пожалуйста, зарегистрируйтесь или войдите под своей учетной записью , чтобы оставлять сообщения.