увеличить дерево d3.js для определенного узла

Question

У меня есть дерево d3.js, когда я ищу по определенному имени узла, мне нужно сделать масштабирование для конкретного узла. В идеале мое дерево может содержать 1000 узлов, и оно будет уменьшаться, чтобы вписаться в экран, когда я говорю «фокус». Я хочу, чтобы узел находился в центре страницы, а масштаб - 1: 1. Есть ли какое-то конкретное событие d3, которое это делает?

Answer 1

Я не смог найти событие, которое делает это, вместо этого я сделал фокус узла вручную, изменив переход. Надеюсь, это кому-то будет полезно.

/***** 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)");