我还处于crossfilter和D3的学习阶段。
上提供的示例有两个问题对于他们提供的example
1。第285行:
var list = d3.selectAll(".list").data([flightList]);
在D3 wiki中,selection.data([values[, key]])
指定的值是数据值的数组,例如数字或对象的数组,或返回值数组的函数。
但是flightList不返回值数组,而flightList的扩充是div。
2。第499行:
dimension.filterRange(extent);
为什么barPath()没有要求更新条形图的函数?条形图如何通过数据更新自身?那么如果数据发生变化,图表会同时更新吗?
答案 0 :(得分:0)
1
'list'是一个选择,它有一个单元素数组作为数据,单个元素是函数flightList。
在301行,我们看到'list.each(render);',意思是为'list'选择中的每个元素调用render函数,将其数据(flightList)作为渲染的第一个参数传递功能
因此'render(method)'函数中的第295行,即'd3.select(this).call(method);'可以在列表的上下文中或多或少地重写为“d3.select(”。list“)。call(flightList);',它调用传递'.list'div的flightList函数作为参数。然后,flightList功能继续在该div之上建立航班列表。
至少,这是我的阅读。 IMO,该代码非常优雅和通用,但作为一个例子非常难以理解。
2
第281行在所有图表上设置一个事件监听器,每当画笔移动或完成移动时,它都会重新渲染所有内容('renderAll'函数)。