d3:通过键为绑定元素选择数据子集

时间:2018-12-16 14:45:39

标签: javascript json d3.js bind

我有一个嵌套(2D)JSON数组。绑定数组的第二维时,我只想绑定具有“ id”键的元素,即,我想使用“列”键忽略该元素。

在我当前的示例代码中,我生成的子元素与我拥有的元素一样多。但是,我需要少一个。

		jsonNodes = [{"id": 0, 
	      "table": [{"id": 10}, {"id": 11}, {"id": 12}, 
		        {"column": [{"id": "a"}]}]},
             {"id": 1,
	      "table": [{"id": 20}, {"id": 21},
		        {"column": [{"id": "y"}, {"id": "z"}]}]}
            ];

		// bind svg element
		var svgContainer = d3.select("body").append("svg")
				.attr("width", 50)
				.attr("height", 50)

		// build steps
		var stepG = svgContainer.selectAll("svg")
				.data(jsonNodes)
			  
		var stepGenter = stepG.enter()
				.append("g")
				.attr("id", function(d) { return "id" + d.id; });

		// append to individual class
		var tableG = stepGenter.selectAll("g")
				.data(function(d, i) { console.log(d.table[i]);
									   return d.table; })
				
		var tableGenter = tableG.enter()
				.append("g")
				.attr("id", function(d) { return "id" + d.id; });
<script src="https://d3js.org/d3.v5.js"></script>

0 个答案:

没有答案