d3 轴位于 [0,1] 域

Question

我正在用 d3 绘制一个简单的（4 个选项）雷达图。但即使使用手动定义的比例，我的轴在像素大小（长度）和标记数字方面都在域 [0,1] 上绘制。

代码如下：

var scl = d3.scale.linear().domain([0, 100]).range([0, 100]);
var x1Axis = d3.svg.axis(scl);

d3.select('#radarWrapper svg')
  .append('g')
  .attr("class", "axis")
  .attr("transform", "translate(" + (width/2) + "," + (height/2) + ")")
  .call(x1Axis);

这在 svg 的中心绘制了一个愚蠢的单点比例尺，与定义的比例尺没有任何关系：

Answer 1

要使用的比例没有设置为 d3.svg.axis() 的构造函数的参数（它不接受任何参数），而是通过 .scale() method:

var x1Axis = d3.svg.axis().scale(scl);

完成演示 here。

d3 轴位于 [0,1] 域

d3 axis sits in [0,1] domain

javascript

svg

d3.js