d3.js - 使用 nvd3.js/d3.js，如何获得具有离散/非数字/非时间序列 X 轴值的散点图或折线图？

Question

例如，我想要一个看起来像这样的散点图：

   100|        X                                           o
      |                                      o
    60|
      |        o             X               X                 
    40|
      |
    20|                      o                             X
      |
     0|______________________________________________________________
             Apples        Carrots        Dragons        Monkies      

其中 X 和 o 是不同的数据集

Answer 1

关键是对 x 轴使用序数销售。序数刻度是通过调用构造的d3.scale.ordinal()。这domain将是您的标题数组（您可以map在数据数组上使用本机方法来动态提取标题）。需要一个与range数组长度相同的domain数组，以像素为单位指定与标题对应的每个 x 坐标。

在此处查看此示例：http: //tributary.io/inlet/5788637

您可以分叉它并尝试添加一个 yScale（在这种情况下，它将被构造，d3.scale.linear因为它是一个连续的数字刻度）并使 y 轴遵循与 x 轴类似的模式。