放大图片旋转

Question

我截了一段网上关于移动端双指放大旋转的代码，

但是每一次放大旋转后，松开手，再次放大旋转的时候每次都会还原到初始值

怎么让他保持上一次放大旋转的位置，再在这个位置上无缝的继续放大旋转?

<div class="drag" style="

        background: url('https://ss1.baidu.com/6ONXsjip0QIZ8tyhnq/it/u=988279975,1210033778&fm=58');

        background-size: cover;

        width: 200px;

        height: 200px;

        position: absolute;

        top: 100px;

        left: 180px;

        transform: scale(1) rotate(0deg);

        color: #fff;"

    >

    </div>

    

<scirpt>

var now = [], start = [], scale = 1, rotation = 0 , sPageX = 0, sPageY = 0;

            var box = document.querySelector(".drag");

            var boxGesture = setGesture(box); 

            boxGesture.gesturestart = function(){  //双指开始

            };

            boxGesture.gesturemove = function(e){  //双指移动

                scale = e.scale;

                rotation = e.rotation;

                box.style.transform = "scale("+scale+") rotate("+rotation+"deg)";//改变目标元素的大小和角度

            };

            boxGesture.gestureend = function(){  //双指结束

            };

          function setGesture(el){

            var obj = {}; //定义一个对象

            var istouch = false;

            

            el.addEventListener("touchstart", function(e) {

                if(e.touches.length >= 2) {  //判断是否有两个点在屏幕上

                    istouch = true;

                    start = e.touches;  //得到第一组两个点

                    obj.gesturestart && obj.gesturestart.call(el); //执行gesturestart方法

                };

            },false);

            el.addEventListener("touchmove", function(e) {

                e.preventDefault();

                if(e.touches.length >= 2 && istouch) {

                    now = e.touches;  //得到第二组两个点

                    scale = getDistance(now[0],now[1]) / getDistance(start[0], start[1]); //得到缩放比例

                    rotation = getAngle(now[0],now[1]) - getAngle(start[0],start[1]);  //得到旋转角度

                    obj.gesturemove && obj.gesturemove.call(el, {

                        scale: scale.toFixed(2),