放大画布后无法计算点的位置

Question

所以我在一个用画布绘制全景图的项目中遇到了这个问题。我添加了缩放，应该修复光标点上的缩放。但是，它必须计算图像的新偏航和俯仰。

function MouseWheelHandler(event) {
    var mouseX = event.clientX - canvas.offsetLeft;
    var mouseY = event.clientY - canvas.offsetTop;

    var wheel = wheelDirection(event)//n or -n

    if (wheel == 1) zoomDelta = zoomDeltaCoeff;
    else if (wheel == -1) zoomDelta = -zoomDeltaCoeff;
    else return;

    if (panorama[activePanorama].zoom + zoomDelta < 1) return;
    else if (panorama[activePanorama].zoom + zoomDelta > 2) return; 

    zoomMultiplier = (panorama[activePanorama].zoom + zoomDelta) / (panorama[activePanorama].zoom);
    ctx.translate(
        originX,
        originY
    );
    ctx.scale(zoomMultiplier,zoomMultiplier);
    ctx.translate(
        -( mouseX / panorama[activePanorama].zoom + originX - mouseX / ( panorama[activePanorama].zoom * zoomMultiplier ) ),
        -( mouseY / panorama[activePanorama].zoom + originY - mouseY / ( panorama[activePanorama].zoom * zoomMultiplier ) )
    );

    originX = mouseX / panorama[activePanorama].zoom + originX - mouseX / ( panorama[activePanorama].zoom * zoomMultiplier );
    originY = mouseY / panorama[activePanorama].zoom + originY - mouseY / ( panorama[activePanorama].zoom * zoomMultiplier );
    originXb = ((getDocWidth() - canvas.offsetLeft) - mouseX)  / ( panorama[activePanorama].zoom * zoomMultiplier )-((getDocWidth() - canvas.offsetLeft) - mouseX) / panorama[activePanorama].zoom + originXb ;
    originYb = ((getDocHeight() - canvas.offsetTop) - mouseY)  / ( panorama[activePanorama].zoom * zoomMultiplier )-((getDocHeight() - canvas.offsetTop) - mouseY)  / panorama[activePanorama].zoom + originYb;
    oldMiddleX = panorama[activePanorama].coords.left + Math.round(panorama[activePanorama].angle.pos.x * panorama[activePanorama].angle.width.x);
    oldMiddleY = panorama[activePanorama].coords.top + Math.round(panorama[activePanorama].angle.pos.y * panorama[activePanorama].angle.width.y);
    middleX = originX + (originXb - originX)/ 2;
    middleY = originY + (originYb - originY)/ 2

    panorama[activePanorama].zoom = Math.round((panorama[activePanorama].zoom + zoomDelta) * 100) / 100;

    panorama[activePanorama].angle.pos.x += (middleX - oldMiddleX) / panorama[activePanorama].angle.width.x;
    panorama[activePanorama].angle.pos.y += (middleY -  oldMiddleY) / panorama[activePanorama].angle.width.y;

    //comment this line to see the desired effect
    panorama[activePanorama].calculatePos(0,0);}

问题是，它错误地计算了位置。如果正确完成，黄点应该与红点位于同一位置。我完全不知道为什么它不起作用。 完整的事情：http://jsfiddle.net/PDpYn/1/