При повороте 3d модели остается след, clearRect не работает?10.12.2021, 05:40. Показов 6845. Ответов 42
Метки нет (Все метки)
С помощью moveTo и lineTo создала несколько 3d-объектов, при нажатии кнопок клавиатуры происходит поворот 3d-объектов однако остается след. В функцию my_down, добавила ctx.clearRect(0, 0, cvs.width, cvs.height);. В этой же функции происходит повторная прорисовка объектов, my_down срабатывает при нажатии кнопки keydown(addEventListener). Не очищается холст и остаются следы. Как исправить? Вот код:
0
|
|||||||||||
| 10.12.2021, 05:40 | |
|
Ответы с готовыми решениями:
42
Canvas. При перемещении объекта остается след Затемнение: при повороте модели не освещаются боковые нормали |
| 21.12.2021, 10:09 [ТС] | |
|
8Observer8, перечитала еще раз все посты, моего вопроса, здесь упоминается Babylon.js. Нашла в интернете подходящую статью. Creation of an HTML5 3D Sokoban level with Babylon.js. В целом движок мне понравился. Даже свечение можно на нем сделать.
1
|
|
| 21.12.2021, 16:47 | ||
Из всех движков для 3D мне больше всего понравился Babylon.js. Есть выбор: писать 3D веб-приложения с помощью движка или использовать чистый WebGL + glMatrix. Нужно чётко понимать одну вещь - для каких целей используется движок или чистый WebGL. Если вам нужно приложение для интернет-магазина с 3D конструктором или обзор квартир с реалистичной графикой с PBR/VR, то однозначно надо брать движок. Но если вам нужна игра с low-poly графикой с анимациями, или вам нужна функциональность веб-приложения без PBR, чтобы не тормозило на средних ноутбуках, то я обеими руками за чистый WebGL + glMatrix + TypeScript. У меня по приоритету:
На чистом WebGL + glMatrix + TypeScript я написал игру со стрелами и змейку в песочнице. Ещё есть куча мелких прототипов, на которых я продолжаю тренироваться. Я ещё в процессе изучения сопутствующих основ геймдева, можно сказать, что в самом начале пути. Пару месяцев назад написал такую демку:
1
|
||
| 22.12.2021, 10:15 [ТС] | ||
Движок называется phoria, вот ссылка: https://github.com/kevinroast/phoria.js А вот так выглядит index.html (скриншот ниже). В маленьком окне показан пример движение объектов. Ссылки которые расположены справа от окна, это примеры возможностей движка.
0
|
||
| 22.12.2021, 10:33 [ТС] | ||
0
|
||
| 22.12.2021, 11:08 [ТС] | |
|
8Observer8, Можете протестировать на html5 примеры по ссылке и сказать как работает? Меня больше всего интересует производительность модели монстра похожего из игры doom. Вот пример скриншот.
А также модели армии воинов. Нужно знать какая будет производительность, при огромном количестве движущихся объектов и при условии высокой детализации графики.
0
|
|
| 22.12.2021, 12:53 | |||||
Сейчас занят импортированием анимаций. Хочу, для начала, такую демку сделать, как этот парень сделал:
0
|
|||||
| 30.12.2021, 23:01 [ТС] | |||
Эти архивы достаточно полезны в работе не давно я поставила архив под названием r73 посмотреть что внутри и обнаружила много разных примеров например создание 3d scene с управлением кнопок на клавиатуре мышкой вот примеры. Пример 1 Пример 2 Некоторые примеры которые я находила в сети используют json я решила изучить как правильно делать конвертирования в Blender и нашла несколько плагинов. https://github.com/satori99/threejs-blender-export https://github.com/warmwaffles/io_mesh_json Плагин до r69 io_mesh_threejs, после уже идет io_three. Я конечно не утверждаю что это лучший формат, но пока последнее время использую его для выполнение простых примеров.
8Observer8, вы писали, что хотите научиться создавать 3d игры. Я лично последнее время смотрела глобальную библиотек по threejs https://github.com/mrdoob/three.js. Там есть модели со скелетной анимацией, вот примеры. Перемещения человека в доспехах Пример анимации Пример робота с анимацией Несколько анимированных персонажей на одной сцене. Правда все эти объекты используют "skinning". 8Observer8 вы писали в одном из постов, что пытаетесь обойтись без skinning, каким образом вы делаете построение модели? Я пробовала посмотреть в сети где модели работают без "скининга" посмотрела эту библиотеку, прочитала несколько статей. https://agm1984.medium.com/how... 6e258a9d9d https://unboring.net/workflows/animation.html Там про конвертацию json которую я сейчас изучаю везде используется skinning. Тоже собираюсь сделать анимацию модели. 8Observer8, вы выше писали “Сейчас занят импортированием анимаций. Хочу, для начала, такую демку сделать, как этот парень сделал:” На одном сайте нашла Jill Valentine, только без анимации интересно есть возможность её сделать анимацию? https://p3dm.ru/files/characte... stars.html
0
|
|||
| 31.12.2021, 00:57 | ||||||
|
Chapter 09. Hierarchical Objects ch09/JointModel: https://jsfiddle.net/8Observer8/vqse5egz/ ch09/MultiJointModel: https://jsfiddle.net/8Observer8/sL53wkn3/ ch09/MultiJointModel_segment: https://jsfiddle.net/8Observer8/ygvk7odv/
0
|
||||||
| 31.12.2021, 01:18 | ||
|
Отличный урок по запеканию теней и shading объектов:
0
|
||
| 10.01.2022, 18:31 [ТС] | ||
https://codepen.io/Smith37/pen/xxXyGwr "Октаэдр". Так же на репозитории github создала новый проект просмотр 3d объектов. Там можно выбирать любую фигуру и она будет загружаться. Загрузка происходит с помощью XMLHttpRequest. Все модели хранятся в текстовом файле и подгружается при щелчке на кнопке из списка. https://1olgastorm.github.io/3dmodels/ Картинка примера: Чтобы повернуть модель нужно перемещать мышь удерживая кнопку мыши.
1
|
||
| 10.01.2022, 19:30 | |||||||||||||
Как использовать эту библиотеку на примере сложения двух векторов и сложения двух матриц:
1
|
|||||||||||||
| 10.01.2022, 21:33 [ТС] | |||||||||||
|
8Observer8, заменила часть кода по вашей рекомендации.
Было:
1
|
|||||||||||
| 10.01.2022, 21:58 [ТС] | |
|
8Observer8, у вас стаж работы 10 лет, если судить по профилю. Я не знаю работали вы с технологией FLASH AS 3.0. и библиотекой Away3D. У меня есть один пример из одной старой книги. Книга была на английском языке, там рассказывается как сделать управление героем стрелками, вид от 3-его лица. Вот исходники.
CameraDemo.zip А вот сам скриншот. Технология flash, примерно 5 лет как устарела. Как сделать такой же пример вид от 3-его лица на WebGL? В Флеше я знаю как сделать а вот WebGL только изучаю. Чтобы запустить сам пример в только что созданном проекте Flash, просто следует добавить класс в свойства как показано на картинке и запускать нужно в браузере или другом проигрователе (не Flash Player, там пример плохо работает).
0
|
|
| 10.01.2022, 22:25 | ||
|
0
|
||
| 11.01.2022, 01:00 | ||||||||||||||||||||||||||
|
Я сделал простой пример загрузки статических объектов с текстурами на WebGL: https://github.com/8Observer8/... ter/public Загрузил на форум: matches-box-dae-webgl-js-master.zip (686.6 Кб) В примере нет никаких анимаций, физики, нет GameLoop, а есть просто статика. Пока не надо разбираться с кодом, а выполните одно задание. Скопируйте пример. Переименуйте его. В "index.html" переименуйте Title. Обратите внимание, что рисунки загружаются в "index.html" и они скрыты "hidden":
В файле main.js в самом верху добавьте свои объекты вместо этих:
В функции draw() напишите свои объекты:
0
|
||||||||||||||||||||||||||
| 11.01.2022, 12:18 | |
|
Раз вы научились хостить на GitHub Pages (https://1olgastorm.github.io/), то пора захостить на Heroku (https://www.heroku.com/). Это делается очень просто и быстро. Следуйте моей инструкции: Инструкция по развёртыванию Node.js сервера с WebSockets на бесплатном хостинге Heroku. Heroku даёт намного больше возможностей, чем GitHub Pages, потому что Heroku позволяет использовать Node.js, то есть серверную часть. На Heroku есть бесплатный тариф использования баз данных, например, на нём есть MySQL. Правда, с определёнными ограничениями по трафику и по размеру базы данных (для MySQL не более 5 МБайт размер базы данных). Но этого вполне хватит для небольших игр, а потом можно будет взять платный тариф, когда перестанет хватать бесплатного.. Можно использовать WebSockets для передачи сообщений между клиентами через сервер или просто от сервера клиентам - какие-нибудь оповещения в реальном времени. Задание: захостить на Heroku ваше приложение: https://github.com/1olgastorm/3dmodel
0
|
|
| 12.01.2022, 02:24 | ||
|
Добавлено через 5 часов 37 минут Полезный туториал: https://unboring.net/workflows/animation.html и пример из него: https://codepen.io/8Observer8/pen/GRMwJOY
1
|
||
| 12.01.2022, 08:58 [ТС] | ||
0
|
||
| 12.01.2022, 08:58 | |
|
Помогаю со студенческими работами здесь
40
Почему при перемещении объекта остается "след" от него? Не Работает clearRect (canvas)
Остаётся след мышки снизу На фоне остается след от анимации Искать еще темы с ответами Или воспользуйтесь поиском по форуму: |
|
| Опции темы | |
|
|
Новые блоги и статьи
|
|||
|
Асинхронный приём данных из COM-порта
Argus19 01.05.2026
Асинхронный приём данных из COM-порта
Купил на aliexpress термопринтер QR701. Он оказался странным. Поключил к Arduino Nano. Был очень удивлён. Наотрез отказывается печатать русские буквы. Чтобы. . .
|
попытка написать игровой сервер на C++
pyirrlicht 29.04.2026
попытка написать игровой сервер на плюсах с открытым бесконечным миром.
возможно получится прикрутить интерпретатор питон для кастомизации игровой логики.
что есть на текущий момент:. . .
|
Контроль уникальности выбранного документа-основания при изменении реквизита
Maks 28.04.2026
Алгоритм из решения ниже разработан на примере нетипового документа "ЗаявкаНаРемонтСпецтехники", разработанного в КА2.
Задача: уведомлять пользователя, если указанная заявка (документ-основание). . .
|
Благородство как наказание
Maks 24.04.2026
У хорошего человека отношения с женщинами всегда складываются трудно. А я человек хороший. Заявляю без тени смущения, потому что гордиться тут нечем. От хорошего человека ждут соответствующего. . .
|
|
Валидация и контроль данных табличной части документа перед записью
Maks 22.04.2026
Алгоритм из решения ниже реализован на примере нетипового документа, разработанного в КА2.
Задача: контроль и валидация данных табличной части документа перед записью с учетом регламента компании. . .
|
Отчёт о затраченных материалах за определенный период с макетом печатной формы
Maks 21.04.2026
Отчёт из решения ниже размещён в конфигурации КА2.
Задача: разработка отчёта по затраченным материалам за определённый период, с возможностью вывода печатной формы отчёта с шапкой и подвалом.
В. . .
|
Отчёт о спецтехнике находящейся в ремонте
Maks 20.04.2026
Отчёт из решения ниже размещен в конфигурации КА2.
Задача: отобразить спецтехнику, которая на данный момент находится в ремонте.
Есть нетиповой документ "Заявка на ремонт спецтехники" который. . .
|
Памятка для бота и "визитка" для читателей "Semantic Universe Layer (Слой семантической вселенной)"
Hrethgir 19.04.2026
Сгенерировано для краткого описания по случаю сборки и компиляции скелета серверного приложения. И пусть после этого скажут, что статьи сгенерированные AI - туфта и не интересно. И это не реклама -. . .
|