All data is in enter() placeholder (D3)

I've got an update function with this code:

// actualy fetched from server. array of JS objects that I parsed to right type
var xData = [{
    id: 234234 // parsed as integer
    date: 15/11/2001 // parsed as date
    price: 6512 // parsed as integer
}];

// triggred by the user
function updateSVG() {

 // fetch new data from ther server
 xData = [];
 xData = [{
    id: 234234 // parsed as integer
    data: 15/11/2001 // parsed as date
    price: 6512 // parsed as integer
}];

 // join data
 var x = svg.selectAll(".x-class")
     .data(xData, function(d) { return d.id; });

 // new data
 x.enter().append("image")
     .attr('class', 'x-class')
     .attr("xlink:href", "x-image.png")
     .attr("width", 16)
     .attr("height", 19)
     .attr('y', 0);

 // current and new data
 x.transition()
     .attr("x", function(d) { return x(d.date); })
     .attr("y", function(d) { return y(d.date); });

 /// old data
 x.exit().remove();

}

What I expect is when I run this function the second or third time, most of the data will be UPDATE (i.e. not in enter), and just a few of the data will be in enter() and exit().

But all my data is in enter(). No matter what. The d.id is unique for sure. Everything works well as expected but this issue. When I inspect the x object before and after I fetche the new data, all my data is in the enter() placeholder.

Any ideas? What am I missing?

Answers


Code problems (Let us know if any of these help):

  1. What is x in the case of x(d.date)? Do you mean xData here?

    x.attr("x", function(d) { return x(d.date); })

  2. What is this doing? You haven't defined data, or y. (or arrayObjectIndexOf and yOffset but I suspect those are as implied)

    return y(data[arrayObjectIndexOf(data, d.date, 'date')].price) - yOffset;

Also, since D3 is a data manipulation library, it's usually more difficult to help when we don't know what your data looks like. Sometimes we get an idea (d.date) but it could be important here (since you're apparently finding a price elsewhere instead of doing d.price)


Need Your Help

Multiple parameters definition of a function Python

python function parameters

I'm trying to write a function that calculates the cost of a loan, but I keep getting the cost of the loan to be the negative value of what the user inputs as the amount of the loan.