Можно ли перетащить элемент HTML dom и перетащить на элемент SVG dom?

В настоящее время я использую Raphaël JS (открыт для перехода на jQuery SVG) и jQuery UI, чтобы попытаться создать прототип настольной игры . Это чем-то похоже на Risk в том, что доска представляет собой карту, и вы можете (надеюсь, скоро) перетаскивать части из одной зоны на карте в другую (скажем, из A в B) и бросать их туда. После того, как вы бросили, это вызовет обратный вызов поработать.

Прямо сейчас я застрял, пытаясь получить функциональность перетаскивания. Я хочу перетащить элемент html (div) на элемент SVG. Я не очень знаком с SVG, но насколько я понимаю, есть проблемы, которые необходимо преодолеть, чтобы заставить HTML и SVG DOM работать вместе.

У меня есть две версии, и я пытаюсь заставить пользовательский интерфейс jQuery перетаскивать / опускать их вместе с любой из них. используя jQuery SVG с плагином svgdom + jQuery UI, а другой - просто Raphaël + jQuery UI. Ни один из них, похоже, не запускает событие drop. Насколько мне известно, версия Raphaël doe не работает, потому что манипуляции с dom jQuery не могут взаимодействовать с dom SVG.

JS Fiddle jQuery SVG: http://jsfiddle.net/cqMUL/5/ (вам придется прокрутить вниз, чтобы увидеть элементы SVG, мои извинения).

Другие возможные решения выглядят так:
a) Использование Raphaël с его встроенными функциями drag и onDragOver , хотя тогда я использую все SVG и Я пытаюсь использовать HTML-дом для движущихся частей, потому что они будут изображениями (div с фоновым изображением). Вдобавок мне, наверное, придется самому реализовать drop.
б) Попытка использовать перетаскивание HTML5, хотя я не уверен, что это сработает.

7
задан MAP 18 October 2011 в 03:16
поделиться