为什么使用d3js生成的轴与示例有很大不同，即使代码相似？

Question

我刚刚开始学习D3 2个月，当我尝试将它应用于项目以生成一些图表时，我发现我生成的轴与大多数示例中的轴明显不同。

而不是像示例中那样具有明显刻度的优雅细轴，它似乎是一个丑陋的巨大黑条。 这是我的相对于轴的代码：

for..of

结果是这样的：

，您可以与众多示例中的一个进行比较，例如mbostock’s block #7621155: Natural Log Scale。

所以有人能告诉我d3.js中是否有一些隐藏机制决定轴应该是什么样的？

非常感谢!!

Answer 1

隐藏机制是CSS：）

将这些添加到您的CSS

.line {
  fill: none;
  stroke: steelblue;
  stroke-width: 1.5px;
}

.axis--x text {
  font: 10px sans-serif;
}

.axis--y text {
  font: oblique 15px Georgia, serif;
}

.axis path,
.axis line {
  fill: none;
  stroke: #000;
  shape-rendering: crispEdges;
}

希望这有帮助！