1
新しい要素が追加されない理由はわかりません。選択入力は新しい要素を追加しません
私はすでに3 <li>の要素を作成していますが、私の地図には追加する必要がある<li>が2つありますが、何も追加されていません。
<html>
<head>
<title>TODO supply a title</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="https://d3js.org/d3.v4.min.js"></script>
</head>
<body>
<div>TODO write content</div>
<ul id="#example">
<li></li>
<li></li>
<li></li>
</ul>
<script>
// Lets say our data is of this form
var multiples = [{'num': 2}, {'num': 4}, {'num': 6}, {'num': 8}, {'num': 10}];
// Get hold of your container
var container = d3.select('#example');
// Get hold of all the existing list items within the container
var children = container.selectAll('li').data(multiples, function (d) {
console.log(d);
return d ? d.num : null;
});
console.log(children);
// Mappings that represent pseudo DOM nodes that can potentially
// be created for each data unit
var updateSelection = children.enter() // Mappings that need DOM node creation
.append('li') // Create the DOM nodes for those mappings
.text(function (d) {
return d.num;
});
console.log(updateSelection);
// mapping representing real DOM nodes that could not be
// mapped to any item in the data
var exitSelection = children.exit().remove();
</script>
</body>
</html>