openlayers獲取地圖點擊位置的信息

1、地圖點擊事件

單擊:

      /* 監(jiān)聽地圖的單擊事件,如果點擊的是矢量元素則進行相關(guān)操作 */
      // selfMap.OlMap===map
      selfMap.OlMap.on('click', (evt) => {
        /* 檢測視口中的矢量特征 */
        const featureInfo = selfMap.OlMap.forEachFeatureAtPixel(evt.pixel, (feature, layerVetor) => feature);
        console.log(featureInfo);
        if (featureInfo) {
          // console.log(featureInfo.get('point'));
          dkqj();
        }
      });

雙擊:

    // mapMode.ol===map
    mapMode.ol.on('dblclick', (a) => {
        /* // eslint-disable-next-line prefer-destructuring
        pointLngLat.latitude = a.frameState.extent[1];
        // eslint-disable-next-line prefer-destructuring
        pointLngLat.longitude = a.frameState.extent[0]; */
        const { extent } = a.frameState;
        /* 范圍坐標 */
        geomWKT = `POLYGON((${extent[0]} ${extent[1]},${extent[0]} ${extent[3]},${extent[2]} ${extent[3]},${extent[2]} ${extent[1]},${extent[0]} ${extent[1]}))`;
        tolerance = mapMode.ol.getView().getResolution() * 4;
        getThemeTree();
        drawerVisible.value = !drawerVisible.value;
      });

2、特征要素選擇Select

      /* 監(jiān)聽特征元素(消防報警點)的點擊事件 */
      const select = new Select();
      selfMap.OlMap.addInteraction(select);
      select.on('select', (e) => {
         // console.log(e.selected[0].get('name')); //已選擇的Feature的name屬性
        const features = e.target.getFeatures().getArray();
        console.log(features);
        if (features.length > 0) {
          // const feature = features[0];
          console.log('點擊特征元素');
          dkqj();
        }
      });
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容