createjsセンターズームポイントlocaltoglobal

Question

レスポンシブなキャンバスを使ってcreatejsに設定されたマップがあります。私がしようとしているのは、マップをズーム可能にするだけでなく、ドラッグ可能にすることです。地図をドラッグすると、特定の中心点からズームすることができます。

私がする必要があると思うのは、マップに対する相対的な中心点の位置を計算し、次にその点にマップregX/regYを設定することです（私は次に、 regX/Yオフセットを補うためのマップ

ステージがスケーリングされているので、グローバル座標がスケーリングとチャンスと思われるので、中心位置を計算することも難しいです。ホルダー内のポイント：

：

exportRoot.pointHolder.tmpPt

とマップに含まれています

私が把握するために必要なものexportRoot.map_main_sym

はmap_main_symローカルのx/yの値relativie（すなわち直接）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); 

これは一例であり、私はより多くの純粋な数学のアプローチがあると確信しています。

乾杯。