【问题标题】:d3 pie chart all black fill, d3.schemeCategory20c not being calledd3饼图全黑填充,d3.schemeCategory20c未被调用
【发布时间】:2018-09-21 05:22:26
【问题描述】:

由于这被标记为重复,所以让我澄清一下我的问题是 不是,我收到了一个 Uncaught TypeError: d3.schemeCategory20 错误,例如 post that is suggested事实上,如果您查看我的代码并且我正在以与接受的答案相同的方式拨打电话。 如果阅读我的问题,我的图表是填充颜色全是黑色,MY ISSUEd3.schemeCategory20c 数组似乎根本没有被调用。我没有错误我的方法有意外的输出。

我正在阅读 Barrett Clark数据可视化工具包一书,第一章。我已经更新了代码以反映 d3 v4 中的变化,但我的饼图用一种颜色呈现,这是我的 scaleOrdinal 分配

var color = d3.scaleOrdinal(d3.schemeCategory20c);

这是 json 调用:

$.getJSON('/residential/data', function(data) {
    totals = data.totals;
    var g = svg.selectAll('.arc').data(pie(d3.keys(totals))).enter()
      .append('g').attr('class', 'arc');

    g.append('path').attr('d', arc).style('fill', function(d) { return color(d.data); });

    g.append('text').attr('transform',
      function(d) { return 'translate('+ arc.centroid(d) +')'; }).attr('dy', '.35em')
      .style('text-anchor', 'middle').text(function(d) { return d.data; });
  });

这会呈现一个很棒的饼图,每个切片都用黑色填充,我尝试阅读文档但似乎找不到这个实现。我从其他 tuts 中挑选出这应该有效,但它没有。

【问题讨论】:

  • 根本不是重复的,如果您查看我的color 分配,我将d3.schemeCategory20c 作为d3.scaleOrdinal 中的参数传递,与您链接到的accepted answer 相同。我没有收到 Uncaught TypeError,我的问题是饼图的颜色都是黑色的,没有使用 d3.schemeCategory20c 的颜色。

标签: javascript jquery d3.js


【解决方案1】:

我的答案在Changes in D3 5.0 文档中找到。

D3 不再提供 d3.schemeCategory20* 分类配色方案。这 20 种配色方案存在缺陷,因为它们的分组设计可能错误地暗示数据中的关系:共享色调可能暗示编码数据是一组(超类别)的一部分,而相对亮度可能暗示有序。相反,D3 现在包含 d3-scale-chromatic,它实现了 ColorBrewer 的优秀方案,包括分类、发散、顺序单色调和顺序多色调方案。这些方案可用于离散和连续变体。

我正在寻找与 d3.schemeCategory20c 相关的问题,所以我一直在收到旧帖子,今天早上我安慰了 d3.schemeCategory20c(我应该做的事情不久前),发现它是未定义的。我想通了。

【讨论】:

    猜你喜欢
    • 2018-07-02
    • 2015-07-13
    • 2018-10-15
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2015-10-02
    • 1970-01-01
    • 2023-03-11
    相关资源
    最近更新 更多