javascript - 如何在传单js中使用标记传递数据

Question

我在我的项目中使用 leaflet js 和 openstreetmap。
我的 map 中的同一位置有多个圆圈标记。
我想在该圆圈标记中存储一些 Id，以便我可以识别单击圆圈标记时应引用哪些数据。

我的圆圈标记是

var myMarker = L.circleMarker(myPoint, { title: 'unselected', radius: 20 });
myMarker.addTo(map); 

在这里，我将标题用于其他目的，这就是我不能使用它的原因。 谁能告诉我一些方法来做到这一点。

Answer 1

听起来您想向现有类添加新功能(函数、属性等)。为此使用面向对象的原则是有意义的。为此，我建议您扩展 CircleMarker 类以添加这些属性。

customCircleMarker = L.CircleMarker.extend({
   options: { 
      someCustomProperty: 'Custom data!',
      anotherCustomProperty: 'More data!'
   }
});

现在，当您创建圆形标记时，请创建扩展对象的实例。

var myMarker = new customCircleMarker(myPoint, { 
    title: 'unselected',
    radius: 20,
    someCustomProperty: 'Adding custom data to this marker!',
    anotherCustomProperty: 'More custom data to this marker!'
});
myMarker.addTo(map);

现在您可以像从标记中获取任何其他选项一样获取属性。这只是一个简单的扩展案例，您可以根据需要做更多的事情，例如向对象添加其他属性或函数。

JSFiddle 示例:JSFiddle