Czy d3.js layout.force może być użyty do (ponownego) umieszczenia elementów innych niż svg, takich jak div?Układ force d3.js na elementach innych niż svg
Jeśli div zostały position: absolute;
może left
i top
mogłyby zostać wykorzystane jako ekwiwalent dla x1
i y1
atrybutów stosowany dla elementów SVG?
Celem jest uzyskanie pewnych efektów siłowych na obrazach i elementach menu z obsługą IE8. Jestem świadomy faktu, że węzły svg mogą być obrazami, ale ponieważ potrzebuję wsparcia dla IE8, nie jest to opcja.
Jeśli nie jest możliwe, to przy użyciu opcjiwraz z d3.js istnieje stabilna opcja do tego celu?
Dzięki!
** Aktualizacja **
D3 jest cool !! Zaczynam go odzyskiwać i na pewno można użyć "siły" na zwykłych elementach html, takich jak divy jako d3.layout.force()
zasadniczo daje współrzędne X i Y dla każdego "tick" (lub ramki), które można używaj jak chcesz.
tj:
force.nodes(data)
.on("tick", tick)
.start();
function tick() {
div.style("left", function(d) {return d.x+"px"})
.style("top", function(d) {return d.y+"px"});
}
działa dobrze!
przeciąganie z .call(force.drag);
daje problemy (zgodnie z oczekiwaniami).
Firebug:
(container.ownerSVGElement || container).createSVGPoint is not a function
d3_svg_mousePoint()d3.js (line 3718)
container = div#nav
e = mousemove clientX=607, clientY=200
mouse()d3.js (line 3711)
container = div#nav
d3_behavior_dragPoint()d3.js (line 4481)
d3_behavior_dragDispatch()d3.js (line 4453)
type = "drag"
d3_behavior_dragMove()d3.js (line 4491)
l()d3.js (line 1871)
e = mousemove clientX=607, clientY=200
[Break On This Error]
var point = (container.ownerSVGElement || container).createSVGPoint();
Powinny być naprawić chociaż.