Question

我一直在环顾四周，并没有找到一个可靠的解决方案，用于设置用户双击屏幕时的缩放比例。

我得到的最远的是设置scaleVal，如小提琴中显示的函数dblclicked（）所示

https://jsfiddle.net/helloGoodDay/62vq9h8p/3/

            function dblclicked()
            {
                var translate = zoom.translate(),
                    mouse = d3.mouse(this),
                    scaleOld = zoom.scale(),
                    zoomOld = Math.log(scaleOld) / Math.LN2,
                    zoomNew = d3.event.shiftKey ? Math.max(minScale + 8, Math.ceil(zoomOld) - 1) : Math.min(maxScale + 8, Math.floor(zoomOld) + 1),
                    scaleNew = Math.pow(scaleVal, zoomNew),
                    zoomDelta = scaleNew / scaleOld;

                 svg.transition()
                     .duration(350)
                     .call(zoom
                     .scale(scaleNew)
                     .translate([(translate[0] - mouse[0]) * zoomDelta + mouse[0], (translate[0] - mouse[0]) * zoomDelta + mouse[0]])
                     .event);

                 d3.event.stopImmediatePropagation();
            }

但是，如果再点击一下，节点就会消失，我也不喜欢动画。

有没有办法以节点不会消失的方式设置缩放比例的值，并且动画不是这个烦人的？

编辑：该功能来自https://github.com/d3/d3/issues/1985

Answer 1

好的告诉我这个解决方案是否适合你的问题

https://jsfiddle.net/qm6h4wm7/2/

我做了什么：

缩小每次缩放之间的比例（1）
限制为5次缩放以便始终在视图中显示节点（2）

节点不会消失

(1) scaleNew = Math.pow(2, zoomNew)

(2) if(zoomNew<5){...}

D3 - 设置双击的缩放比例

1 个答案: