Tumukunde Arnold
Tumukunde Arnold

Reputation: 186

Uncaught TypeError: Cannot read property 'forEach' of undefined from d3/dc

queue()
.defer(d3.json, "/uganda/report")
.defer(d3.json, "static/geojson/uganda_districts.json")
.await(makeGraphs);


function makeGraphs(error, reportJson,districtsJson){

    //Clean reportJson data

    var ugandaReport = reportJson;
    var dateFormat = d3.time.format("%d/%m/%Y");
    ugandaReport.forEach(function(d) {
        d["EVENT_DATE"] = dateFormat.parse(d["EVENT_DATE"]);
        d["EVENT_DATE"].setDate(1);
        d["FATALITIES"] = +d["FATALITIES"];
    });

    //Create a Crossfilter instance
    var ndx = crossfilter(ugandaReport);

    //Define Dimensions
    var dateDim = ndx.dimension(function(d) { return d["EVENT_DATE"]; });
    var actorsDim = ndx.dimension(function(d) { return d["ACTOR1"]; });
    var sourceDim = ndx.dimension(function(d) { return d["SOURCE"]; });
    var DistrictDim = ndx.dimension(function(d) { return d["LOCATION"]; });
    var totalFatalitiesDim  = ndx.dimension(function(d) { return d["FATALITIES"];

    });


    //Calculate metrics
    var numActorsByDate = dateDim.group();
    var numFatalitiesByActorsType = actorsDim.group();
    var numReportsBySource = sourceDim.group();
    var totalFatalitiesByDistrict = DistrictDim.group().reduceSum(function(d) {
        return d["FATALITIES"];
    });

    var all = ndx.groupAll();
    var totalfatalities = ndx.groupAll().reduceSum(function(d) {return d["FATALITIES"];});

    var max_dist = totalFatalitiesByDistrict.top(1)[0].value;

    //Define values (to be used in charts)
    var minDate = dateDim.bottom(1)[0]["EVENT_DATE"];
    var maxDate = dateDim.top(1)[0]["EVENT_DATE"];

    //Charts
    var timeChart = dc.barChart("#time-chart");
    var actorsTypeChart = dc.rowChart("#actors-type-row-chart");
    var sourceLevelChart = dc.rowChart("#source-level-row-chart");
    var ugChart = dc.geoChoroplethChart("#ug-chart");
    var numberActorsND = dc.numberDisplay("#actors-projects-nd");
    var totalFatalitiesND = dc.numberDisplay("#total-fatalities-nd");

    numberActorsND
        .formatNumber(d3.format("d"))
        .valueAccessor(function(d){return d; })
        .group(all);

    totalFatalitiesND
        .formatNumber(d3.format("d"))
        .valueAccessor(function(d){return d; })
        .group(totalfatalities)
        .formatNumber(d3.format(".3s"));

    timeChart
        .width(600)
        .height(160)
        .margins({top: 10, right: 50, bottom: 30, left: 50})
        .dimension(dateDim)
        .group(numActorsByDate)
        .transitionDuration(500)
        .x(d3.time.scale().domain([minDate, maxDate]))
        .elasticY(true)
        .xAxisLabel("Year")
        .yAxis().ticks(4);

    actorsTypeChart
        .width(300)
        .height(250)
        .dimension(actorsDim)
        .group(numFatalitiesByActorsType)
        .xAxis().ticks(4);

    sourceLevelChart
        .width(300)
        .height(250)
        .dimension(sourceDim)
        .group(numReportsBySource)
        .xAxis().ticks(4);


    ugChart.width(1000)
        .height(330)
        .dimension(stateDim)
        .group(totalFatalitiesByDistrict)
        .colors(["#E2F2FF", "#C4E4FF", "#9ED2FF", "#81C5FF", "#6BBAFF", "#51AEFF", "#36A2FF", "#1E96FF", "#0089FF", "#0061B5"])
        .colorDomain([0, max_dist])
        .overlayGeoJson(districtsJson["features"], "districts", function (d) {
            return d.properties.name;
        })
        .projection(d3.geo.albers()
                    .scale(600)
                    .translate([340, 150]))
        .title(function (p) {
            return "District: " + p["key"]
                    + "\n"
                    + "Total Fatalities: " + Math.round(p["value"]) + " $";
        })

    dc.renderAll();

};

That's my js file. It get's the json data from the url("/uganda/report") above. When i navigate to the url i can see the json but for some reason the app has failed to display the graphs or map and is pushing out

Uncaught TypeError: Cannot read property 'forEach' of undefined

to the console. Am newbie to d3 so any assistance would be greatly appreciated.

This is some of the json i get for my "/uganda/report"

[{"SOURCE": "Africa Research Bulletin Vol. 34 No. 1, 1997", "FATALITIES": 4, "LOCATION": "Gulu", "ACTOR1": "Military Forces of Uganda (1986-)", "YEAR": 1997, "EVENT_DATE": "01/01/1997"}, {"SOURCE": "Africa Research Bulletin Vol. 34 No. 1, 1997", "FATALITIES": 5, "LOCATION": "Buganda", "ACTOR1": "Military Forces of Uganda (1986-)", "YEAR": 1997, "EVENT_DATE": "01/01/1997"}, {"SOURCE": "BBC Monitoring Service: Africa (10/01/97)", "FATALITIES": 5, "LOCATION": "Nyabani", "ACTOR1": "Military Forces of Uganda (1986-)", "YEAR": 1997, "EVENT_DATE": "07/01/1997"}, {"SOURCE": "BBC Monitoring Service: Africa (11/01/97)", "FATALITIES": 2, "LOCATION": "Kasese", "ACTOR1": "Military Forces of Uganda (1986-)", "YEAR": 1997, "EVENT_DATE": "08/01/1997"}, {"SOURCE": "The New York Times (5/3/97)", "FATALITIES": 0, "LOCATION": "Acholi-Bur", "ACTOR1": "LRA: Lord's Resistance Army", "YEAR": 1997, "EVENT_DATE": "11/01/1997"}, {"SOURCE": "Africa Research Bulletin Vol. 34 No. 1, 1997", "FATALITIES": 16, "LOCATION": "Kitgum", "ACTOR1": "LRA: Lord's Resistance Army", "YEAR": 1997, "EVENT_DATE": "01/02/1997"}, {"SOURCE": "Africa Research Bulletin Vol. 34 No. 2, 1997", "FATALITIES": 8, "LOCATION": "Pader", "ACTOR1": "LRA: Lord's Resistance Army", "YEAR": 1997, "EVENT_DATE": "01/02/1997"}, {"SOURCE": "BBC Monitoring Service: Africa (17/2/97)", "FATALITIES": 0, "LOCATION": "Moyo", "ACTOR1": "Military Forces of Sudan (1989-)", "YEAR": 1997, "EVENT_DATE": "13/02/1997"}, {"SOURCE": "Reuters News (16/2/97)", "FATALITIES": 3, "LOCATION": "Gulu", "ACTOR1": "LRA: Lord's Resistance Army", "YEAR": 1997, "EVENT_DATE": "16/02/1997"}]

Upvotes: 0

Views: 2594

Answers (0)

Related Questions