在dc.js中正确显示别名的图例项目(无故障转换)

时间:2014-03-23 22:08:29

标签: d3.js legend transitions dc.js

我的数据有一个字段(让我们称之为Kind),出于内部目的,它是一个短字符串(短格式),但它有一个映射到相当冗长的字符串(长格式) ,用于演示。例如:

// Not the real values, but you get the idea...
var kind_map = {'c2a': "Collected Compound Allocations",
                'dee': "Digital Extrapolated Exponents", ...};

在我的可视化小部件中,有一个饼图,总结了与Kind相关的数据。由于长格式字符串是我打算显示的字符串,因此我已安排将它们从饼图中显示出来(请参阅this question)。但是,正如您将在此example fiddle中注意到的那样,在过渡期间,图例项会恢复为原始过滤器值,即短格式字符串。我想避免这种情况,但到目前为止还没有成功。我还尝试修改filterPrinterfilterHandler和其他人,但行为仍然存在。

我的代码如下:

cxf = crossfilter(raw_data); //raw_data comes from d3.csv, json, whatever
kind_D = cxf.dimension( function(d) { return d.Kind; } );
kind_G = kind_D.group().reduceSum( function(d) { return d.Value; });

kind_chart = dc.pieChart('#kind-chart');
kind_chart.width(a_width)
          .height(a_height)
          .radius(a_radius)
          .dimension(kind_D)
          .group(kind_G)
          .legend( dc.legend().x(this.groups_base_dim).y(50).gap(10) );

// Expand the group's legend with verbose group names from the JSON config
var kind_name_render = function(chart) {
        chart.selectAll(".dc-legend-item text")
             .html( function (d, i) {
                  return kind_map[d.name]; 
              });
    }
kind_chart.on("postRedraw", kind_name_render);
kind_chart.on("postRender", kind_name_render);

1 个答案:

答案 0 :(得分:1)

您可以使用2.0中的新data function将变换应用于该组返回的密钥。