dc.js - 工具提示添加另一个项目?

时间:2015-01-29 10:09:12

标签: d3.js dc.js

如果我有以下数据 -

item        count   type
----------------------------------
apple      1        fruit
orange     2        fruit
carrot     1        vegetable
apple      2        fruit

然后我有以下Dimension和Group

var itemDim = facts.dimension(function (d) {return d.item;});
var itemDimGroup = itemDim.group().reduceSum(function (d) { return d.count; });

显示此数据的行图的工具提示包含项目和计数。

我的问题是,是否可以将type添加到工具提示中?

例如,工具提示将保留以下内容(类型只是每个项目的一个值) -

apple's : 3
type : fruit

1 个答案:

答案 0 :(得分:1)

尝试添加标题:

           .title(function (p) {

                return [
                       p.value.item + " : " + p.value.count,
                       "type: " + p.value.type
                       ]
                       .join("\n");
            })
           .renderTitle(true)

修改

var itemDimGroup = itemDim.group().reduceSum(function (d) { return [
            d.count,
            d.key
            ]
             .join("\n");
});


barChart
  .width(300)
  .height(200)

  .transitionDuration(500)
  .dimension(itemDim)
  .group(itemDimGroup)
  .brushOn(false)
  .barPadding(0.2)
  .xAxisLabel("")
  .yAxisLabel("")
  .xUnits(dc.units.ordinal)
  .x(d3.scale.ordinal())
  .title(function (p) {
    console.log(p);
    return [
             p.key + " : " + String(p.value),
            "type: " + p.key
            ]
             .join("\n");
            })
  .renderTitle(true)
;