Javascript d3 svg如何使多个圆居中

我有一个json文件：

{
    "circles": [
        {"name": "Circle", "x":13.284199,"y":-12.223403, "group":1}, 
        {"name": "Circle", "x":13.277986,"y":-30.081020, "group":0}, 
        {"name": "Circle", "x":37.270324,"y":-46.266050, "group":0}, 
        {"name": "Circle", "x":49.085207,"y":-50.323903, "group":1}, 
        {"name": "Circle", "x":17.334599,"y":-76.113029, "group":1}, 
        {"name": "Circle", "x":40.067553,"y":-76.576700, "group":0}, 
        {"name": "Circle", "x":11.616747,"y":-107.550639, "group":0}, 
        {"name": "Circle", "x":10.827147,"y":-134.892190, "group":0}, 
        {"name": "Circle", "x":18.657633,"y":-171.319351, "group":0}, 
        {"name": "Circle", "x":50.023818,"y":-182.810422, "group":0}
    ]
}

我在画圆，并根据x和y坐标定位它们。 到目前为止，我已经尝试将svg元素的transform=translate设置为第一个圆的x和y坐标，但没有成功

如果图像是您想要的，则必须移动圆附加到的元素。像这样：

svg.attr("transform",function(){
                movementX = windowWidth/2 - svgWidth /2;
                movementY = windowHeight/2 - svgHeight /2;
                return "translate("+movementX+","+movementY +")";
                }
                );

如果svg是svg类型的话。如果不是，你就必须使用偏移量

$(svg).offset({top : movementY, left: movementX});

这将使svg居中于屏幕中央。我不能百分之百地回答，因为我需要看看你的代码和你使用过的元素，但是基本的都在那里，应该很容易理解

编辑

我才意识到这还没有解决

我向标记添加了一个ID，即圆圈的容器，并添加了以下代码。我已作出评论解释：

var circleContainer=d3。选择'circleContainer'//获取循环容器 var CircleContainerBox=getBoundingBox'circleContainer'//获取圆容器的边界框以获取x、y、宽度和高度 var svgBBox=getBoundingBox'svg'//svg查找偏移量也一样 var differenceX=circlecontainerbox.x-svgBBox.x-circlecontainerbox.width/2//svg x和circleContainer x之间的差异将从左上角绘制的圆形容器的宽度减半 变量差y=CircleContainerBox.y-svgBBox.y-CircleContainerBox.height/2//y方向相同 var width=800，//设置宽度 高度=400//身高 circleContainer.attr'transform'，函数d{ 返回translate+width/2+differenceX+，“+height/2+differenceY+；//下面是根据上面计算的值变换圆容器的示例 } 函数getBoundingBoxeElement{//用于获取bbox的函数 var thisEl=document.queryselectorement var thiselbox=thisEl.getBBox； console.LogThiselbox 把这个盒子还给我； } svg{ 宽度：800px； 高度：400px； 边框：1px实心00667A； }

---

如果你已经用平移+dx+，+d+y+变换这些圆，检查它是否是因为位置y值是负的，并且圆在你的SVG区域是不可见的。

我试图在SVG元素的中间居中圆圈，我没有麻烦去定位它们。svg的尺寸是800px 400px需要指出的一点是，为什么您希望它们都位于中心？当然，他们只跑了一圈，你就看不到他们了……我不想在圆圈上变换，但在Svgahh上，好的，2分钟后看我的答案，看看我是否明白你在问什么，这就是你想要的吗？如果是，则只需移动圆附加到的元素。i ll edit againi不变换我变换的圆svg变换属性不适用于，但可以使用变换打开，要更改svg的位置，我认为需要使用“x”或“y”属性