8. OpenLayer のいくつかの一般的なメソッドの概要

1. 地図の視点範囲を取得する

this.map.getView().calculateExtent(this.map.getSize());

2. マップの解像度を取得する

// 获取地图视图的分辨率
var resolution = this.map.getView().getResolution();

3. 位置決め

 //定位视图
this.map.getView().fit( [extentArr[0], extentArr[1], extentArr[2], extentArr[3]],  {
  padding: [0, 0, 0, 0],  //上， 右，下，左
  duration: 500,
});

//定位中心点
this.map.getView().fit(center, {
  duration: 1000, //动画的持续时间,
  maxZoom: 18,
  callback: null,
});

4. すべてのレイヤーを取得する

this.map.getLayers().getArray()

5. 地図モバイル監視

this.map.on("moveend",(e)=>{
   //方法
})

6. Zoomモニタリングイベント

this.map.getView().on('change:resolution', (event) => {
   //方法
});

7. マウスクリック

    this.map.on("click", (ev) => {
      const mouse = ev.coordinate; // 鼠标点击的坐标位置
    })

8. ダブルクリックを解除して拡大します

 //禁用双击放大事件
 let doubleClickZoom = new ol.interaction.DoubleClickZoom();
 let doubleClickZoomArr = this.map
    .getInteractions()
    .array_.filter((item) => {
        return item.constructor.name === doubleClickZoom.constructor.name;
    });
 this.map.removeInteraction(doubleClickZoomArr[0]);

9. レンダリング監視。レイヤー描画を監視し、一部の自己定義要素の位置をリアルタイムで変更するのに適しています。

//监听地图 去实时计算一些东西，比如位置
this.map.on("postrender", function (ev) {

})

//监听图层  去改变栅格图层的一些样式
myLayer.on("postrender", (e) => {
  const vectorContext = getVectorContext(e);
  e.context.globalCompositeOperation = "destination-in";
  clipLayer.getSource().forEachFeature(function (feature) {
    vectorContext.drawFeature(feature, style);
  });
  e.context.globalCompositeOperation = "source-over";
});