Question

Trying to create a PhoneGap mobile app. Totally new to mobile apps, phonegap, and JS so bear with me. This is where I’m at:

 <script type="text/javascript">
 function initialize() {
    var mapOptions = {
      center: new google.maps.LatLng(40.710,-73.994), //New york, NY
      zoom: 8,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    var map = new google.maps.Map(document.getElementById("map_canvas"),
        mapOptions)
};

With that, the map renders in the browser just fine. When adding the following that I’ve found in a number of tutorials it refuses to render anything. I am trying to do all of this in the googlemap/index.html page that I have created.

<script type="text/javascript">
 function initialize() {
    var mapOptions = {
      center: new google.maps.LatLng(40.710,-73.994), //New york, NY
      zoom: 8,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    var map = new google.maps.Map(document.getElementById("map_canvas"),
        mapOptions);
    var LatLng = new google.maps.LatLng(40.710,-73.994)
    var marker = new.google.maps.Marker({
        position: myLatLng,
        title: "hello world!"
        });
    marker.setMap(map);
};

When I add the following, the entire page refuses to render.

Basically, I’m using the above method to display a google map, and I’m trying to add a pin to the center location. Seems simple enough but proving to be beyond my abilities.

Answer 1

You have a syntax error on this line:

var marker = new.google.maps.Marker({

Notice that there is a dot between the new operator and the class name.

To fix, replace the line above with:

var marker = new google.maps.Marker({

Happy mapping!

PS: The error was reported in the (desktop) browser’s console, I’m not sure how you’d see the same on an Android device.