Wie Sie verhindern, dass d3 auslösen ziehen Sie auf der rechten Maustaste?
Ich habe einige ziehen Verhalten, dass wie erwartet funktioniert wie folgt (code in CoffeeScript):
nodeDrag = d3.behavior.drag()
.on("dragstart", (d, i) ->
force.stop())
.on("drag", (d, i) ->
d.px += d3.event.dx
d.py += d3.event.dy
d.x += d3.event.dx
d.y += d3.event.dy
tick())
.on("dragend", (d, i) ->
force.resume()
d.fixed = true
tick())
//...
nodes = vis.selectAll(".node")
.data(graph.nodes)
.enter()
.append("g")
//...
.call(nodeDrag)
Ich jetzt versuchen, erstellen Sie benutzerdefinierte Verhalten für rechts-Klicks auf die Knoten. Allerdings löst dies "dragstart" und "ziehen", das heißt, nach ich nenne e.preventDefault()
auf die "contextmenu" Veranstaltung, die Knoten in Frage ist, klebte an meine Maus Zeiger und folgt ihm herum, bis ich eine andere (Links) klicken Sie zu zwingen, ein release (ich nehme an e.preventDefault()
auch verursacht, "dragend" nie Feuer).
Fand ich eine kurze Diskussion zu diesem Thema in einem Google Groups thread auf und ein Diskussion in d3 Probleme auf Github. Allerdings kann ich nicht herausfinden, aus diesen Kommentaren, wie um zu verhindern, dass dieses Verhalten.
Wie kann ich nicht den Auslöser ziehen auf der rechten Maustaste?
- In der
dragstart
Veranstaltung, die Sie überprüfen könnten, ob die Rechte Maus-Taste geklickt wurde (mit d3.Ereignis) und wenn dem so ist, nicht nennenforce.stop()
. - Wie kann ich prüfen, welche Maustaste geklickt wurde, in
d3.event
? Alle Vorschläge, die ich finden kann, wiewhich
,button
undkeyCode
mirundefined
. Abgesehen davon: ich nenneforce.stop()
zu stoppen, der layout-Algorithmus, während der Benutzer mit der Maus ziehen. Also nicht aufrufen, es wird nicht verhindern, dass die drag-Geste geschieht. - Ich denke
d3.event
hat ein MitgliedsourceEvent
oder so etwas, das gibt Ihnen Zugang zu der eigentlichen Veranstaltung. Und ja, du brauchst so etwas wiepreventDefault()
als gut.
Du musst angemeldet sein, um einen Kommentar abzugeben.
Habe ich eine Möglichkeit gefunden zu begrenzen ziehen Sie gesten auf der linken Maustaste nur.
Es beinhaltet ein zusätzliches Feld, dass Datensätze, wenn eine Geste initiiert wurde:
Den rest der code ist so geändert, register, Einleitung und Beendigung eines gewünschten drag-gesten auf "dragstart" und "dragend", beziehungsweise. Aktionen für "ziehen" sind nur dann durchgeführt, wenn eine drag-gesten wurde ordnungsgemäß eingeleitet.
Ich bin nicht sicher, ob das die eleganteste Lösung, aber es funktioniert und ist nicht außergewöhnlich ungeschickt, oder ein großer hack.
d3.event.button
d3.event.sourceEvent.button
stattd3.event.button
d3.event.sourceEvent.button
führte zu einem Fehler, da d3.event.sourceEvent wurde nicht definiert. Aberd3.event.button
richtig funktioniert.für D3 v4 siehe ziehen.filter([filter])
Ist der filter angegeben, wird der filter für die angegebene Funktion aus und gibt das Verhalten "bewegen". Wenn der filter nicht angegeben, wird der aktuelle filter, die standardmäßig.
für die Rechte Maustaste:
.filter(['touchstart'])
Filter zur Verfügung
mousedown, mousemove, mouseup, dragstart, selectstart, klicken Sie auf, touchstart, touchmove, touchend, touchcancel
Wenig spät zur party, ich hatte das gleiche problem und ich habe folgende Methode um sicherzustellen, dass meine
drag
funktioniert nur fürleft click
.Zur Verarbeitung aller Listener für drag-Ereignis, können Sie folgenden code verwenden:
Eigentlich mit der verschiedenen version von
d3
Sie möchten möglicherweise verwenden Sied3.event.which
stattd3.event.sourceEvent.which
zu erkennen, welche Maus-Taste auf die Sie geklickt haben.