使用 Mapbox 一起添加自定义图标和标记数据

Posted 2023-02-23

【中文标题】使用 Mapbox 一起添加自定义图标和标记数据

【英文标题】：Adding custom icon and marker data together using Mapbox

【发布时间】：2014-10-12 11:44:58

【问题描述】：

我是 mapbox 的新手，我有一个简单的问题。我制作了一个要素图层和一个自定义图标列表。如何将两者相加？

我的要素图层格式如下：

L.mapbox.featureLayer(
     "type": "Feature",
     "geometry": 
     "coordinates": [
     '.$long.','.$lat.'
     ],
     "type": "Point"
     ,
     "properties": 
     "title": "'.$business_name.'",
     "description": "'.$address_1.', '.$address_2.', '.$address_3 .', '.$postcode .'"
     
     ).addTo(map);

下面是我的自定义标记示例

var accomodation = L.icon(
    iconUrl: '/img/pins/day-and-night/accommodation.png',
    iconSize: [46, 62],
    iconAnchor: [8, 60],
    );

任何帮助都是完美的。

谢谢

【参考方案1】：

从您的代码中，我假设您在谈论 mapbox.js，它是leaflet.js 的衍生物

如果是这样，我想你要找的是leaflet layer groups

所以，在你的情况下......

var featureLayer = L.mapbox.featureLayer(
   "type": "Feature",
   "geometry": 
   "coordinates": [
      '.$long.','.$lat.'
   ],
   "type": "Point"
   ,
   "properties": 
      "title": "'.$business_name.'",
      "description": "'.$address_1.', '.$address_2.', '.$address_3 .', '.$postcode .'"
   
   );

var accomodation = L.icon(
   iconUrl: '/img/pins/day-and-night/accommodation.png',
   iconSize: [46, 62],
   iconAnchor: [8, 60],
);

var layergroup = L.layerGroup([featureLayer, accomodation]);

layergroup.addTo(map);