唯一识别的传单标记


Uniquely identifying Leaflet Markers

我之前对这个话题做了一些研究,但我还没有找到我这个问题的答案。我目前正在与Leaflet.js工作。每个标记都有从MySQL数据库中提取的弹出文本。但是,其中一些数据不会显示在弹出窗口中,而只与标记相关联。

我想做的是每当一个特定的标记被点击,与它相关联的数据是在一个位置而不是在弹出(即。在DIV中)。

是否有一种方法可以唯一地标识一个标记,以便您可以提取与之相关的数据并在其他地方回显它?

编辑:

下面是一些代码,使事情更清楚一些:

这是我的一些JS:

var json_data = <?php echo json_encode($data); ?>;
for (var i = 0; i < json_data.length; i++) {
    L.marker([json_data[i].latitude, json_data[i].longitude])
    .bindPopup(json_data[i].firstName + ' ' + json_data[i].lastName + '<br>' + '<strong>Date:</strong>' + ' ' + json_data[i].dateOccurred)
    .addTo(map);
  }

这是我的PHP:

$query = "SELECT * FROM incident, victim WHERE incident.incidentID = victim.incidentID";
//converting the data from mySQL to PHP
$data = array(); //setting up an emtpy PHP array for the data to go into
if($result = mysqli_query($db,$query)) {
  while ($row = mysqli_fetch_assoc($result))
  {
    $data[] = $row;
  }
}
?>

基本上我通过PHP提取数据,然后将其编码为JSON。

还有,谢谢你的帮助,伙计们!!:)

您可以尝试为标记添加自定义属性,然后在onClick事件中获取该属性:

//Handle marker click
var onMarkerClick = function(e){
    alert("You clicked on marker with customId: " +this.options.myCustomId);   
}
//Create marker with custom attribute
var marker = L.marker([36.83711,-2.464459], {myCustomId: "abc123"});
marker.on('click', onMarkerClick);

关于JSFiddle的示例