2016-12-09 4 views
0

Ich habe d3.js Baum, wenn ich nach einem bestimmten Knotennamen suche Ich muss Zoom auf den jeweiligen Knoten. Idealerweise enthält mein Baum 1000 Knoten und wird verkleinert, um in den Bildschirm zu passen. Wenn ich den Fokus sage, möchte ich, dass der Knoten in der Mitte der Seite steht und der Zoom 1: 1 sein sollte. Gibt es ein bestimmtes d3-Event, das das tut?zoom d3.js Baum für einen bestimmten Knoten

Antwort

0

Ich konnte kein Ereignis finden, das dies tut, stattdessen habe ich den Knoten manuell fokussiert, indem ich den Übergang änderte.Hope das wird für jemanden nützlich sein.

/***** get co-ordinates of the entire svg group containing the node. 
      Tree is placed on the centre of the screen 
    ****/ 
var svgGroupTranslateCoords = d3.transform($("#svg").attr("transform")) 
    translateX = svgGroupTranslateCoords .translate[0]; 
    translateY = svgGroupTranslateCoords .translate[1]; 
    scaleX = svgGroupTranslateCoords .scale[0]; 
    scaleY = svgGroupTranslateCoords .scale[1]; 
/******* Get co-ordinates for the node to be highlighted or focused*******/ 
    var nodeCoords = d3.transform($("#node").attr("transform")) 
     ntranslateX = nodeCoords.translate[0]; 
     ntranslateY = nodeCoords.translate[1]; 
/**** find the new co-ordinates where the focused node is to be positioned ****/ 
    var newTranslateX = translateX-ntranslateX; 
    var newtranslateY = translateY-ntranslateY 
    svgGroup.transition().attr("transform", "translate(" + newTranslateX + "," + newtranslateY + ")scale(1,1)");