Изменение цвета линии на радиолокационной карте Anychart - PullRequest
Новая
       29

Изменение цвета линии на радиолокационной карте Anychart

0 голосов
/ 11 июня 2018

Можно ли добавить цвет к линиям на следующей радиолокационной карте?enter image description here

anychart.onDocumentReady(function() {

  // chart type
  var chart = anychart.radar();

  // chart title
  chart.title().text('Spending');

  // series type and data set
  chart.line([
    {x: "Administration", value:"22"},
    {x: "Sales", value:"34"},
    {x: "Marketing", value:"16"},
    {x: "Research", value:"12"},
    {x: "Support", value:"38"},
    {x: "Development", value:"47"}
  ]);

  // draw chart
  chart.container('container').draw();
});

Я пытался добавить fill, но, похоже, он не работает 

chart.line([
  {x: "Administration", value:"22", fill: "#color-code"},
  {x: "Sales", value:"34", fill: "#color-code"},
  {x: "Marketing", value:"16", fill: "#color-code"},
  {x: "Research", value:"12", fill: "#color-code"},
  {x: "Support", value:"38", fill: "#color-code"},
  {x: "Development", value:"47", fill: "#color-code"}
]);

1 Ответ

0 голосов
/ 11 июня 2018

Это ряд линий на радиолокационном графике, как Радарный график: Линия говорит.Таким образом, следует Линейный график настройки серии: и вам нужно установить Штрих , а не заполнить, например: 

  line = chart.line([
    {x: "Administration", value:"22"},
    {x: "Sales", value:"34"},
    {x: "Marketing", value:"16"},
    {x: "Research", value:"12"},
    {x: "Support", value:"38"},
    {x: "Development", value:"47"}
  ]);

  line.stroke('red 3', 2, 2);

Как показано в этом Линейная диаграмма радара с примером настроек штрихов : 

  chart.palette(["Black", "Green"]);

В качестве альтернативы вы можете использовать Палитра AnyChart , если вам нужно несколько разных линий: Радарная диаграмма с несколькими линиями AnyChart

А также фрагмент базового образца: 

anychart.onDocumentReady(function() {

  // chart type
  var chart = anychart.radar();

  // chart title
  chart.title().text('Spending');
  
  // set palette
  chart.palette(["Black", "Green"]);

  // series type and data set
  chart.line([
    {x: "Administration", value:"22"},
    {x: "Sales", value:"34"},
    {x: "Marketing", value:"16"},
    {x: "Research", value:"12"},
    {x: "Support", value:"38"},
    {x: "Development", value:"47"}
  ]);
  
  // series type and data set
  chart.line([
    {x: "Administration", value:"32"},
    {x: "Sales", value:"44"},
    {x: "Marketing", value:"46"},
    {x: "Research", value:"42"},
    {x: "Support", value:"48"},
    {x: "Development", value:"57"}
  ]);
  

  // draw chart
  chart.container('container').draw();
});
html, body, #container {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
}
<script src="https://cdn.anychart.com/releases/8.2.1/js/anychart-bundle.min.js"></script>
<div id="container"></div>
...