D3.js D3散点图y轴编号显示不完整

我是D3新手，我正在用它做一个散点图。代码如下：

var dataset = [[5, 20], [480, 90], [250, 50], [100, 33], [330, 95],[410, 12], [475, 44], [25, 67], [85, 21], [220, 88]];
var margin = {top: 20, right: 20, bottom: 20, left: 20},
    width = +400 - margin.left - margin.right,
    height = +400 - margin.top - margin.bottom

var svg = d3.select("svg");
var xScale = d3.scaleLinear()
               .domain([0, d3.max(dataset, function(d) { return d[0]})])
               .range([20, 380]);
var yScale = d3.scaleLinear()
               .domain([0, d3.max(dataset, function(d) { return d[1]})])
               .range([380, 20]);
svg.selectAll("circle") 
   .data(dataset)  
   .enter().append("circle")
   .attr("cx", function(d) {return xScale(d[0]); })  
   .attr("cy", function(d) {return yScale(d[1]); }) 
   .attr("r", 5);

var yAxis = d3.axisLeft()
              .scale(yScale)
              .ticks(10);
svg.append("g")
   .attr("class","axis")
   .attr("transform", "translate(" + margin.left + " ,0)")
   .call(yAxis);

我得到：

---

因此，y轴上的数字被阻止，因为没有足够的左边距空间。我知道我可以改变字体大小，但是有没有其他方法可以解决这个问题？我试图改变左保证金的值，但它只是变成了一团混乱。提前谢谢

现在，您的范围已硬编码：

var xScale = d3.scaleLinear()
    .range([20, 380]);

var yScale = d3.scaleLinear()
    .range([380, 20]);

因此，您对

边距
对象所做的任何更改都不会对点产生影响

解决方案：使用
margin
对象设置范围：

var xScale = d3.scaleLinear()
    .range([margin.left, width - margin.right]);

var yScale = d3.scaleLinear()
    .range([height - margin.bottom, margin.top]);

这样，图表可以动态地适应您在页边距上所做的任何更改。这是一个演示，有
页边距。左：50
：


var数据集=[
[5, 20],
[480, 90],
[250, 50],
[100, 33],
[330, 95],
[410, 12],
[475, 44],
[25, 67],
[85, 21],
[220, 88]
];
var保证金={
前20名，
右:20,，
底数：20，
左：50
},
宽度=400，
高度=400；
var svg=d3.选择（“主体”）
.append（“svg”）
.attr（“宽度”，宽度）
.attr（“高度”，高度）；
var xScale=d3.scaleLinear（）
.domain（[0，d3.max（数据集，函数（d））{
返回d[0]
})])
.范围（[margin.left，width-margin.right]）；
var yScale=d3.scaleLinear（）
.domain（[0，d3.max（数据集，函数（d））{
返回d[1]
})])
.范围（[高度-边距.底部，边距.顶部]）；
svg.selectAll（“圆圈”）
.数据（数据集）
.enter（）.append（“圆”）
.attr（“cx”，功能（d）{
返回xScale（d[0]）；
})
.attr（“cy”，函数（d）{
返回yScale（d[1]）；
})
.attr（“r”，5）；
var yAxis=d3.axisLeft（）
.刻度（yScale）
.蜱（10）；
svg.append（“g”）
.attr（“类”、“轴”）
.attr（“变换”、“平移”（+margin.left+”，0））
.呼叫（yAxis）