0

我的代码中有一些 div “连接”到我的地图标记。我的 div 具有唯一的 ID，并且我的标记具有与属性（标题和标记 ID）相同的 ID。单击 div 时有什么方法可以打开标记弹出窗口吗？这是我的代码：

$('#alldealers .dealer').each(function(){
    t = $(this).find('h2').text();
    lat = $(this).find('.lat');
    lng = $(this).find('.lng');  
    userLng = parseFloat($(lng).text());
    userLat = parseFloat($(lat).text());   
    subUniqueNum = $(this).attr('data-link');

    L.mapbox.featureLayer({
        type: 'Feature',
        geometry: {
            type: 'Point',
            coordinates: [userLng, userLat]
        },
        properties: {
            title: subUniqueNum,
            'marker-id': subUniqueNum,
            'marker-size': 'small',
            'marker-color': '#f85649',
        }
    }).bindPopup('<button class="giveMeDetails" data-attr-scroll="'+subUniqueNum+'">'+t+'</button>').addTo(map);   
});

$('.mapicon_wrapper').click(function(e){    
    tot_p = $(this).parent().parent().parent().attr('id');//parent wrapper id:same as marker's ID
    $root.animate({
        scrollTop: $('html').offset().top
    }, 500, function () {

        // This is where I need to open the markers popup with the same title as $this parent ID (tot_p)

    });        
});
4

1 回答 1

1

这种将 ID 分配给标记并在 DOM 中调用它的方法并不可靠：如果标记位于当前查看的地图区域之外，则它不会出现在 DOM 中。一个正确的方法是

var markerLayer = L.mapbox.featureLayer().addTo(map);
var markers = [];
$('#alldealers .dealer').each(function(){
    t = $(this).find('h2').text();
    lat = $(this).find('.lat');
    lng = $(this).find('.lng');  
    userLng = parseFloat($(lng).text());
    userLat = parseFloat($(lat).text());   
    subUniqueNum = $(this).attr('data-link');

    markers.push({
        type: 'Feature',
        geometry: {
            type: 'Point',
            coordinates: [userLng, userLat]
        },
        properties: {
            title: subUniqueNum,
            id: subUniqueNum,
            t: t,
            'marker-size': 'small',
            'marker-color': '#f85649',
        }
    })
});

markerLayer.setGeoJSON(markers);

markerLayer.eachLayer(function (layer) {
  layer.bindPopup('<button class="giveMeDetails" data-attr-scroll="'+layer.feature.properties.title+'">'+layer.feature.properties.t+'</button>');   
});

$('.mapicon_wrapper').click(function(e){    
    var tot_p = $(this).parent().parent().parent().attr('id');//parent wrapper id:same as marker's ID
    $root.animate({
        scrollTop: $('html').offset().top
    }, 500, function () {

        // This is where I need to open the markers popup with the same title as $this parent ID (tot_p)
    markers.eachLayer(function (layer) {
      if (layer.feature.properties.id === tot_p) {
        layer.openPopup();
      }
    });
    });        
});
于 2016-05-05T12:34:10.330 回答