マウス ホイールのズーム レベルを View.resolutions で指定されたレベルに制限したいと思います。
それを達成するために何ができますか?
マウス ホイールのズーム レベルを View.resolutions で指定されたレベルに制限したいと思います。
それを達成するために何ができますか?
ビューオプションでconstraintResolution: trueを使用する
(c) マイク
EDIT :マウス ホイールのズームにのみConstrainResolutionを使用する場合は、マップを作成する前に、 MouseWheelZoomのプロトタイプで関数handleWheelZoom_をオーバーライドする必要があります。
import { clamp } from 'ol/math.js';
import { zoomByDelta } from 'ol/interaction/Interaction';
import { MouseWheelZoom } from "ol/interaction";
const mouseWheelZoomContrainResolution = true;
MouseWheelZoom.prototype.handleWheelZoom_ = function (map) {
var view = map.getView();
if (view.getAnimating()) {
view.cancelAnimations();
}
var delta = -clamp(this.totalDelta_, -this.maxDelta_ * this.deltaPerZoom_, this.maxDelta_ * this.deltaPerZoom_) / this.deltaPerZoom_;
if (view.getConstrainResolution() || mouseWheelZoomContrainResolution) {
// view has a zoom constraint, zoom by 1
delta = delta ? delta > 0 ? 1 : -1 : 0;
}
zoomByDelta(view, delta, this.lastAnchor_, this.duration_);
this.mode_ = undefined;
this.totalDelta_ = 0;
this.lastAnchor_ = null;
this.startTime_ = undefined;
this.timeoutId_ = undefined;
};
EDIT2:
ビューには setConstrainResolution メソッドがあるため、制約のオンとオフを切り替えることができます。ズームを手動で設定する前にオフにし、解像度にさらに変更が加えられた場合はオンに戻すことができます
(c) マイク
以下のコメントを参照してください