Javascript 传单：基于数据源的图标

我正在建立一个网站与传单地图，使用数据源填充地图和弹出窗口。以下是我的JSON数据的外观：

{
  "time_exo": null,
  "time_stm": 1541787833,
  "results": [
    {
      "agency": "STM",
      "icon": "busSTMIcon",
      "vehicle_id": "22210",
      "route_id": "55",
      "trip_id": "188767688",
      "start_time": "12:59:00",
      "start_date": "20181109",
      "current_stop_sequence": 20,
      "current_status": 2,
      "lat": 45.52397,
      "lon": -73.59475
    },
    ...
}

以下是我的JavaScript代码：

 $.get(dataUrl, function(data, pos_status) {
    console.log("pos call result: " + pos_status);
    // show data on map
    data.results.forEach(function(element) {
      L.marker(L.latLng(element.lat, element.lon), {
          icon: busSTMIcon
        }).addTo(posLayer)
        .bindPopup("<h3>" + element.agency + " " + element.vehicle_id + "</h3><b>Trip: </b> " + element.trip_id + "<br><b>Route: </b>" + element.route_id + "<br><b>Start: </b>" + element.start_date + element.start_time + "<br><b>Current stop sequence: </b>" + element.current_stop_sequence + "<br><b>Status: </b>" + element.current_status);
    });
 });

---

目前我使用的是静态方式，这会导致所有标记都具有相同的图标。我希望有基于我的数据源的图标。实现这一点的最佳方法是什么？

如果将图标变量创建为对象的一部分（可以向其中添加其他图标）：

然后你会写

icon: icons[element.icon] 

（而不是

图标：busSTMIcon

）

---

然后它会根据

元素中的字符串动态地从icons对象中选择正确的项目。icon

这是我尝试的，但它不起作用。按照传单的工作方式，您必须首先声明图标：

var busSTMIcon=L.icon（{iconUrl:'https://felixinx.github.io/mtl-gtfs-rt/assets/map-bus-stm.svg”，iconSize:[20,20]}）

原始代码中的

busSTMIcon

变量的内容是什么？好吧，那么我想您需要它，以便

元素。icon

包含

{“iconUrl”：https://felixinx.github.io/mtl-gtfs-rt/assets/map-bus-stm.svg“，“iconSize”：[20,20]}

。您是否能够更改代码以将其输出到JSON中？然后您将编写

icon:L.icon（element.icon）

或者将图标创建为对象的一部分（您可以向其中添加其他图标）：

var icons={“busSTMIcon”：L.icon（{iconur:'https://felixinx.github.io/mtl-gtfs-rt/assets/map-bus-stm.svg’，iconSize:[20,20]}）

然后您将编写

icon:icons[element.icon]

，这样它将根据

element.icon

中的字符串从icons对象中动态选择正确的项。您上一个解决方案确实有效。我没想过那样做。你能把你的答案更新到你最后的评论吗？谢谢

var icons = { 
  "busSTMIcon" : L.icon({ iconUrl: 'https://felixinx.github.io/mtl-gtfs-rt/assets/map-bus-stm.svg', iconSize: [20, 20] }) 
}; 

icon: icons[element.icon]