javascript - 带有实时数据的传单弹出窗口

Question

我对使用传单 map 相当陌生，我正在尝试找出一种方法让 map 在弹出窗口中显示实时数据。具体来说，我正在使用国家气象局当前的天气观测结果。现在我只是对我想使用的所有网站进行硬编码，如下所示:

var marker = L.marker([41.15789, -104.80812])
     .bindPopup('Site: Cheyenne ASOS <br> <a href="http://w1.weather.gov/data/obhistory/KCYS.html">Current Observations</a>')
     .addTo(map);

我总共有大约 100 个网站。我尝试让用户在单击网站时自动显示天气，而不是用户必须单击网站才能获取天气。这样它就会显示温度、湿度、风等。

如果您有任何见解或可以在哪里找到更多相关信息，我将不胜感激!

Answer 1

如果您想将国家气象局的数据动态插入到您的 map 中，您可以使用National Weather Service API

从那里，您可以在页面加载时调用 API，然后将数据放入标记中。您可以在 leaflet documentation 中了解如何执行此操作。

例如，您可以这样做:

var popup = L.popup()
    .setLatLng(latlng)
    .setContent('<p>Insert html to show weather info here</p>')
    .openOn(map);