Как мне получить d3.scaleOrdinal - PullRequest
Новая
       28

Как мне получить d3.scaleOrdinal

0 голосов
/ 29 марта 2020

У меня есть этот - я думаю, относительно простой - фрагмент кода. Он работает так, как я хочу: я получаю диаграмму ap ie с делением в соответствии с basedata. Но я не могу отобразить разработанную мной цветовую схему. Первоначально у меня были basedata в вызове scaleOrdinal, но это не имеет значения. Как получить цвета для отображения соответствующей записи в basedata? 

  const svgContainer = d3.select("#d3").append("svg")
    .attr("viewBox", [-60, -60, 120, 120])
    .attr("width", 120)
    .attr("height", 120)
    .attr("style", "display: inline; float: left");

  // Generate the pie
  var basedata = [50, 1.7, 1.7, 1.7, 39.8, 1.7, 1.7, 1.7];

  var myColor = d3.scaleOrdinal()
    .domain([   50,        1.7,        1.7,          1.7,         39.8,          1.7,         1.7,          1.7    ])
    .range( ["yellow", "royalblue", "mediumblue", "darkblue", "midnightblue", "darkblue", "mediumblue", "royalblue"]);

  const arcs = d3.pie()
    .startAngle(-0.5 * Math.PI)
    .sort(null)(basedata);

  const arc = d3.arc()
    .innerRadius(0)
    .outerRadius(120 / 2 - 1);

  const pie = d3.select("svg").append("g")
      .attr("stroke", "black")
    .selectAll("path")
    .data(arcs)
    .join("path")
      .attr("d", arc)
      .attr("fill", function (d) { return myColor(d) });

1 Ответ

0 голосов
/ 29 марта 2020

Я нашел ответ здесь .

Не используйте scaleOrdinal. Заменить команду заполнения на: .attr("fill", function (d, i) { return myColor[i] })

...