ポイントを拡大する(スケールと移動を使用) 質問する

ポイントを拡大する(スケールと移動を使用) 質問する

HTML 5のキャンバスでマウスの下にあるポイントを拡大表示できるようにしたい。グーグルマップどうすればそれを実現できるでしょうか?

ベストアンサー1

より良い解決策は、ズームの変化に基づいてビューポートの位置を移動するだけです。ズーム ポイントは、古いズームと新しいズームで同じままにしておきたいポイントです。つまり、ズーム前のビューポートとズーム後のビューポートは、ビューポートに対して同じズーム ポイントを持ちます。原点を基準にスケーリングしていることを前提としています。それに応じてビューポートの位置を調整できます。

scalechange = newscale - oldscale;
offsetX = -(zoomPointX * scalechange);
offsetY = -(zoomPointY * scalechange);

つまり、ズームインするときに、ズームしたポイントを基準として、ズームインした倍率だけ下と右にパンすることができます。

ここに画像の説明を入力してください

おすすめ記事