Ограничение Zoom SVG - PullRequest
Новая
       34

Ограничение Zoom SVG

0 голосов
/ 22 июня 2019

Я создаю интерактивную панораму SVG, которая использует приведенный ниже код для масштабирования и панорамирования.Карта содержится в элементе div, однако в данный момент изображение SVG увеличивается за пределы нижней границы контейнера.Есть ли способ остановить это?

<script type="text/javascript"><![CDATA[
            var transformMatrix = [1,0,0,1,0,0];
            var svg = document.getElementById('svg-map');
            var viewBox = svg.getAttributeNS(null, "viewBox").split(" ");
            var centerX = parseFloat(viewBox[2])/2;
            var centerY = parseFloat(viewBox[3])/2;
            var matrixGroup = svg.getElementById("matrix-group");

            function pan(dx, dy) {
                transformMatrix[4] += dx;
                transformMatrix[5] += dy;

                var newMatrix = "matrix("+ transformMatrix.join(' ') + ")";
                matrixGroup.setAttributeNS(null, "transform", newMatrix);
            }

            function zoom(scale) {
                for(var i = 0; i < 4; i++) {
                    transformMatrix[i] *= scale;
                }

                transformMatrix[4] += (1-scale) * centerX;
                transformMatrix[5] += (1-scale)* centerY;

                var newMatrix = "matrix("+ transformMatrix.join(' ') + ")";
                matrixGroup.setAttributeNS(null, "transform", newMatrix); 
            }

            function reset() {

                }
        ]]></script>
...