Как работает переписка JavaScript-SVG Events? - PullRequest
0 голосов
/ 31 января 2019

Проработав с Inkscape довольно долгое время, теперь, когда я начал изучать JavaScript, я очень хотел создавать интерактивную векторную графику.Тем не менее, мне довольно трудно понять, как работают определенные аспекты разных вещей.Используя этот учебник в качестве справочного материала (http://www.petercollingridge.co.uk/tutorials/svg/interactive/dragging/), Мне было интересно, сможет ли кто-нибудь помочь мне в моем понимании, ответив на несколько моих вопросов относительно него:

  1. Этонасколько я понимаю, что на языке SVG evt - это просто псевдоним события, но какое именно событие он принимает в качестве аргумента? Он работает непрерывно и постоянно принимает новые аргументы, так что он сначала принимаетнажмите, затем перетащите, затем отпустите, затем ничего, затем ничего, затем еще один щелчок, перетащите и т. д .?

  2. Почему onload = "makeDraggable ()« объявлен в <svg ...>, и почему не получается, чтобы он был объявлен в отдельных <path ...>, и не был объявлен в <body ...>?

  3. Почему после строки

var transforms = selectedElement.transform.baseVal;

что при изменении значений преобразуется , значения selectedElement.transform.baseVal тоже меняется?

Надеюсь, мои вопросыне слишком размыто, чтобы можно было на них ответить.Заранее спасибо!

1 Ответ

0 голосов
/ 02 февраля 2019
  1. В javascript вы можете назвать свойство события, передаваемое в обработчик событий, как угодно.function startDrag(bob) будет работать так же хорошо.Каждый раз, когда запускается одна из ваших функций обработчика событий, создается новый объект события, который передается в функцию обработчика событий.

  2. Функция makeDraggable создаетОбработчики событий мыши для всего файла SVG, но внутри этих функций обработчика событий они выполняют перетаскивание на evt.target, который будет тем элементом, над которым была наведена мышь.Каждый раз, когда вы щелкаете что-то в файле svg, в него будет передан новый объект события, для которого evt.target будет установлено значение, на которое была наведена ваша мышь.

  3. baseVal - это объект,и для transforms указана ссылка на объект, поэтому любые изменения в преобразованиях аналогичны изменениям в baseVal.Для получения дополнительной информации посмотрите разницу между значениями и ссылочными типами в JavaScript.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...