使用dc.js的Geo choropleth地图和饼图crossfiltering

Question

使用我希望能够点击任何州的代码，饼图应该描绘该州的男性和女性的数量。

gender.csv具有以下模式

gender,age,state
Male,9,1
Male,10,1
Male,18,2
Male,20,0
Male,22,1
Male,30,1
Male,40,1
Male,45,2
Male,50,2
Male,55,2
Male,70,0
Male,80,0
Male,90,0
Male,100,0
Male,101,0
Female,11,0
Female,15,0
Female,20,0

us-states.json具有以下模式

{"type":"FeatureCollection","features":[ {"type":"Feature","id":"01","properties":{"name":"AL"},"geometry":{"type":"Polygon","coordinates":[[[-87.359296,35.00118],[-85.606675,34.984749],[-85.431413,34.124869],[-85.184951,32.859696],[-85.069935,32.580372],[-84.960397,32.421541],[-85.004212,32.322956],[-84.889196,32.262709],[-85.058981,32.13674],[-85.053504,32.01077],[-85.141136,31.840985],[-85.042551,31.539753],[-85.113751,31.27686],[-85.004212,31.003013],[-85.497137,30.997536],[-87.600282,30.997536],[-87.633143,30.86609],[-87.408589,30.674397],[-87.446927,30.510088],[-87.37025,30.427934],[-87.518128,30.280057],[-87.655051,30.247195],[-87.90699,30.411504],[-87.934375,30.657966],[-88.011052,30.685351],[-88.10416,30.499135],[-88.137022,30.318396],[-88.394438,30.367688],[-88.471115,31.895754],[-88.241084,33.796253],[-88.098683,34.891641],[-88.202745,34.995703],[-87.359296,35.00118]]]}},

码

d3.csv("data/gender.csv", function (data) {
            d3.json("data/us-states.json", function (json){


                var ndx = crossfilter(data);

                var stateDim = ndx.dimension(function (d) { return d.state; });
                var genderDim = ndx.dimension(function(d) { return d.gender; });
                var ageDim = ndx.dimension(function(d) { return d.age; });

                var state = stateDim.group();
                var gender = genderDim.group(); 
                var age = ageDim.group();

                var pie = dc.pieChart('#pie');
                var usmap = dc.geoChoroplethChart("#map");

                //create pie to show gender
                pie
                    .width(180)
                    .height(180)
                    .radius(80)
                    .dimension(genderDim)
                    .group(gender)
                    .renderLabel(true)
                    .innerRadius(10)
                    .transitionDuration(500)
                    .colorAccessor(function (d, i) { return d.value; });

                //display US map                    
                usmap
                    .width(900)
                    .height(500)
                    .dimension(stateDim)
                    .group(state)
                    .colors(["rgb(20,202,255)","rgb(144,211,035)"])
                    .overlayGeoJson(json.features, "name", function (d) { return d.properties.name; })      


                // at the end this needs to be called to actually go through and generate all the graphs on the page.
                dc.renderAll();
            }); 
        });

当我点击任何状态时，饼图显示为空。此外，地图上的工具提示显示状态首字母和未定义，例如：AL: undefined

我哪里错了？

非常感谢任何帮助。谢谢。