Как использовать .each в d3?

Question

Не могли бы вы объяснить мне, почему первый скрипт не работает? Firebug говорит, что «d не определено». Val - это двумерный массив после selectall.

<script type="text/javascript"> 
     setInterval(function() { 
      d3.json("./cgi-bin/script1.sh?shmid=" + node.value, function(error, txt){ 
       if (error) return console.warn(error); 

       table = d3.select("#shmid" + node.value); 
       val = table.selectAll(".val") 

       val.each(function(d,i){ 
        console.debug(d,i) 
        d.text(txt.bd[i].val); 
       }); 

       node = node.next; 
      }) 
     }, 500); 

    </script> 

Рабочий вариант:

<script type="text/javascript"> 
     setInterval(function() { 
      d3.json("./cgi-bin/script1.sh?shmid=" + node.value, function(error, txt){ 
       if (error) return console.warn(error); 

       table = d3.select("#shmid" + node.value); 
       val = table.selectAll(".val") 

       val.each(function(d,i){ 
        console.debug(d,i) 
        d3.select(this).text(txt.bd[i].val); 
       }); 

       node = node.next; 
      }) 
     }, 500); 

    </script> 

Answer 1

От the documentation:

Запускает указанную функцию для каждого элемента в текущем выделении, проходящей в текущей базовой точки D и индекса I, с этот контекст текущего элемента DOM.

В первом случае вы неправильно используете d - это относится к данным, привязанным к элементу, а не к самому элементу. В вашем случае вы не привязывали к нему какие-либо данные, поэтому ссылаться не на что.

Похоже, что вы пытаетесь сделать следующее:

table = d3.select("#shmid" + node.value); 
table.selectAll(".val").data(txt.bd) 
    .text(function(d) { return d.val; }); 

Это будет первым привязки данных к элементам вы работаете с, а затем использовать связанные данные, чтобы установить text.