листовка setView на пути svg

Question

У меня есть листовка и путь SVG от привязанного к ней геойсона. Я хотел бы иметь возможность установить вид на многоугольник при нажатии на него. И всплывающее окно в нем при наведении курсора. Однако он просто выводит всплывающее окно или вид из карты. Остальное работает отлично, я просто не понимаю, как спроецировать нужную точку.

Я попытался решить ее, получив центр многоугольника с его ограничительной рамкой. У меня также есть функция сброса вида, которая всегда меняет поле

const poly = d3.select(this);
var element = poly.node();
var bbox = element.getBBox();
tempX = bbox.x + bbox.width / 2;
tempY = bbox.y + bbox.height / 2;

map.setView(tempY,tempX)


//view set function
map.on("viewreset", reset);
function reset() {
    bounds = path.bounds(collection),
    topLeft = bounds[0],
    bottomRight = bounds[1];

    svg.attr("width", bottomRight[0] - topLeft[0])
    .attr("height", bottomRight[1] - topLeft[1])
    .style("left", topLeft[0] + "px")
    style("top", topLeft[1] + "px");

    g.attr("transform", "translate(" + -topLeft[0] + "," 
                + -topLeft[1] + ")");
    feature.attr("d", path)
}

Я ожидаю, что смогу поместить вид в центр многоугольника и связать там всплывающее окно