D3.js d3力未正确施加x刻度

我想对数组中d3力生成的圆应用一个比例

这段代码生成了右x轴，但是有大量的圆是用“goalamount”类生成的，它们都是屏幕外数万像素的。goalamount类中应该只有六个圆圈，它们都应该按X轴缩放-我做错了什么

const数据=[{
x:2020，
cx:0，
颜色：“69306D”，
scY:0，
y2:50，
拉德：10，
金额：5000
},
{
x:2020，
cx:0，
颜色：“247BA0”，
scY:0，
y2:50，
拉德：10，
金额：5000
},
{
x:2020，
cx:0，
颜色：“3F762C”，
y1:0，
y2:50，
拉德：10，
金额：5000
},
{
x:2020，
cx:0，
颜色：“F25F5C”，
y1:0，
y2:50，
拉德：10，
金额：5000
},
{
x:2022，
cx:0，
颜色：“0C3957”，
y1:0，
y2:170，
拉德：10，
金额：5000
},
{
x:2055，
cx:0，
颜色：“BF802F”，
y1:0，
y2:50，
拉德：10，
金额：15000
}
];
const maxYear=Math.max.apply（Math，data.map）（函数（o）{
返回o.x；
}));
const svg=d3.选择（“svg”）；
常量pxX=svg.attr（“宽度”）；
常量pxY=svg.attr（“高度”）；
设tickLabelOffset=170；
让minDotX=Math.min.apply（Math，data.map）（函数（o）{
返回o.y1；
}))
如果（minDotX<-20）{
tickLabelOffset+=minDotX+20；
}
常量makeScale=（arr、存取器、范围）=>{
返回d3.scaleLinear（）
.域（d3.范围（arr、访问器））
.射程（射程）
.尼斯
}
const thiswear=新日期（）.getFullYear（）
让滴答声=[]；
for（让i=今年；id.x[0，pxX-200]）；
常数scX1=makeScale（数据，d=>d.x[0，pxX-2020]）；
const scY=d3.scaleLinear（）.domain（[01100]）.range（[01100]）；
常数g=d3.axisBottom（scX）.tickValues(
tickTens.map（（tickVal）=>{
返回tickVal
})
)
常数rad=d3.scaleLinear（）
.域（d3.范围（数据，d=>d.rad））
.范围（[3,10]）；
常量金额=d3.scaleLinear（）
.域（d3.范围（数据，d=>d.amt））
.范围（[20,50]）；
for（让dotindex=0；dotindex{
变量u=d3。选择（'svg'）
.附加（“g”）
.attr（“类别”、“目标数量”）
.selectAll（'goalAmounts'）
.数据（数据）
u、 输入（）
.附加（“圆圈”）
//.attr（“转换”、“转换”（“+2000+”，“+50+”）
.attr（“r”，d=>金额（d.amt））
.合并（u）
.attr（“填充”，d=>d.color）
.attr（“cx”，d=>scX（d.x））
.attr（“cy”，d=>scY（d.y2））
u、 exit（）.remove（）
}
svg.append（“g”）
.attr（“转换”、“翻译”（“+50+”，“+（pxY-200）+”））
.电话（g）
.selectAll（“.tick text”）
.attr（“填充”，“#7a7a”）
svg.selectAll（“圆圈”）
.数据（数据）
.输入（）
.附加（“g”）
.attr（“类”、“圆”）
.附加（“圆圈”）
.attr（“转换”、“转换”（“+100+”，“+650+”）
.attr（“填充”、“白色”）
.attr（“笔划”，d=>d.color）
.attr（“笔划宽度”，“2px”）
.attr（“cx”，d=>scX（d.x））
.attr（“cy”，d=>scY（d.y2））
.attr（“r”，d=>rad（d.rad））；
svg.selectAll（“.domain”）
.attr（“笔划”，“bdbd”）
.attr（“笔划宽度”，“2px”）
.attr（“转换”、“转换”（“+50+”，“+150+”）
svg.selectAll（“.tick line”）
.attr（“笔划”，“bdbd”）
.attr（“笔划宽度”，“4px”）
.attr（“转换”、“转换”（“+50+”，“+150+”）
svg.selectAll（“.tick text”）
.attr（“字体大小”，20）
.attr（“转换”、“平移”（“+50+”，“+tickLabelOffset+”））
.attr（“字体大小”、“粗体”）
.attr（“dy”，“0.5em”）
d3.力模拟（数据）
.force（'charge'，d3.forceManyBody（））
.力（'中心'，d3.力中心（pxX/2，pxY/2））
.force（'碰撞'，d3.forceCollide（）.radius（函数d）{
返回d.amt
}))
.在（‘勾选’）上
改用
d3.forceX
和
d3.forceY
，以便将节点绘制到其预期位置。另外，
d3 force
填充节点的
x
和
y
属性，因此需要使用
d.x1
或其他方法
scX（d.x）
导致节点的巨大值


const数据=[{
x1:2020，
cx:0，
颜色：“69306D”，
scY:0，
y2:50，
拉德：10，
金额：5000
},
{
x1:2020，
cx:0，
颜色：“247BA0”，
scY:0，
y2:50，
拉德：10，
金额：5000
},
{
x1:2020，
cx:0，
颜色：“3F762C”，
y1:0，
y2:50，
拉德：10，
金额：5000
},
{
x1:2020，
cx:0，
颜色：“F25F5C”，
y1:0，
y2:50，
拉德：10，
金额：5000
},
{
x1:2022年，
cx:0，
颜色：“0C3957”，
y1:0，
y2:170，
拉德：10，
金额：5000
},
{
x1:2055，
cx:0，
颜色：“BF802F”，
y1:0，
y2:50，
拉德：10，
金额：15000
}
];
const maxYear=Math.max.apply（Math，data.map）（函数（o）{
返回o.x1；
}));
const svg=d3.选择（“svg”）；
常量pxX=svg.attr（“宽度”）；
常量pxY=svg.attr（“高度”）；
设tickLabelOffset=170；
让minDotX=Math.min.apply（Math，data.map）（函数（o）{
返回o.y1；
}))
如果（minDotX<-20）{
tickLabelOffset+=minDotX+20；
}
常量makeScale=（arr、存取器、范围）=>{
返回d3.scaleLinear（）
.域（d3.范围（arr、访问器））
.射程（射程）
.尼斯
}
const thiswear=新日期（）.getFullYear（）
让滴答声=[]；
for（让i=今年；id.x1[0，pxX-200]）；
const scX1=makeScale（数据，d=>d.x1[0，pxX-2020]）；
const scY=d3.scaleLinear（）.domain（[01100]）.range（[01100]）；
常数g=d3.axisBottom（scX）.tickValues(
tickTens.map（（tickVal）=>{
返回tickVal
})
)
常数rad=d3.scaleLinear（）
.域（d3.范围（数据，d=>d.rad））
.范围（[3,10]）；
常数金额=d3