如何让图表(饼图）在dc.js，d3和交叉过滤器(节点）中的.csv字符串字段上进行分组.js.js

How can you get a chart (Pie Chart) to Group on a .csv string field in dc.js, d3.js and crossfilter.js (Node)

本文关键字：js csv 中的 节点 过滤器 字符串 字段 饼图 d3 dc      更新时间：2023-09-26

我有几个维度和组成功运行。 但是，我有一个图表（饼图），我需要将其分组到一个域名字符串上，例如 bing.com。 每个域名都被绝对解析为 xxxx.xxx，数据非常干净。我正在使用 dc.js 和交叉过滤器.js。饼图将绘制，数据正确，但问题是该组不会链接到其他组，不会正确重绘并在 Safari 和 Firefox 中抛出 NaN 错误，如下所示： 

[Log] "google.com" (simple_vis.js, line 223) 
      *(This is the:console.log(chart.filter());)*
      [Log] [NaN, NaN] (simple_vis.js, line 242) 
      *(This is the same on the next chart.)*
      [Error] Error: Invalid value for <rect> attribute x="NaN"
      setAttribute ([native code], line 0)
      attrConstant (d3.js, line 578)
      (anonymous function) (d3.js, line 868)
      d3_selection_each (d3.js, line 874)
      each (d3.js, line 867)
      attr (d3.js, line 567)
      redrawX (d3.js, line 8120)
      (anonymous function) (d3.js, line 8050)
      (anonymous function) (d3.js, line 868)
      d3_selection_each (d3.js, line 874)
      each (d3.js, line 867)
      brush (d3.js, line 8029)
      call (d3.js, line 881)
      redrawBrush (dc.js, line 2149)
      doRedraw (dc.js, line 2276)
      redraw (dc.js, line 1033)
      redrawAll (dc.js, line 167)
      (anonymous function) (dc.js, line 1145)
      trigger (dc.js, line 504)
      onClick (dc.js, line 1143)
      (anonymous function) (dc.js, line 5305)
      onClick (dc.js, line 3283)
      (anonymous function) (d3.js, line 1036

以下是数据示例、维度和组以及图表：

数据：使用 ref_domain 作为组

capture_date、event_type、vio_type ref_domain

2013-11 11T15：09：45Z， "违规"， "3"， "bing.com"

维度和组：

var startValue = ndx.dimension(function(d) {
return d.ref_domain;
 });
 var startValueGroup = startValue.group();
 startValueGroup.top(Infinity).forEach(function(p, i) {
    console.log(p.key + ": " + p.value);
 });

图表：

         pieChart.width(200)
        .height(200)
        .transitionDuration(1500)       
        .dimension(startValue)
        .group(startValueGroup)
        .radius(90)
        .minAngleForLabel(0)        
        .label(function(d) { return d.data.key; })
        //.valueAccessor(function(d) {return d.ref_domain;})
        .on("filtered", function (chart) {
            dc.events.trigger(function () {
            if(chart.filter()) {
            console.log(chart.filter());
            volumeChart.filter([chart.filter()-.25,chart.filter()-(-0.25)]);
                }
                else volumeChart.filterAll();
            });
        });

任何帮助将不胜感激。 谢谢！

看起来过滤器与字符串数据冲突：

on("filtered", function (chart) {
            dc.events.trigger(function () {
            if(chart.filter()) {
            console.log(chart.filter());
            **volumeChart.filter([chart.filter()-.25,chart.filter()-(-0.25)]);**
                }
                else volumeChart.filterAll();

应更正为：

volumeChart.filter();

感谢任何烧毁任何周期的人。我真的很感谢这个网站为世界所做的一切。

相关文章：