CS50 PSet8混搭-标记不在Google地图上显示

时间:2018-12-22 17:05:43

标签: javascript cs50

我正在研究CS50混搭问题集。 application.py运行正常,我已经检查了/ articles和/ search的输出,所有显示都应该如此。

但是scripts.js中的某些内容不起作用。我已经基于Google Maps文档实现了addMarker()和removeMarkers(),但是这些标记只是没有显示在地图上。 Stuff的解决方案网站一切正常,当我移动/拖动地图时,它会在附近的位置渲染一些标记。但是,当我在地图上执行相同操作时,它保持空白。

function addMarker(place)
{
var myLatLng = {lat: place.latitude, lng: place.longitude};

var image = {
    url: 'https://developers.google.com/maps/documentation/javascript/examples/full/images/beachflag.png',
    size: new google.maps.Size(20, 32),
    origin: new google.maps.Point(0, 0),
    anchor: new google.maps.Point(0, 32)
};

var marker = new google.maps.Marker({
    position: myLatLng,
    map: map,
    title: place["place_name"] +", "+ place["admin_name1"],
    label: place["place_name"] +", "+ place["admin_name1"],
    icon: image
});

// get articles for place
$.getJSON(Flask.url_for("articles"), {geo: place["postal_code"]}, function(articles)
{
    if (!$.isEmptyObject(articles))
    {
        // Construct the HTML list of articles
        var articles_list = "<ul>";
        for (var i = 0; i < articles.length; i++)
        {
            articles_list += "<li><a href='" + articles[i].link + "'>" + articles[i].title + "</a></li>";
        }
        articles_list += "</ul>";
    }

    // listen for clicks on marker
    google.maps.event.addListener(marker, 'click', function()
    {
        showInfo(marker, articles_list);
    });
});

// remember marker
markers.push(marker);
}

1 个答案:

答案 0 :(得分:0)

好吧,想通了。如果有人要寻找这个问题,请将其张贴在答案中。

function addMarker(place)
{
var myLatLng = {lat: place.latitude, lng: place.longitude};

var marker = new google.maps.Marker({
    position: myLatLng,
    map: map,
    title: place.place_name +", "+ place.admin_name1,
    label: place.place_name +", "+ place.admin_name1
});

marker.setMap(map);

// get articles for place
$.getJSON("/articles", {geo: place.postal_code}, function(articles)
{
    // Construct the HTML list of articles
    var articles_list = "<ul>";
    for (var i = 0; i < articles.length; i++)
    {
        articles_list += "<li><a href='" + articles[i].link + "'>" + articles[i].title + "</a></li>";
    }
    articles_list += "</ul>";

    // listen for clicks on marker
    marker.addListener("click", function()
    {
        showInfo(marker, articles_list);
    });
});

// remember marker
markers.push(marker);
}