javascript - 如何将雷达图的比例从百分比修改为数值

Question

我正在基于 this example 创建雷达图。但是我的数据没有以% 形式给出。它以分钟为单位给出。问题是比例尺自动转换为%，数据乘100时我在代码中找不到地方。

这是我的数据集:

      [
        {axis:"AAA",value:2.56},
        {axis:"BBB",value:1.27},
        {axis:"CCC",value:2.01},
        {axis:"DDD",value:2.71}
      ],[
        {axis:"AAA",value:2.28},
        {axis:"BBB",value:1.05},
        {axis:"CCC",value:1.81},
        {axis:"DDD",value:2.30}
      ]
    ];

Answer 1

数据没有乘以 100，而是在 RadarChart.js 中格式化为百分比:

var Format = d3.format('%');

此处应用的格式为网格:

.text(Format((j+1)*cfg.maxValue/cfg.levels));

这里是鼠标悬停:

.text(Format(d.value))

此外，最外层的值(maxValue)在 script.js 中设置:

var mycfg = {
  w: w,
  h: h,
  maxValue: 0.6,
  levels: 6,
  ExtraWidthX: 300
}

要显示非百分比数据，您可以重新定义数字格式，例如不指定任何内容:

var Format = d3.format("");

如果您对数字格式不感兴趣，您可以完全删除对它的引用。您可以简单地使用 d.value，而不是 Format(d.value)。当然，你也必须有类似的最大值。

决定如何设置或不设置数字格式后，您仍然需要重置 maxValue 以使用您的数据集。

<小时/>

请注意，如果您的轴是分钟，则 d3.format 可能不是格式化值的最合适方法。 D3.time.format 可能会更好。或者您可以创建一个自定义函数来输出分钟和秒(如果需要)。