dc.js onClick Listener Not Working

问题

I'm having trouble getting an onClick listener to work with a dc.barChart. According to this thread, clickable charts should have an onClick listener now. However, I've tried both chart.onClick = function and chart.on("click", function) without any luck. Below is the code I've tried to test whether the listener is working or not.

var hubChart = dc.barChart("#hub-chart");

var dateHub = dateCF.dimension(function(d){ return d.hub;}),
    dateHubs = dateHub.group().reduceSum(function(d){
        return d.total;
    });

var minHub = dateHub.bottom(1)[0].hub;
var maxHub = dateHub.top(1)[0].hub;

hubChart.width(0.40 * window.innerWidth)
    .height(350)
    .dimension(dateHub)
    .group(dateHubs)
    .x(d3.scale.linear().domain([minHub, maxHub]))
    .elasticY(true)
    .elasticX(true)
    .brushOn(false);

hubChart.on("preRedraw", function (chart) {
    chart.rescale();
});
hubChart.on("preRender", function (chart) {
    chart.rescale();
});

hubChart.onClick = function(chart){
    console.log(true);
}

hubChart.on("click", function (chart) {
    console.log(true);
});

hubChart.render();

This should cause true to print out to the console whenever the chart is clicked, but nothing's happening.

回答1:

It seems like onClick was only enabled for bar charts with an ordinal X axis. As long as you are willing to replace the built-in click behavior, you can accomplish the same thing using dc's access to d3 selectors, in a renderlet:

chart.on("renderlet.somename", function(chart) {
  chart.selectAll('rect').on("click", function(d) {
    console.log("click!", d);
  });
});

I opened an issue to track the question/request: https://github.com/dc-js/dc.js/issues/633

来源：https://stackoverflow.com/questions/24642675/dc-js-onclick-listener-not-working