D3 - Wie bekomme ich den richtigen Maßstab und übersetze den Ursprung nach manuellem Zoom und schwenken nach Länderpfad?

Question

Ich habe eine Topologiekarte mit Schwenk- und Zoomfunktion.

auf dem Land Durch Klicken auf, ich bin Zoom/in das Land Schwenken, mit dieser:

if (this.active === d) return 

    var g = this.vis.select('g') 
    g.selectAll(".active").classed("active", false) 
    d3.select(path).classed('active', active = d) 

    var b = this.path.bounds(d); 
    g.transition().duration(750).attr("transform","translate(" + 
    this.proj.translate() + ")" + 
    "scale(" + .95/Math.max((b[1][0] - b[0][0])/this.options.width, (b[1][1] - b[0][1])/this.options.height) + ")" + 
    "translate(" + -(b[1][0] + b[0][0])/2 + "," + -(b[1][1] + b[0][1])/2 + ")"); 

    g.selectAll('path') 
    .style("stroke-width", 1/this.zoom.scale()) 

Wenn ich jedoch Pfanne ziehen weiter, die Karte zuckt zurück in die Ausgangsposition vor dem Klick geschieht vor dem Schwenken. Code zum Schwenken/Zoom ist hier:

this.zoom = d3.behavior.zoom().on('zoom', redraw) 
    function redraw() { 

    console.log('redraw') 

    _this.vis.select('g').attr("transform","translate(" + 
     d3.event.translate.join(",") + ")scale(" + d3.event.scale + ")") 

    _this.vis.select('g').selectAll('path') 
     .style("stroke-width", 1/_this.zoom.scale()) 
    } 
    this.vis.call(this.zoom) 

In anderen Worten, nachdem durch einen Klick in einen Punkt zoomen, und dann durch die Neuzeichnung Funktion ziehen, die Neuzeichnung nicht nach oben nicht wählen Sie die richtige übersetzen + Skala von fortzusetzen.

Answer 1

Um nach dem Übergang am rechten "Zoom" weiterzumachen, musste ich den Zoom auf die neue Übersetzung und Skalierung einstellen.

Beispiel Reset, die ähnlich wie mein klicken und Zoom Ereignis angewendet wird, ist die eingestellte neue Zoom-Punkt die kritische Bit:

_this.vis.select('g').transition().duration(1000) 
    .attr('transform', "translate(0,0)scale(1)") 

/* SET NEW ZOOM POINT */ 
_this.zoom.scale(1); 
_this.zoom.translate([0, 0]);