0

我以在 D3.js 中完成的雷达/蜘蛛图为例。这是codepen中的代码。如果我更改我拥有的两个数据集之一的对象的顺序,图表就会更改。在这个例子中,我有两个数据集的轴以相同的顺序,它正确地绘制了图表。

       //Data 
    var d = [
  [{
    axis: "Email",
    value: 0.59
  }, {
    axis: "Social Networks",
    value: 0.56
  }, {
    axis: "Internet Banking",
    value: 0.42
  }, {
    axis: "News Sportsites",
    value: 0.34
  }, {
    axis: "Search Engine",
    value: 0.48
  }, {
    axis: "View Shopping sites",
    value: 0.14
  }, {
    axis: "Paying Online",
    value: 0.11
  }, {
    axis: "Buy Online",
    value: 0.05
  }, {
    axis: "Stream Music",
    value: 0.07
  }, {
    axis: "Online Gaming",
    value: 0.12
  }, {
    axis: "Navigation",
    value: 0.27
  }, {
    axis: "App connected to TV program",
    value: 0.03
  }, {
    axis: "Offline Gaming",
    value: 0.12
  }, {
    axis: "Photo Video",
    value: 0.4
  }, {
    axis: "Reading",
    value: 0.03
  }, {
    axis: "Listen Music",
    value: 0.22
  }, {
    axis: "Watch TV",
    value: 0.03
  }, {
    axis: "TV Movies Streaming",
    value: 0.03
  }, {
    axis: "Listen Radio",
    value: 0.07
  }],

  [{
    axis: "Email",
    value: 0.48
  }, {
    axis: "Social Networks",
    value: 0.41
  }, {
    axis: "Internet Banking",
    value: 0.27
  }, {
    axis: "News Sportsites",
    value: 0.28
  }, {
    axis: "Search Engine",
    value: 0.46
  }, {
    axis: "View Shopping sites",
    value: 0.29
  }, {
    axis: "Paying Online",
    value: 0.11
  }, {
    axis: "Buy Online",
    value: 0.14
  }, {
    axis: "Stream Music",
    value: 0.05
  }, {
    axis: "Online Gaming",
    value: 0.19
  }, {
    axis: "Navigation",
    value: 0.14
  }, {
    axis: "App connected to TV program",
    value: 0.06
  }, {
    axis: "Offline Gaming",
    value: 0.24
  }, {
    axis: "Photo Video",
    value: 0.17
  }, {
    axis: "Reading",
    value: 0.15
  }, {
    axis: "Listen Music",
    value: 0.12
  }, {
    axis: "Watch TV",
    value: 0.1
  }, {
    axis: "TV Movies Streaming",
    value: 0.14
  }, {
    axis: "Listen Radio",
    value: 0.06
  }]
];

但是,如果我更改其中一个元素的顺序,例如,第一个数据集的前两个元素,图表会在不应该发生变化时发生变化。

//Data 
var d =
[
      [   {
            axis: "Social Networks",
            value: 0.56
          },
          {
            axis: "Email",
            value: 0.59
          }, ...
      ],
      [  {
           axis: "Email",
           value: 0.48
         }, 
         {
           axis: "Social Networks",
           value: 0.41
         }...
     ]
]

在图表的第二种情况下,“电子邮件”取 0.41 而不是 0.48 作为值,“社交网络”也是如此。

尽管有顺序,如何正确绘制图表?轴的名称还不够吗?

4

0 回答 0