创建中心缩放点localtoglobal

Question

我有一个在createjs中设置的带有响应式画布的地图。我正在尝试做的是使地图可缩放，但也可拖动。当地图被拖动时，我想让它从一个特定的中心点进行缩放。

我认为我需要做的是计算中心点相对于地图的位置，然后将地图regX/regY设置为该点(然后我认为我需要重置为地图的x/y以弥补regX/Y偏移。

由于舞台是缩放的，我甚至很难弄清楚中心的位置，因为全局坐标似乎随着缩放而变化。我把中心点放在夹子里：

exportRoot.pointHolder.tmpPt

而地图包含在：

exportRoot.map_main_sym

我需要弄清楚的是什么是map_main_sym本地x/y值关系(即直接位于(exportRoot.pointHolder.tmpPt.x，exportRoot.pointHolder.tmpPt.y)下)

Answer 1

我不建议在缩放时更改注册点。更好的方法是确定与鼠标的距离，并确定缩放容器/对象时平移的程度。

这是我手头上的一个地图工具的一个片段：

// Find the mouse point INSIDE the mapView
var point = new createjs.Point(this.stage.mouseX, this.stage.mouseY);
var localPoint = this.mapView.globalToLocal(point.x, point.y);

// Scale the Map View
if(event.wheelDeltaY > 0){ // This is part of a mousewheel event
    // zoom in
    this.mapView.scaleX = this.mapView.scaleY *= 1.3;
} else {
    this.mapView.scaleX = this.mapView.scaleY /= 1.3;
}

// Find where the original point is now
var globalPoint = this.mapView.localToGlobal(localPoint.x, localPoint.y);
// Move the map by the difference
this.mapView.x -= (globalPoint.x - point.x);
this.mapView.y -= (globalPoint.y - point.y);

这只是一个例子，我相信有一种更纯粹的数学方法。

干杯。