DC.js Choropleth filtering Issue

Question

I am trying to filter data on my choropleth chart from a bargraph. Strange thing is that it is not showing correct value on selecting a bar from the accompanying bar chart.

Here is the jsfiddle: https://jsfiddle.net/anmolkoul/jk8LammL/ The script code begins from line 4794

If i select WIN004 from the bar chart, it should highlight only five states and the tooltip should reflect the values for the data. Some states are highlighted for whom WIN004 does not exist.

I changed the properties of the choropleth from

.colors(d3.scale.quantize().range(["#F90D00", "#F63F00", "#F36F01", "#F09E01", "#EDCB02", "#DDEA03", "#ADE703", "#7EE404", "#50E104", "#24DE05", "#05DB11"]))
.colorDomain([-1, 1])

To

.colors(d3.scale.linear().range(["green", "white", "red"]))
 .colorDomain([-2, 0, 2])

But i get a lot of white states where its hard to discern what has been highlighted. The tool tip for some white-ed-out states show -0.00 :/ Here is the fiddle http://jsfiddle.net/anmolkoul/jk8LammL/1/

So i guess either its a problem with my color range or how my data is getting parsed.

I would ideally like to specify the data ranges in the .colorDomain based on the top and bottom values of the riskIndicator dimension. My functions are not working though. Should i use d3.max or riskIndicator.top here?

EDIT: I got the color domain dynamic by using the min and max values but still the graph is not performing as expected? Could this be an issue with the geochoropleth chart? I further took a working geochoropleth example and ported my data to it and even that gave me the same issue of representing data incorrectly. I thoughit could be a data problem but i validated using a couple of good BI tools and their map charts displayed data correctly.

Could this be an issue with the dc choropleth?

Thank you. Anmol

Answer 1

This has the same root cause as the issue in this question:

Crossfilter showing negative numbers on dc.js with no negative numbers in the dataset

In short, floating point numbers don't always cancel out to zero when added and subtracted. This "fake group" will ensure they snap to zero when they get close:

function snap_to_zero(source_group) {
    return {
        all:function () {
            return source_group.all().map(function(d) {
                return {key: d.key, 
                        value: (Math.abs(d.value)<1e-6) ? 0 : d.value};
            });
        }
    };
}

Added it to the FAQ!