0

我正在使用 leaflet.js 制作地图并从 json 文件构建弹出气泡 html。pic除了我已添加到 json 数据中的一个新字段 外，气泡正在被有效填充。我不明白为什么它没有被加载——它只是被浏览器渲染为“未定义”。谁能建议为什么它可能没有被阅读？我认为这些是相关文件的重要部分。

data.json（摘录）

[
  {
    "name": "Billys",
    "address": "297 Mare Street, Hackney",
    "lat": "51.545829",
    "lng": "-0.055408",
    "pic": "billy.jpg",
    "year": 2013.0
  },
  {
    "name": "Folber",
    "address": "227 Mare Street",
    "lat": "51.544397",
    "lng": "-0.05524",
    "pic": "folber.jpg",
    "year": 2013.0
  }
]

map.js（摘录）

function initialize() {
    var layer = new L.StamenTileLayer("holds");
    var map = new L.Map("map", {
        attributionControl: false,
        center: new L.LatLng(51.545094, -0.05609),
        zoom: 15
    });
    map.addControl(new L.Control.Attribution({
        prefix: 'Map tiles by <a href="http://stamen.com">Stamen Design</a>, under <a href="http://creativecommons.org/licenses/by/3.0">CC BY 3.0</a>. Data by <a href="http://openstreetmap.org">OpenStreetMap</a>, under <a href="http://creativecommons.org/licenses/by-sa/3.0">CC BY SA</a>.'
    }));

    map.scrollWheelZoom.disable();
    map.addLayer(layer);


    $.getJSON('data.json', function (data) {
        places = data;
        for (var i in places) {
            place = places[i];
            markers[i] = L.marker([place['lat'], place['lng']]).addTo(map);
            markers[i].bindPopup('<div class="popup-words"><b>' + place['name'] + "</b><br/>" + place['address'] + "</div>" + "<img alt='" + place['name'] + "' src='img/logos/" + place['pic'] + "' width='60px' height='30px' class='popup-image'/>");
        }
        updateSlider(2013);
        play();
    });
}
4

0 回答 0