3

是否可以通过使用 dc.js 选择表格元素来过滤数据？

我正在用我自己的数据处理 nasdaq 示例。

在数据表中，我有自己的名为 name 的列：

.columns([
                    function (d) {
                        return d.date;
                    },
                    function (d) {
                        return d.name
                    },

 .....

我的交叉过滤器尺寸和组设置如下，我认为是正确的。

    var name = ndx.dimension(function (d) {
            return d.name
        });
        var nameGroup = name.group();

编辑 这是名称为 dc-table-column_2 的 html

<table class="table table-hover dc-data-table dc-chart">
<thead>
<tbody>
<tr class="dc-table-group info">
 <tr class="dc-table-row">
 <td class="dc-table-column _0">05/01/2012</td>
 <td class="dc-table-column _1">12/31/9999</td>
 <td class="dc-table-column _2">Eric</td>
 </tr>
</tbody>

当有人单击表中的名称时，我想根据此名称过滤所有图表并在另一个 div 中呈现一些元数据（与 d3 或 crossfilter 无关）。我找不到实现这一目标的示例。我试图使用 d3s onClick() 事件，但没有成功。有人可以指出我的解决方案吗？

4

1 回答 1

1

在没有看到您尝试在哪里实现点击或 DOM 的情况下，我建议使用以下一般结构来实现 onClick：

d3.selectAll("DOM element associated with names in the table").on("click", function () {

    //this line to store clicked item value for use later 
    var value = this.value; 

    d3.select("ids of charts").
    set properties to filter here using stored value

    d3.select("unrelated DOM id").text(stuff you want rendered);

或者，您可以将 html onclick 属性用于非 d3 相关内容并d3.selectAll().on("click")过滤您的表格。

有关似乎是相关问题的信息，请参见此处：

使用 Crossfilter 和 D3 重绘直方图

或者在这里我做了一些概念上类似的事情：

http://www.ryansloan.org/energapp/app.html

于 2013-06-07T05:38:33.940 回答