d3.js重新缩放形状路径并将其保持在中心位置

时间:2014-03-20 12:02:50

标签: javascript d3.js

enter image description here

在应用程序的这一部分 - 我正在尝试重新缩放路径形状并将其保留在视口内。

我已设法相应地重新缩放形状,因为需要调整转换以使其保持在视口内。

http://jsfiddle.net/pPMqQ/101/

rescalePath: function(zoomLevel){
            //now need to rescale the path so the map and the region match?



            var ratioX = zoomLevel/this.width;
            var ratioY = zoomLevel/this.height;

            this.svg.attr("transform", "scale("+zoomLevel+") translate("+ratioX+", "+ratioY+")");

        },
        bindEvents: function(){
            var that = this;

            $(".up").click(function(e) {
                e.preventDefault();
                that.rescalePath(3);
            });

            $(".down").click(function(e) {
                e.preventDefault();
               that.rescalePath(12);
            });

        }

实现这一目标的最佳方法是什么? - 当然它不能设置翻译信息 - 是不是有一个功能可以将投影保持在中心 - 理想情况下这将是放在谷歌地图上的缩放/平移的一部分 - 所以匹配运动/平移地图以及缩放。

0 个答案:

没有答案