0

I am having trouble with addMarker in pset8. The markers are only shown one by one each time I pan or zoom in/out the view. And after 10 moves it keeps adding markers (limitation to 10 isn't working). Also when I click the marker it doesn't open the infoWindow. Can someone please help me? I have no clue what is wrong.

function addMarker(place) {

// extract the place latitude and longitude
var myLatLng = new google.maps.LatLng(place["latitude"], place["longitude"]);

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

// get articles for place
$.getJSON(Flask.url_for("articles"), {geo: place.postal_code}, function(articles) {

    // Only display infowindow if articles exist
    if (!$.isEmptyObject(articles))
    {
        // start Unordered List
        var articlesContent = "<ul>";
        for (var i = 0; i < articles.length; i++)
        {
            //Each list item is stored into articlesString
            articlesContent += "<li><a target='_NEW' href='" + articles[i].link
            + "'>" + articles[i].title + "</a></li>";
        }
    }

    // close the unordered list of articles
    articlesContent += "</ul>";

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

// add marker to the map markers
markers.push(marker);
}
0

The script.js distro code has changed, and doesn't (seem to) match the Mashup specification, specifically in the search section. From the spec:

Notice that we’re using getJSON's "Promise" interface, per http://api.jquery.com/jquery.getjson/. Rather than pass an anonymous function directly to getJSON (to be called upon success), we’re instead "chaining" together calls to getJSON, done (whose argument, an anonymous function, will be called upon success), and fail (whose argument, another anonymous function, will be called upoon failure). See http://api.jquery.com/jquery.ajax/ for some additional details. And see https://davidwalsh.name/write-javascript-promises for an explanation of promises themselves.

A prior version of script.js had this script for search, which does use the promise interface:

function search(query, syncResults, asyncResults)
 {
     // get places matching query (asynchronously)
     var parameters = { 
         q: query
     };
     $.getJSON(Flask.url_for("search"), parameters)
     .done(function(data, textStatus, jqXHR) {

         // call typeahead's callback with search results (i.e., places)
         asyncResults(data);
     })
     .fail(function(jqXHR, textStatus, errorThrown) {

         // log error to browser's console
         console.log(errorThrown.toString());

         // call typeahead's callback with no results
         asyncResults([]);
     });

You want to use the done method so that it waits for the results. You can use this function as your guide. And of course the documentation.

Take one problem at a time so you can more easily determine what is a cause and what is an effect.

8
  • Hello! Thank you! I hadn't realized it. I'll look for the documentation and the done method. Thanks again! – luisavdornelles Dec 9 '18 at 23:05
  • just to be clear. The script distro matches the spec for the CS50x 2018 course, which I assume you are using? docs.cs50.net/2018/x/psets/8/mashup/mashup.html – curiouskiwi Dec 10 '18 at 2:29
  • @curiouskiwi I use cs50.tv to download specs and distros from Fall 2017 (no login, much easier navigation than edX). Historically that would track to CS50x 2018. That spec describes the promise in the search section; the distro has script.js from 2-nov-2017 without the promise. The "mismatch" was first reported on this post. – DinoCoderSaurus Dec 10 '18 at 12:52
  • @DinoCoderSaurus unfortunately, google changed the maps api mid-2018, so we had to make changes to both the distro code and the spec that the 2018 edX course was using. We don't historically go back and update the "no longer current" versions, so I can understand where the confusion comes from. – curiouskiwi Dec 10 '18 at 19:36
  • @curiouskiwi, does this mean that the current version of the scripts.js distro code and spec for 2018 is ok to use for the problem set? – soonthoj May 8 '19 at 8:51

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .