Нажмите на маркер открытых слоев версии 5 - PullRequest
Новая
       15

Нажмите на маркер открытых слоев версии 5

1 голос
/ 28 мая 2019

Я использую библиотеку открытых слоев версии 5. Мне нужно событие onClick для маркера для выполнения бизнес-логики. Кто-нибудь может помочь мне с этим, спасибо. Я перепробовал каждый код и фрагменты. Я использую эту библиотеку для реагирования JS. 

import Feature from "ol/Feature";
  import point from "ol/geom/Point"
  import Style from "ol/style/Style";
  import Icon from "ol/style/Icon";

renderMap = (lat = 24.8856802, lng = 67.0830459) => {
    console.log(lat, lng);
    this.map = new Map({
      target: 'map',
      layers: [
        new TileLayer({
          source: new OSM()
        })
      ],
      view: new View({
        center: fromLonLat([lng, lat]),
        zoom: 17,

      })
    });


    this.makeMarker(24.8856802, 67.0830459, 0);


  }
//here is my marker function 
makeMarker = (lat, lng, index) => {
    let marker = new Feature({
      geometry: new point(fromLonLat([lng, lat])),

    });
    marker.setStyle(new Style({
      image: new Icon(({
        // crossOrigin: 'anonymous',
        src: require("../../assets/images/location-pin.png"),
    enter code here`enter code here`


      }))
    }));
    let vectorSource = new Vector({ features: [marker] })
    var markerVectorLayer = new LVector({
      source: vectorSource,


    });
    this.map.addLayer(markerVectorLayer);
    marker.on("click", () => {
      alert()
    })



  }

1 Ответ

1 голос
/ 28 мая 2019

Функции не имеют событий клика. Как и в этом примере https://openlayers.org/en/latest/examples/icon.html, вам нужно будет прослушать щелчок на карте, проверить, есть ли функция в пикселе щелчка, а также эта функция является вашим маркером 

  map.on('click', function(evt) {
    var feature = map.forEachFeatureAtPixel(evt.pixel,
      function(feature) {
        return feature;
      });
    if (feature === marker) {
...