我在地图上显示了传单的标记,标记的名称显示在右侧面板的div上.当我点击此列表时,我想在相关标记上显示弹出窗口.我必须在右侧面板上点击选中的文字,但我该如何显示.

到目前为止,这是我尝试过的代码.

var gjLayer = L.geoJson(testCities, {
  onEachFeature: onEachFeature
});

function onEachFeature(feature, layer) {
  layer.on('click', function(e) {
    let feature = this.feature;
    let content = "<b>Name:</b> " + feature.properties.name;

    e.latlng.layer.bindPopup(content);
  });
}
$(function() {
  let res;
  const distance = 10000;
  const longitude = myloc.lng;
  const latitude = myloc.lat;

  res = leafletKnn(gjLayer).nearest(
    [longitude, latitude], 5, distance);

  for (i = 0; i < res.length; i++) {
    var popup = res[i].layer.feature.properties;
    map.addLayer(res[i].layer);
    searchResult(popup);
  }

  function searchResult(result) {
    item = '';
    item = '<div class="item">' + '<div class="content">' + '<a class="header">' + result.name + '</a></div></div>';
    $(".ui.list").append(item);
  }

  $('.content').on('click', function(e) {
    let content = $(this).text();
    onEachFeature(content);
  })
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="container">
  <div class="row">
    <div id="map"></div>
  </div>

  <div class="right-panel">
    <h3>Nearby Search Result</h3>
    <div id="results">
      <div class="ui list"></div>
    </div>
  </div>
</div>

解决方法:

您只需在click事件上添加L.popup()即可.可能会比以后需要添加一些样式.

$('.content').on('click', function(e) {
    let content = $(this).text();
    let your_location= new L.LatLng(-42.8585,147.2468);

    var popup = L.popup()
        .setLatLng(your_location)
        .setContent('<p>Hello world!<br />This is a nice popup.</p>')
        .openOn(map);
})