将zoom.scale传递给全局变量d3.js?

时间:2015-09-11 22:56:30

标签: javascript d3.js zoom

我比较熟悉JavaScript,D3以及JavaScript中的作用域如何工作,并且我在地图上缩放点时遇到问题(表示为不同大小的圆圈),以便在用户缩放时,点保持不变尺寸。为了实现这一点,我考虑将当前缩放比例传递给全局变量,然后将其除以圆的半径,但是很难将值从zoom.scale传递给全局变量。

缩放代码如下:

var zoom = d3.behavior.zoom()
    .on("zoom",function(){
    g.attr("transform","translate("+ 
    d3.event.translate.join(",")+")scale("+d3.event.scale+")");
        console.log(zoom.scale()); //this works
}); 

圈子代码如下:

d3.csv("cities.csv", function(error, data) { 
//..other code
    g.selectAll("circle")
   .data(data)
   .enter()       
   .append("circle")
   .attr("cx", function(d) {
           return projection([d.lon, d.lat])[0];
   })
   .attr("cy", function(d) {
           return projection([d.lon, d.lat])[1];
   })
   .attr("r", function(d) { return radius(d.pop)/zoomScale; }) //other code...
});

zoomScale 是从缩放传递的变量。如果有一种更简单的方法可以实现这一目标,我也会对此持开放态度,并提前感谢。

0 个答案:

没有答案