Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript

Posted by Ayesha Arthur
Ayesha Arthur
3,025 Points

Adding a Dynamic Map: Code Challenge 7/7

What is wrong with my code? The task is: Set the "theMap" to a new google.maps namespaced "Map" object with the parameters of "mapElement" and "mapOptions" and it is not going through. Help me, I've been stuck on this challenge for hours. 

<!DOCTYPE html>
<html>
<head>
    <title>Map</title>
    <style type="text/css">
    body, html {
        margin:0;
        padding:0;
    }
    body, html, #map {
        width:100%;
        height:100%;
    }
    </style>
</head>
<body>
  <div id="map">
    <script type="text/javascript"
      src="https://maps.googleapis.com/maps/api/js?key=AIzaSyAn8fk75K8kCdW6pQ4B7yoBHJNrUbleieY&sensor=false"></script>

<script type="text/javascript">
    var mapOptions = {
    center: new google.maps.LatLng(28.42, -81.58),
    zoom: 18,
    mapTypeId: google.maps.MapTypeId.SATELLITE
  };

    var mapElement = document.getElementById("map");
var theMap = new google.maps.Map(mapElement, mapOptions);
</script>
</body>
</html>

3 Answers

Jah Chaisang
Jah Chaisang
7,157 Points
Jah Chaisang
Jah Chaisang
7,157 Points

One thing that I noticed, you missed the </div> close tag after <div id="map">. Other than that, you code seems to get through on my end.

Ayesha Arthur
Ayesha Arthur
3,025 Points

Thank you, It should look like this:

 <div id="map"></div>
Nick Manring
Nick Manring
11,369 Points
Nick Manring
Nick Manring
11,369 Points

Hmmm this is interesting, I had the same problem and this fixed it, but my code was like this before task 6 and i had to close the div after the script for the map to make it work... any ideas on that?

jimh
jimh
6,872 Points
jimh
jimh
6,872 Points

I was having the same problem ("...looks like Task 2 is no longer running") until I moved the closing </div> tag up to the same line as the opening <div> tag as suggested by Ayesha above. This solved the problem for me too, but I'm not sure why.

Thanks Ayesha.