在同一个网页上调整多个svg图形的尺寸

我已经编写了使用d3.js创建SVG图形的函数。调整窗口的大小时会调整图形大小。（简化）软件模式是这样的：在同一个网页上调整多个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被调整大小。我怎样才能保持第一个“活着”，所以它会听取resize事件？

来源

2015-02-09 Freyr

参见文档here：

如果事件侦听器已经注册了所选元素在相同类型，现有的监听器中加入新的听者前除去。要为同一事件类型注册多个侦听器，该类型后面可以跟随一个可选的命名空间，如 “click.foo”和“click.bar”。要删除侦听器，请将空值作为侦听器。要删除特定事件类型的所有侦听器，请将 null作为侦听器，将.type作为类型，例如， selection.on（“。foo”， null）。

因此，假设DIV是一个字符串标识符：

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

来源

2015-02-09 15:25:32 Mark

谢谢你的提示答案，马克。我自己找到了一个（简单的）解决方案。当我使用'window.addEventListener（“resize”，resize）''代替'd3.select（window）.on（'resize'，resize）'这两个图形都可以正确缩放。 – Freyr 2015-02-09 19:57:58

在同一个网页上调整多个svg图形的尺寸

回答

相关问题