Нестандартное перетаскивание изображений с использованием HTML5 canvas

Question

Я бы хотел написать приложение на HTML5, похожее на следующее.

HTML5 Canvas Animals on the Beach Игра с KineticJS

Проблема с этой демонстрацией заключается в том, что указатель мыши находится над точным прямоугольником, окружающим животное.Есть ли способ сделать это с большей точностью, будь то в KinectJS или иным образом?

Answer 1

Как правило, существует два способа:

1. Использование пользовательских путей с каждым изображением в качестве хитбоксов (которые вы определяете вручную) с последующим использованием алгоритма "точка-в-пути"
2. Использованиепризрачный холст (или как вы его называете), как я подробно описал в этом старом уроке .Не обращайте внимания на ссылку на новый учебник, старый использует то, что вы хотите.

Первый метод здесь намного быстрее, но требует гораздо больше кода и ручной работы.Второй метод идеален по пикселям, но намного медленнее.Тем не менее, если у вас нет огромного количества предметов, это может удовлетворить ваши потребности.