初始化后如何找到 Leaflet 地图对象

Question

我想改变一个已经由另一个脚本初始化的地图上的一些东西，使用Leaflet库。这个其他脚本没有将地图对象存储在全局变量或我可以使用我的脚本访问的任何其他位置。因此，目前我的页面上有一个地图，但我没有地图对象。

我想做的是检索已初始化地图的对象，以对其进行更改。例如，如果存在函数L.getMap('myID')，我想使用这样的方法检索与容器myID相关联的地图对象。

简而言之：是否有一种方法可以使用容器的ID获取已初始化的leaflet地图的地图对象？

- Joeytje50

---

你如何初始化你的地图？ - Fabiano Taioli

其他脚本是什么？ - Fabiano Taioli

@FabianoTaioli 我正在开发一个MediaWiki扩展，它使用https://www.mediawiki.org/wiki/Extension:Maps来加载地图。我尝试查看该扩展的代码，但似乎没有将“map”变量存储在任何可访问的位置。 - Joeytje50

我对Mediawiki Maps扩展没有经验，但是我在源代码中找到了此JS文件，它指出创建了一个window.maps变量，其中包含一些地图的列表。我不知道它是否包含地图对象或者只是一个（即将被初始化的）地图列表... - Sidney Gijzen

你有在地图初始化之前执行一些JS的可能性吗？ - ghybs

@ghybs，是的，我有。那会为这个问题创建另一个解决方案吗？如果您有另一种解决方案，我也想邀请您回答这个问题。目前Fabiano Taioli的解决方案对我非常好，因为我正在使用mediawiki，但它可能在其他情况下无法工作。 - Joeytje50

Answer 1

记录一下，如果您有可能在地图初始化之前注入/执行一些JS代码（即在“其他脚本”执行之前），您可以非常容易地自定义Leaflet以保留对每个创建的地图的引用。

例如，在L.Map类上使用addInitHook constructor hook：

// Before map is being initialized.
var mapsPlaceholder = [];

L.Map.addInitHook(function () {
  mapsPlaceholder.push(this); // Use whatever global scope variable you like.
});

// "Other script", can be in its own separate <script> and JS file.
L.map('mapId'); // The map object is pushed into `mapsPlaceholder` array.

// Then retrieve the map object to further manipulate the map.
var map = mapsPlaceholder.pop();

演示: https://plnkr.co/edit/mywpSbfRPFOnJ8c1RNsZ?p=preview

- ghybs

---

谢谢您的回答！这看起来是一个非常优美的解决方案。我会保留我的采纳答案在Fabiano那里，因为那是我要使用的方法，但这似乎是一个更普遍适用的解决方案。感谢您发布这个！ - Joeytje50

太棒了！运行得很好！谢谢你。 - PPPHP

Answer 2

您可以从由Mediawiki扩展程序创建的全局数组中访问该地图。

例如：要访问页面上的第一个地图。

window.maps.leafletList[0].map.getCenter()

- Fabiano Taioli

---

我收到了一个“TypeError: window.maps未定义”的错误。 - Rajesh

@Rajesh：你在使用TypeScript吗？如果是的话，请随时开一个新问题，并提供你具体问题的细节。 - ghybs

Answer 3

如果您正在使用WordPress插件leaflet，您可以像这样访问地图：

window.WPLeafletMapPlugin.maps[0];

- TheToster