javascript - How is it to debug the data() call in D3? - Stack Overflow

admin管理员组

文章数量:1292317

I am triying with this example code but it is not correct:

var aaa = ["a","b","c"];
d3.selectAll(".none").data(aaa).enter().call(function(d) {console.log(d);});

or

var aaa = ["a","b","c"];
d3.selectAll("html").data(aaa).enter().call(function(d) {console.log(d);});

I am triying with this example code but it is not correct:

var aaa = ["a","b","c"];
d3.selectAll(".none").data(aaa).enter().call(function(d) {console.log(d);});

or

var aaa = ["a","b","c"];
d3.selectAll("html").data(aaa).enter().call(function(d) {console.log(d);});

• javascript
• debugging
• d3.js

Share Improve this question Follow asked Feb 19, 2016 at 16:24 tres.14159tres.14159 93022 gold badges1818 silver badges3232 bronze badges 3

• can you paste your plete code? I think this is not correct code – Farhan Commented Feb 19, 2016 at 16:43
• Yes, I know those codes are incorrect. How I do for correct this code? That is the question :) . – tres.14159 Commented Feb 20, 2016 at 1:49
• What are you trying to do? – Lars Kotthoff Commented Feb 20, 2016 at 4:05

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 7

Although the answer from @HugoLasticot is very helpful and explanatory, one might add that you can use the construct call() to run arbitrary functions.

d3node
  .select(".selector")
  .call((d) => console.log(d))

This might help you when debugging.

Here is the plete list of d3 functions.

D3 allows you to bind arbitrary data to a Document Object Model (DOM), and then apply data-driven transformations to the document.

You need to initiate the data join by defining the selection to which we will join data with :

var bar = chart.selectAll("div");

After, you need to join the data (defined previously) to the selection using selection.data.

var barUpdate = bar.data(data);

But the selection is empty, so you need instantiate these missing elements by appending to the enter selection.

var barEnter = barUpdate.enter().append("div");

So you will create one DOM object per data. You can set any attribute you want (class,id,...) of the associated data value, d.

barEnter.attr("class", function(d) { return d * 10 + "px"; });

Concerning your question, you could debug your data when you create each object for each data like this :

var Viz = d3.select(".myViz")
            .selectAll("div")
            .data(aaa)
            .enter().append("div")
            .attr("class", function(d) { console.log(d); });

Hope it helps.

本文标签： javascriptHow is it to debug the data() call in D3Stack Overflow