0

I have an array called ageNames. When I print it I get:

Array[12]

When you look at the elements it says:

1: "Blah"

2: "blah2"

length:12

_proto_:Array[0]

However, if I say console.log(ageNames[0]) it says undefined (as it does for all elements). And if you do console.log(ageNames.length) you get a 0.

What is going on?

Relevant Code:

  var mdata = [];
  var mnames = [];
  var rowID = [];

  var ageNames = [];
  d3.json("whiskey.json", function(error, data) {

  ageNames.push(d3.keys(data[1]).filter(function(key) { return (key !== "Distillery" && key !== "RowID"); }));
data.forEach(function(d) {
    if(d["RowID"] <= 5){
        
    //console.log(mdata);
    mnames.push(d["Distillery"]);
    rowID.push(d["RowID"]);
    //console.log(d);
    mdata.push(d);

    }
    });

 console.log(ageNames);
 console.log(ageNames.length);

The first line prints Array[12] and you can look at the individual elements. The second line prints 0. How can the length be 0?

});

Community
  • 1
  • 1
lars
  • 1,976
  • 5
  • 33
  • 47
  • Can you give us a [fiddle?](http://jsfiddle.net) – David G Feb 15 '14 at 23:09
  • Maybe the indices are not numeric but strings... We need more code I suppose. – elclanrs Feb 15 '14 at 23:10
  • http://jsfiddle.net/5MQqg/ – lars Feb 15 '14 at 23:59
  • @elclanrs, 0x499602D2 yes, and I posted some relevant code. – lars Feb 16 '14 at 00:07
  • 1
    It looks like your `console.log` calls are **outside** of the `d3.json` callback. You are trying to access the array *before* it has values, because `d3.json` is *asynchronous*. Move the log calls *inside* the `d3.json` callback. Please see http://stackoverflow.com/q/14220321/218196 for an explanation of the problem. – Felix Kling Feb 16 '14 at 00:10
  • I don't see how the asynchronous part effects the problem. It prints the array of right length Then it prints the length. But the length is wrong. – lars Feb 16 '14 at 00:23
  • Might be related to: http://stackoverflow.com/q/4057440/218196. Fact is that `console.log` is called before the array is even populated. – Felix Kling Feb 16 '14 at 00:47
  • It looks like you're pushing an entire array onto `ageNames`. You should be pushing one element at a time, or use `.concat()`. – Lars Kotthoff Feb 16 '14 at 01:02

1 Answers1

0

@Lars I'm a little confused by your fiddle. So I'll have a guess and see where that gets us. The json data is on the page but you're using d3.json to call it from the server (where it isn't 'cause you're using a fiddle). To get your code to work on the fiddle we can ignore the d3.json call, but when you try this out in your development environment remember to wrap it all up in the d3.json call as it's asynchronous as pointed out by Felix.

Having said that it looks as though you're trying to create a variable for use in a d3 bar chart using a forEach loop. I've taken an approach of creating an array of objects in the following code which I think will achieve what you want.

jsondata.forEach(function(d) {
    if(d.RowID<=5) {
        var el = {
            mnames: d.Distillery,
            rowID: d.RowID
        };
        mdata.push(el);
    }
});

You can then access these variables in the usual way, although this seems like a lot of work to create the dataset I think you want. You could just filter the data in the .data line, as in

.data(jsondata.filter(function (d,i) { return //do some magic filtering stuff; })

Anyway I've updated your fiddle and created a bar chart using the first 5 entries. I haven't really explained what I've done there, but if you have any questions leave a message.

user1614080
  • 2,854
  • 1
  • 19
  • 22