相关疑难解决方法(0)

所以我使用默认的d3.behavior.zoom()和限制来获得带有鼠标缩放的世界地图,以防止将地图完全拖出页面.这对于工作来说是一种痛苦,但它现在起作用了.

我现在的问题是这个项目还需要界面中无用的缩放+和 - 按钮,我找不到两种缩放类型的例子.它既可以是鼠标缩放,也可以是蹩脚的缩放按钮.

我试过简单地调用zoom.scale(newScale); 但它没有更新任何东西.我似乎是在正确的轨道,因为在控制台中你可以看到比例更新但它没有更新,当我用鼠标缩放时,它突然跳到使用按钮定义的比例.但似乎我还需要更新翻译,我不知道如何得到地图的中心并计算缩放到那里所需的翻译.

我还需要知道在调用zoom.scale(newScale)后如何更新投影; 如果是这样做的话.

我用缩放按钮制作了一个简化的演示,显然现在不能正常工作. http://bl.ocks.org/jfmmm/f5c62bc056e557b80447

谢谢!

编辑:现在如此接近,它会缩放到地图的中心,因为我使用的计算方法与计算屏幕的中间位置相同,但使用新的比例.问题是我希望它放大屏幕中间的对象,而不是地图中间的国家.

function zoomBtn(action) {
    var currentZoom = zoom.scale();

    if( action == 'in' ){
        if(currentZoom < options.maxZoomLevel){
            var newScale = Math.floor(currentZoom) + 1;

            var b = path.bounds(mapFeatures);
            var t = [(width - newScale * (b[1][0] + b[0][0])) / 2, (height - newScale * (b[1][1] + b[0][1])) / 2];

            zoom.scale(newScale)
                .translate(t)
                .event(svg);
        }
    }else{
        if(currentZoom > options.minZoomLevel){
            var newScale = Math.floor(currentZoom) - 1;

            var b = path.bounds(mapFeatures);
            var t = [(width …