Question

我试图绘制一个D3折线图，其Y轴在右边，而不是在左边。我使用了var yAxis = d3.axisRight(y);，但是此代码段在右侧绘制了我的标签，而不是将轴向右移动。我使用的D3版本是v4.9.1。任何帮助表示赞赏

Answer 1

在D3中，无论您使用什么轴生成器......

axisBottom（）;
axisTop（）;
axisRight（）;
axisLeft（）;

...轴始终在原点处呈现，即(0,0)。这是API中的第一行：

无论方向如何，轴始终都会在原点处渲染。

因此，您必须翻译轴。

看看这个演示。第一个轴没有翻译，第二个轴没有：

var svg = d3.select("svg");
var scale = d3.scaleLinear().range([10, 140]);
var axis = d3.axisRight(scale);
var g1 = svg.append("g").call(axis);
var g2 = svg.append("g").attr("transform", "translate(270,0)").call(axis);

<script src="https://d3js.org/d3.v4.min.js"></script>
<svg></svg>

D3右侧只有一个Y轴用于绘制折线图

1 个答案: