Unable to display google maps in a dojo layout - google-maps

I am a real newbie in programming and now I have to combine Google Maps and Dojo. Both alone are fine but when I try to implement a Google Map into a Dojo content pane which is embedded in a border-container it simply does not work. I think there is a problem with the naming of the divs but perhaps there is something else to take care of?
Could someone post the simplest possible solution?
many thanks

I was able to figure it out myself.
Here is the answer:
Actually I was going to use ArcGIS Server Javascript extension for GoogleMaps and Dojo together. Thus we have to sure that all references to APIs are made correctly.
I think it is wise to use the Dojo components directly from the ArcGIS Server-API pages instead of loading from the DOJO network. This should guarantee the compatability between all components.
<!--Load Google Maps API -->
<script src="http://maps.google.com/maps?file=api&v=2&key=ABQIAAAA22G6YWIfghc6CfXo3jGlQBQIhNZriPAS64ZF0ztgQFnJUtUvlhSuBly8ueb8pLmxY8qzKANsSXJhUA" type="text/javascript"></script>
<!--load arcgis-javascript for googlemaps api -->
<script src="http://serverapi.arcgisonline.com/jsapi/gmaps/?v=1.4" type="text/javascript" ></script>
<!--load arcgis js api -->
<script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=1.4"></script>
<!--load the required Dojo components -->
<script type="text/javascript">
dojo.require("dojox.data.XmlStore");
dojo.require("dojox.grid.DataGrid");
<!--This loads the esri specific geoprocessing tool -->
dojo.require("esri.tasks.gp");
<!-- defining variables -->
var gmap = null;
var dynMapOv = null;
</script>
Then, after the initializing function is set up...
function initialize() {
//Load Google Maps
gmap = new GMap2(document.getElementById("gmap"));
var centerat = new GLatLng(-1, 23.7);
gmap.setCenter(centerat, 3); ...
... one has to ensure load the function with
dojo.addOnLoad(initialize);
Furthermore, it is important to put a reference to the the dojo-theme in the body tag of the HTML code.
<body class="soria" onunload="GUnload();">
I hope this very basic stuff helps someone who is not sure about how to combine AGS+GoogleMaps+Dojo.

Related

google map api v3 in app

I am creating an app that uses google map. i inserted the map api key inside the html page.
<script type="text/javascript" src="https://maps.googleapis.com/maps/api /js?key=AIzaSyDcvUkjiKRkJ2zV8cYElZy55JLZDjiL9g8&sensor=false"></script>
i keep getting error saying " Google has disabled use of the Maps API for this application. The provided key is not valid Google API key, or it is not authorized for google Maps Javascript API v3 on this site ". i just followed whatever they had mentioned in here
https://developers.google.com/maps/documentation/javascript/tutorial#api_key
i don't have any problem when run this code in my html. Only problem is that some of the map page don't render out properly. Which version is better to use V2 or V3 ?
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
i am kinda confused. Can someone help me out what i doing wrong or what do i need to do. Since my app is totally based google map. Thanks
I see two possibilities for you:
Either you use this line in your code <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=CHANGE_YOUR_KEY_HERE&sensor=false"></script> and you generate a new key for you application: https://developers.google.com/maps/documentation/javascript/tutorial#api_key
(on the screenshot you can see the link "Generate new key...")
Or you use this line without bothering with having a key. (for example: http://jsfiddle.net/LZmQ2/)

Is it possible to load jQuery UI from local if google cached version is unavailable?

I have a page that uses jQuery UI. Ideally I would like to use the google cached version if possible, but if that was unavailable I would like to fall back on a local version.
Is this possible? I have been hunting through the html <script> tag reference but cant find anything to do a check and fallback.
You can do something like this (while of course changing the URLs to suit your needs):
<script src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script>
<script>window.jQuery.ui || document.write('<script src="/libs/jquery-ui.js"><\/script>');</script>
This was answered before:
Best way to use Google's hosted jQuery, but fall back to my hosted library on Google fail
The same applies for jQueryUI ofcourse.
<script src="/path/to/external/jqueryui"></script>
<script>
if (!window.jQuery.ui) {
document.write('<script src="/path/to/local/jqueryui"><\/script>');
}
</script>

The provided key is not a valid Google API key Ext JS issue

I got some issue in Google Map api in my project. I didn't handled anything related to this part and it was working fine before today.
But now, If i run the application, i got this popup msg and after that, the pages that are using google map api aren't working with this error.
I googled and followed this step.
1) https://code.google.com/apis/console/b/0/#project:40595208241:access
2) generate a new key
3) copy the new key to the index.htm inside key value
<script src="http://maps.google.com/maps?file=api&v=2.x&key=AIzaSyAJz86xjTce_oqnSTw8MoNaY-13tIx03XU" type="text/javascript"> </script>
<script type="text/javascript" src="extJS-ux/GMapPanel.js"></script>
<link href="extJS-ux/Ext.ux.grid.RowActions.css" rel="stylesheet" type="text/css" />
<script src="http://www.google.com/jsapi?key=AIzaSyAJz86xjTce_oqnSTw8MoNaY-13tIx03XU" type="text/javascript"></script>
<script type="text/javascript">
google.load('search', '1');
</script>
So i've followed this same step, but now it doesn't work anymore. It doesn't show the error msg anymore, but it doesn't also show up the result. It says no result and do nothing. It worked right yesterday!!
I tried to do some other ways, but there wasn't a good solution for this.
Can you help me with this?
You are using v=2.x (the "experimental version). That is not recommended for production sites. It might start working if you call for v=2 or v=2.s (the "stable" version), if this was a change in the API.
Note that you are using v2 of the Google Maps API which is deprecated and may stop working May 19, 2013; definitely not recommended for production sites.

Loading multiple maps libraries with javascript

I am trying to load both the maps library and the places library with javascript so I can embed a map into my page, use google.maps.geometry.spherical functions and make places search requests but I'm having trouble loading all 3 libraries.
At the moment I am importing:
<script type="text/javascript"src="http://maps.google.com/maps?key=mykey"></script>
<script type="text/javascript"src="http://maps.googleapis.com/maps/api/js?sensor=false&libraries=places"></script>
But I get the errors:
syntax error
[Break On This Error]
...gs4d .gbmac,.gbes#gbg4 #gbgs4d .gbmac{margin:34px 0 0}.gbemi#gb #gbgs4d .gbmac,....
maps?k...hrkDAmw (line 1)
GClientGeocoder is not defined
[Break On This Error]
var geocoder = new GClientGeocoder();
Where am I going wrong?
Thanks a lot.
The first script doesn't point to a javascript, this will try to load the maps-homepage as a script(of course this will fail).
There is no need to include multiple scripts, simply use:
<script type="text/javascript"
src="http://maps.googleapis.com/maps/api/js?libraries=geometry,places&sensor=false">
This will load the maps-API(V3) and includes the places+geometry-libraries
https://developers.google.com/maps/documentation/javascript/libraries?hl=en
However, as Colin said, this looks like V2-code.
You can use it in this way
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=YOUR_KEY&libraries=places"></script>

How to load Google ClientLocation API without loading the whole Google Maps API?

All I want to do is find out the person IP address so that I can reverse geocode it to find out their latitude and longitude from which they are viewing my web site from.
I can do that using Google ClientLocation API but it's unclear to me if I have to load the huge Google Map framework just to use it.
Is it possible to simply use the ClientLocation API without having to load all of Google Maps? If so, how?
Yes, you only need to use the ClientLocation object in the google.loader namespace so you need not reference the maps api or anything else. For example.
<script src="http://www.google.com/jsapi" language="javascript"></script>
<script language="javascript">
if (google.loader.ClientLocation != null) {
alert(google.loader.ClientLocation.address.city);
} else {
alert("Not found");
}
</script>
The properties available are
google.loader.ClientLocation.latitude
google.loader.ClientLocation.longitude
google.loader.ClientLocation.address.city
google.loader.ClientLocation.address.country
google.loader.ClientLocation.address.country_code
google.loader.ClientLocation.address.region
<html>
<head>
<script language="JavaScript" src="http://j.maxmind.com/app/geoip.js"></script>
<br>Country Name:
<script language="JavaScript">document.write(geoip_country_name());</script>
<br>City:
<script language="JavaScript">document.write(geoip_city());</script>
<br>Latitude:
<script language="JavaScript">document.write(geoip_latitude());</script>
<br>Longitude:
<script language="JavaScript">document.write(geoip_longitude());</script>
</head>
<body>
Hope this will be useful for you
</body>
</html>