All geek questions in one place

Map is not displayed. Google Maps V3 API

Code with API V3.

function initialize () { if (GBrowserIsCompatible()) { var ch = new GLatLng (0,0); var myOptions = { zoom:7, center: ch, mapTypeId: google.maps.MapTypeId.ROADMAP } map = new google.maps.Map(document.getElementById("map"), myOptions); directionsDisplay = new google.maps.DirectionsRenderer(map, document.getElementById("map")); directionsDisplay.setMap(map); } }

Code with API V2.

 function initialize () { if (GBrowserIsCompatible()) { map = new GMap2 (document.getElementById("map")); map.setCenter (new GLatLng(0,0),1 ); } }

The API V2 code worked flawlessly, the API V3 code is NOt, which displays any map. What is the point of what I am missing?

EDIT V3 code has been changed as follows, but there are no cards yet:

 var chicago = new google.maps.LatLng (0, 0); var myOptions = { zoom:1, center: chicago, mapTypeId: google.maps.MapTypeId.ROADMAP } map = new google.maps.Map(document.getElementById("map"), myOptions);
+6
source share
5 answers

Make sure you download the correct Google Maps API, which has a div tag with a map id and (for a good estimate) that gives the div the size and width. (It might be better to put the height and width in the stylesheet, but for clarity, I will include it in the line here.)

Here is a web page with your code after editing. Give it a try. It works for me.

 <html> <head> <title>Google Map test</title> <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> </head> <body> <div id="map" style="height:500px;width:500px"></div> <script> var chicago = new google.maps.LatLng (0, 0); var myOptions = { zoom:1, center: chicago, mapTypeId: google.maps.MapTypeId.ROADMAP } map = new google.maps.Map(document.getElementById("map"), myOptions); </script> </body> </html>
+13
source

In V3, all names are changed. For example, GLatLng now google.maps.LatLng . You will need to review the code to use the new names.

A link to documents if you don’t have one

+1
source

There is no GLatLng in v3, change it to google.maps.LatLng

 center: chicago,
+1
source

I had the same symptoms, my v2 maps did not display with V3. When I look in the browser console logs, I see an error: Uncaught ReferencedError: GBrowserIsIncompatible is not defined.

In the Guide to porting Google V2 to V3 , GBrowserIsIncompatible is no longer supported. I did not find an alternative and simply removed the logic associated with this function. This site offers to simply remove the feature .

I found other migration issues that are described in the Google Migration Guide above.

0
source

1- Make sure your Google Map API key is correct.

2- It may not be included in your Google Map console.

3 mistakenly included the location API instead of the map API.

0
source

Source: https://habr.com/ru/post/889379/

More articles:


All Articles