Wrapper for hooking up other d3 visualizations to dc.js?

[Jeff Friesen]

As I consider the data I'm working with, I keep considering other visualization options that d3 can do, but dc.js doesn't yet do. 

Let's assume I can make a d3 visualization from the same crossfilter object other dc.js charts are accessing. Is there a simple way to hook up the d3 visualization so it responds to brushing the other dc.js charts (and maybe vice-versa)? 

I'm sure it can be done...but how much work is it and are there examples I can follow? 

Or does this make sense as a feature? So for example, create a dc.js wrapper chart type that can wrap d3.js visualization objects, so that each can be coordinated on filter changes?

Thanks!

[Matt Traynham]

I'm new to these forums, but an avid front end engineer and just picked up dc.js a few weeks ago. It looks as if dc is global, so if you include it, I don't see any reason why you couldn't do:

dc.myChart = function(div, [chartGroup]) {

}

Maybe just follow how one of the other charts works in a prototypical fashion extending functionality from BaseChart.

[Nick Zhu]

Its actually quite straightforward. Take a look the simplest widget in dc data-count:

https://github.com/NickQiZhu/dc.js/blob/master/src/data-count.js

This is the minimal requirement to be a valid chart for dc.js. When created this chart instance will be automatically registered to dc core hence be notified when other dimensions get filtered. When user interact with your graph simply make sure you invoke the filter function, for example react to a click:

 _chart.onClick = function (d) {
        var filter = d.key;
        dc.events.trigger(function () {
            _chart.filter(filter);
            dc.redrawAll(_chart.chartGroup());
        });
    };

Make sure you use the dc.events.trigger helper to provide event throttling for better performance especially when brush is involved.

Nick 

[jinges]

If got the same thing in mind (building d3 charts that respond to dc.js brushing). But I don't really get my head around the code you posted Nick. Are there any really basic examples in a working environment where I could learn how to do it? Or some more hints for someone not really experienced in coding.

Thanks!