1

Buildings a D3 dashboard using awsconsole statistical data. The data is in MongoDB and appears to load properly when routing to the browser.

However when trying to load the data via the D3 dashboard the following error is generated in console

Uncaught TypeError: **string.slice is not a function**
at **d3_time_parseFullYear (d3.js:2716)**
at d3_time_parse (d3.js:2519)
at Function.format.parse (d3.js:2495)

Tried various formats with no success, dashboard loads, but no data is present due to slice error

Sample queue.js snippet

queue()
    .defer(d3.json, "/donorschoose/projects")
    .defer(d3.json, "static/geojson/us-states.json")
    .await(makeGraphs);

function makeGraphs(error, projectsJson, statesJson) {

    //Clean projectsJson data
    var donorschooseProjects = projectsJson;
    // var dateFormat = d3.time.format("%Y-%m-%d");
    var dateFormat = d3.time.format("%Y-%m-%d %H:%M:%S");
    // var dateFormat = d3.time.format("%Y-%m-%d %X");
    donorschooseProjects.forEach(function(d) {
        d["date_posted"] = dateFormat.parse(d["date_posted"]);
        d["date_posted"].setDate(1);
        d["total_donations"] = +d["total_donations"];
    });

Sample Mongo Data (with time stamp)

{
"_id" : ObjectId("5c8933d131a8834ae488c4d6"),
"date_posted" : ISODate("2003-06-18T00:00:00Z"),
"date_completed" : ISODate("2004-01-23T00:00:00Z"),
"date_thank_you_packet_mailed" : ISODate("2004-02-26T00:00:00Z"),
"date_expiration" : ISODate("2004-06-16T00:00:00Z")
}

Sample D3.js snippet

}
  function d3_time_parseWeekNumberMonday(date, string, i) {
    d3_time_numberRe.lastIndex = 0;
    var n = d3_time_numberRe.exec(string.slice(i));
    return n ? (date.W = +n[0], i + n[0].length) : -1;
  }
  function d3_time_parseFullYear(date, string, i) {
    d3_time_numberRe.lastIndex = 0;
    var n = d3_time_numberRe.exec(string.slice(i, i + 4));
    return n ? (date.y = +n[0], i + n[0].length) : -1;
  }
  function d3_time_parseYear(date, string, i) {
    d3_time_numberRe.lastIndex = 0;
    var n = d3_time_numberRe.exec(string.slice(i, i + 2));
    return n ? (date.y = d3_time_expandYear(+n[0]), i + n[0].length) : -1;
  }
  function d3_time_parseZone(date, string, i) {
    return /^[+-]\d{4}$/.test(string = string.slice(i, i + 5)) ? (date.Z = -string, 
    i + 5) : -1;
  }
  function d3_time_expandYear(d) {
    return d + (d > 68 ? 1900 : 2e3);
  }
NanoNet
  • 218
  • 3
  • 11
  • not sure if it's the problem or not, but `d["total_donations"] = +d["total_donations"];` should read: `d["total_donations"] = parseInt( d["total_donations", 10 )];`, assuming that you're trying to cast as a number. If you want to double it's value, that'd be `d["total_donations"] += d["total_donations"];` – Steven Stark Mar 13 '19 at 18:19
  • @StevenStark using the unary plus to coerce to a number is not a problem. In fact, it's actually the idiomatic way, and it's better that `parseInt`. – Gerardo Furtado Mar 13 '19 at 22:10
  • @GerardoFurtado oh, really? that's new to me, do you have a link to something that describes why this is the idiomatic way and better than parseInt? thanks! – Steven Stark Mar 14 '19 at 00:04
  • 1
    @StevenStark The most important thing is that `+` behaves as `parseFloat`. The second one is that `+` returns `0` for empty strings, while `parseInt` returns `NaN`. Of course, choosing one or the other depends on what the programmer wants (by the way, D3 author always use the unary plus). You can read more about this here: https://stackoverflow.com/questions/17106681/parseint-vs-unary-plus-when-to-use-which – Gerardo Furtado Mar 14 '19 at 00:05
  • 1
    @GerardoFurtado thank you for that info, I see a lot of reasons for this now. You have changed my code style for the better! cheers. – Steven Stark Mar 14 '19 at 00:13

0 Answers0