Web2.0 also means software distributed through API (Application Programming Interface). The ability to leverage features and functionality elsewhere remote is extremely useful in reality as the Internet. In addition to Yahoo, with its ToolKit 2.0 style, even Google - within the & geo-referencing - offers its free tools, in this case for the handling and management of maps.
Google Maps API allows you to insert Google Maps in their own web pages using Javascript.
The first thing to do before you can start to experiment with the API, you register on the site http://www.google.com/apis/maps/ in order to get a key (a UID) on the site of use. In fact, for each Web key is required!
Google provides is a free service that one Enterprise solutions for intranet and uses advanced - see: Google Maps for Enterprise
The free version, however, already solves all possible needs. Awarded the key is automatically proposed a summary page with a Javascript code sample. The first step is to retrieve longitude and latidudine of the area you wish to view.
1 2 3 4 5 6 | ShowMap function () { GBrowserIsCompatible ( ) ) { if (GBrowserIsCompatible ()) { new GMap2 ( document. getElementById ( "map" ) ) ; var map = new GMap2 (document. getElementById ("map")); new GLatLng ( 37.4419 , - 122.1419 ) , 13 ) ; map. setCenter (new GLatLng (37.4419, - 122.1419), 13); } } |
The sample code is quite simple. presente sulla pagina, in questo caso un DIV con id="map" . It is based sull'instanza of a class GMap2() connected to a DIV on the page, in this case a DIV with id="map" .
The complete API documentation then provides further food for display, such as setting the hybrid view - satellite / map - the activation of controls for zoom and movement, the ability to connect a "funny" with a custom display.
One way to activate a series of checks is:
1 2 3 4 5 6 | new GMap2 ( document. getElementById ( "map" ) ) ; var map = new GMap2 (document. getElementById ("map")); new GLatLng ( 37.4419 , - 122.1419 ) ; var center = new GLatLng (37.4419, - 122.1419); center , 17 , G_HYBRID_MAP ) ; // Mappa ibrida map. setCenter (center, 17, G_HYBRID_MAP) / / hybrid map new GMapTypeControl ( ) ) ; map. AddControl (new GMapTypeControl ()); new GLargeMapControl ( ) ) ; map. AddControl (new GLargeMapControl ()); new GScaleControl ( ) ) ; // Zomming map. AddControl (new GScaleControl ()) / / zomming |
You can also associate a GMarker, a "comic strip" with additional guidance and do react to mouse clicks.
1 2 3 4 5 6 7 8 9 10 11 | '<div class="td_testo"><strong>Prova Mio Nome</strong><br />Via Roma, 100<br />00100 - Roma, Italia</div><div class="menu"><a WINDOW_HTML var = '<div class="td_testo"> <strong> Try My Name </ strong> <br /> Via Roma, 100 <br /> 00100 - Rome, Italy </ div> <div class = "menu" > <a get to us </ a> </ div> '; new GMarker ( center ) ; var marker = new GMarker (center); marker ) ; map. addOverlay (marker); marker , 'click' , function ( ) { GEvent. AddListener (marker, 'click', function () { WINDOW_HTML ) ; marker. openInfoWindowHtml (WINDOW_HTML); }); marker , 'infowindowclose' , function ( ) { GEvent. AddListener (marker, 'infowindowclose', function () { center , 2 ) ; map. recenterOrPanToLatLng (center, 2); }); WINDOW_HTML ) ; marker. openInfoWindowHtml (WINDOW_HTML); |
On the website the complete documentation fulfills all our needs, the use of special markers, JSON, Ajax and much more. Among other things, you will find many examples of code examples online. A tool - free - to use immediately!
I can not let him enter the comic ... you can have more information in Italian or an example on how to do?
thanks
@ Villa Centopino: the example is shown in the Post. What problem you are having exactly? By some mistake?
hello
I inserted the comic is not copying and pasting, no error ...
However, continuing to look I solved
hello and thanks
is possible to derive latitude and longitude from the name of the city and the road?
[...] This time I reply to a comment with a post, given the general interest. Armando asked me if it was possible, through Google Maps, Latitude and Longitude obtain from [...]
Hello,
I could use a hand.
I wish my comic was already displayed without having to do the click with the mouse.
Also I wish the comic contains the options "finds the path to HERE and HERE."
And 'one week we sbattola head, give me a manoper favor.
Thanks and see you soon
Thanks!
Hello everyone I wanted to ask why do not I see the markatore mitrova address and not the address ...
2
....
I wrote like this:
2
3
4
5
"load(); onload = "load ();
showAddress ('Road Portichina, LU 20 55049 Viareggio, Italy'); "
"GUnload();" onunload = "GUnload ();"
......
thank you very much
[...] How to add Google Map in your Web - heyos_ad_user = 8748; heyos_ad_type = "G"; heyos_ad_format = "8"; heyos_color_border = "000066"; heyos_color_bg = "FFFFFF"; heyos_color_link = "005B88" = heyos_color_text " 000000 "; heyos_color_url =" 5F5F5F "[...]
[...] Example, in the reminder of this writing remains one of the most viewed post How to insert Google Maps in their own web, with 17410 views. If you have services or products related to Google Map, or at least that [...]
Hej!
Till det här är helt ny med Google MAPS API.
Jag önskar hjälp med att få på plats de-kod som bitar krävs. Följande önskar jag uppnå.
Har en webbsida give a hand fyller the lite uppgifter Dar bland annat adress, stad och land. Man klickar "submit" och så all information Lagras klart the en databas.
Min önskan, att man är nu på en visningssida skall kunna Klicka på en och databasen the post dō hämtas all information och visas på en sida. Det som jag önskar skall ske, är att en karta visas give a hand har en liten pin-point just på den adress, ort land och för den som var registrerad posten.
HUR går för att jag tillväga Skapa that enkelt och bra på ett satt.
Skriver jobbar mot och lite PHP MySQL.
Tacksam om en någon önskar hjälpa okunnig själ!
-Andreas
@ Andreas: Andreas dear, can you write your question in Inglese?
@ Giovan Battista Fazioli:
Hello!
Are completely new to this with the Google Maps API.
I want help to get into place the code-bit as needed. The following, I wish to Achieve.
Have a website where you fill in some data, Which among other things, address, city and country. You click "submit" and all information stored in a database Clearly know.
That is now my wish on a display page is to click on an entry in the database and then retrieved all the information and displayed on a page. What I hope will happen Is that a map shows where you have a small pin-point just at the address, city and country That was registered for the post.
How do I go about to create this in a simple and useful way.
Writes a little PHP and works against MySQL.
Grateful if anyone wishing to help an ignorant soul!
-Andrew
@ Dario: see Reverse Geocoding. Peering into the source of the page you will find the code you need, comunqueq is, the "core" of the solution is:
Add a listener to intercept the click and create an object
GClientGeocoder:2
GClientGeocoder ( ) ; GClientGeocoder geocoder = new ();
The handler of the click using the object
GClientGeocoderto retrieve the information of the place starting from latitude and longitude:2
3
4
5
6
latlng != null ) { if (LatLng! = null) {
address = LatLng;
latlng , showAddress ) ; geocoder. getLocations (LatLng, showAddress);
}
}
Then, finally, the handler
showAddresswill show the details of the place throughplace.addressDo you wonder if you can find a site that acts on the contrary, that is, entering the coordinates you can find the place.
Hello to all!
I ask the hand of experts, because I ran into a problem that I can not fix ... Let me explain:
I use the Google Maps API to make a navigable and zoomable map with extension. georeferenced tiff that is! I found the instructions with which I first of all I realized that my image should be divided into tiles, only on the resources that I found it says you can do this with photoshop or paint shop pro (or some other little program , I think) but it tells me how ... and I'm stuck at this point!
Please ... help me, I really need!
Ola estou querendo pass meu map, ja feito em Google Earth and Maps Api para, para poder ter to visão em meu blog igual um in Google Earth, local em meu computador. If this and Posivel, mas como desconhesco fazerlo. Poderiam give me Algumas dicas de como fazer, or waves procure algum exemplo.
Meu temor ter que es recadastrar cadastrado tudo em meu map, todos os wait point.
Grateful pela ajuda.
Claudio G. Pagliaro
cgpagliaro.arroba.gmail.com
Hi all, I have a problem, I created the API code to insert google maps into my site. In local works without problems but once I insert ke on the Internet and go to visit the page where I get the message is inserted ke the API server rejected your request and that's because the API code is not valid because it generated for another site . What should I do?
@ Enrico beb: you can regenerate the key! Or, better! If you have used "local", as you say, you will have generated a key to a host other than online? In practice you have to generate a key depending on the server on which you use it.
[...] Is really trivial. Let's see the script base to integrate the normal procedure for inclusion of site in the google map. We first see how to turn traditional advertising and then the toolbar [...]
[...] In Adobe Flash, you can use a wide range of external APIs provided by Web services like Facebook, Twitter or Flickr. In this tutorial we will see how to integrate, in a really simple, the services of Google Maps in a movie / application Adobe Flash CS4. I state that the procedure to use Google Maps in Flash is very similar to what happens in HTML / JavaScript (for details see How to add Google Map in your own web). [...]
[...] Has released the API - in Javascript - to enter its maps in any web site Viediamo how to accomplish the same thing with [...]
Excuse me, do you know how to delete google written down "loans"?
I have a map shown as a hybrid, but it is quite small, so the text should be in surplus, and is graphically ugly.
I have a problem, use Flash CS5 on Windows 7, I downloaded the zip file, I copied the component to the specified location, but flash can not find it in the library components .. also if I double-click the component, flash tries to import it but at one point he says "Unexpected file format."
where could be the problem?
@ Alpha: I have never used flash in my life, so I could be wrong but that is a Javascript code, not Actionscript.
@ Wpae:
Zip file of which you speak? This post explains how to use maps with Javascript, perhaps you referring to another article?
Hello I wanted to ask if it was possible, in some way, change those ugly buttons! Maybe with pictures set by us ...
@ Mariano: I do not think it is possible ... maybe you can do is not visualizarli and create your making him do the same thing using the API, to be verified though.
Hello,
do you know if the free version of Maps there is a limit to calls from a specific website to Google Maps?
Thank you!
Chiara
Hello, I wrote this code but now I want to import the cloud exactly as it appears in Google Map. I saw a similar post here forever, but I can not enter the code correctly, probably because I insert it in the wrong place.
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
google . maps . Map ; import com. google. maps. Map;
google . maps . MapEvent ; import com. google. maps. MapEvent;
google . maps . MapType ; import com. google. maps. mapType;
google . maps . controls . ZoomControl ; import com. google. maps. controls. ZoomControl;
google . maps . controls . PositionControl ; import com. google. maps. controls. PositionControl;
google . maps . controls . MapTypeControl ; import com. google. maps. controls. MapTypeControl;
google . maps . overlays . MarkerOptions ; import com. google. maps. overlays. MarkerOptions;
google . maps . overlays . Marker ; import com. google. maps. overlays. Marker;
google . maps . InfoWindowOptions ; import com. google. maps. InfoWindowOptions;
google . maps . MapMouseEvent ; import com. google. maps. MapMouseEvent;
: Map = new Map ( ) ; var map: Map = new Map ();
key = "ACfg....." ; map. key = "ACfg .....";
setSize ( new Point ( 562 , 458 ) ) ; map. setSize (new Point (562, 458));
x = 350 ; map. x = 350;
y = 150 , 05 ; map. y = 150, 05;
addEventListener ( MapEvent . MAP_READY , onMapReady ) ; map. addEventListener (MapEvent. MAP_READY, onMapReady);
addChild ( map ) ; this. addChild (map);
event : MapEvent ) : void { onMapReady function (event: MapEvent): void {
setCenter ( new LatLng ( 45.97553673095479 , 12.229607105255127 ) , 16 , MapType . NORMAL_MAP_TYPE ) ; map. setCenter (new LatLng (45.97553673095479, 12.229607105255127), 16, mapType. NORMAL_MAP_TYPE);
addControl ( new ZoomControl ( ) ) ; map. AddControl (new ZoomControl ());
addControl ( new PositionControl ( ) ) ; map. AddControl (new PositionControl ());
addControl ( new MapTypeControl ( ) ) ; map. AddControl (new MapTypeControl ());
Marker = new Marker ( new LatLng ( 45.97553673095479 , 12.229607105255127 ) ) ; var marker: Marker = new Marker (new LatLng (45.97553673095479, 12.229607105255127));
addOverlay ( marker ) ; map. addOverlay (marker);
}
I'm going crazy!
@ Vanessa_Megg: line 17:
I see an error ... you used a comma instead of a period ... but I do not know if that's what gives you problems. You have some more information?
@ Giovan Battista Fazioli:
Okay, now the code works. But my question was a 'else: if you could import the cloud of Google Map verbatim, with all directions and, in flash files .. I have seen many who have asked around, but found no solution to the thing ... :/
@ Vanessa_Megg: if by "cloud" you mean the comic, the one with the information about the place indicated, you can not "extrapolate" from the Flash component. What you could do, if I understand your needs, you "read" the information and propose them somewhere else. Also, as you can see from the code above, the contents of the "comic" is generated in HTML:
. Via the method
openInfoWindowHtmlmade available by themarker. What I can not understand is when you say "import the cloud of Google Map verbatim, with all directions and, in flash files .."@ Giovan Battista Fazioli: Hello! Well, I would have the same problem. I created the API key with the address of the site where it will go. If the page I watch local shows me the map (which should not) online instead tells me that the API key is wrong. I continue to repeat the procedure, but Nisba! I am, like, two hours on a google map ... I can no more
@ Igor: the problems encountered with Adobe Flash may be the result of the new policy of Google. For some ', in fact, is no longer necessary to generate a key, the new Google API only work with the import (just works).
@ Dario - you can see an example here: http://www.fight4fun.it/ clicking on the item: MAPS
Hope that help ...