Проблемы с осью паука / радиолокационной карты D3.js - PullRequest
Новая
       24

Проблемы с осью паука / радиолокационной карты D3.js

0 голосов
/ 23 мая 2018

Я беру пример диаграммы радара / паука, сделанной в 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, и то же самое происходит с «социальными сетями».

Как правильно нарисовать график, несмотря на порядок?Не достаточно ли названия осей?

...