0

svg中的鼠标滚轮缩放效果-如何缩放到工作区域的中心点，以及在达到最小和最大缩放级别时如何停止缩放级别。在哪里设置这个最小和最大缩放值？

下面是我的代码，我在zoomChanged函数中重置了缩放级别svgedit.compiled.js

           if (zoomlevel < 0.4) {                   
                 //changeZoom({value: 0.4});
                 var zoomlevel = 0.4;
                return;
            }

             if (zoomlevel > 9.5) {                 
                // changeZoom({value: 9.5});    
                var zoomlevel = 9.5;                    
                return;
            }

并在ext-grid.js我放置了以下代码

zoomChanged: function(zoom) {
        if (showGrid)
        {           
            if(zoom > 0.4 & zoom < 9.5)
            {
                updateGrid(zoom);
            }           
        }
    },

当鼠标滚轮滚动并达到 0.4 或 9.5 时，网格停止缩放，但缩放级别仍然发生变化，并且缩放到放置鼠标的点。

我需要将工作区域缩放到鼠标放置的中心，并且当它到达minimum 0.4或maximum 9.5停止缩放时。

谁能指导我，我哪里出错了？

4

2 回答 2

2

在 svg-editor.js 文件中有这个函数：

var zoomChanged = svgCanvas.zoomChanged = function(win, bbox, autoCenter)

如果将 autoCenter 变量设置为true，则可以强制缩放到工作区域的中心。所以：

var zoomChanged = svgCanvas.zoomChanged = function(win, bbox, autoCenter) {
    autoCenter = true;
    var scrbar = 15,
    ....

要限制缩放级别，请打开 svgcanvas.js 并搜索：

this.setZoom = function(zoomlevel)

您可以在此处设置最小/最大缩放级别。例如，如果您想允许 100% 为最小值，最大值为 400%，您可以编写：

this.setZoom = function(zoomlevel) {
    if (zoomlevel<1) zoomlevel=1;
    if (zoomlevel>4) zoomlevel=4;
...
于 2015-06-12T08:22:57.783 回答
1

请注意，您使用的是局部变量

 if (zoomlevel < 0.4) {                   
     //changeZoom({value: 0.4});
     var zoomlevel = 0.4;
     return;
 }

正确var zoomlevel = 0.4;到zoomlevel = 0.4;

那么它可能会起作用

于 2014-07-07T11:54:39.400 回答