Question

我使用d3.js编写函数来创建SVG图形。调整窗口大小时，图形会调整大小。（简化）软件模式是这样的：

function drawGraph(DIV, data){
// Draw the initial graph, which fills the supplied DIV

    function resize {
    // Read the new width and height of the SVG, redraw the graph
    }

    d3.select(window).on('resize', resize);
    resize();
}

这种模式的一个很好的例子可以在这里看到： https://blog.safaribooksonline.com/2014/02/17/building-responsible-visualizations-d3-js/

这是我的问题：我调用例程两次并在同一网页上创建两个SVG图。调整窗口大小时，只会调整最后绘制的SVG的大小。如何保持第一个＆＃34; alive＆＃34;，以便它会收听调整大小事件？

Answer 1

请参阅文档here：

如果事件监听器已经注册了相同的类型选中的元素，在新的之前删除现有的侦听器监听器已添加。为同一事件注册多个侦听器在类型中，类型后面可以跟一个可选的命名空间，例如＆＃34; click.foo＆＃34;和＆＃34; click.bar＆＃34;。要删除侦听器，请将null作为监听器。要删除特定事件类型的所有侦听器，请传递 null作为侦听器，.type作为类型，例如selection.on（＆＃34;包含.foo＆＃34 ;, 空）。

所以假设DIV是一个字符串标识符：

d3.select(window).on('resize.'+DIV, resize);

在同一网页上调整多个svg图表的大小

1 个答案: