SEO-Software von Suchmaschinenoptimierung.de

Google Maps generator auf eigener homepage

(hier klicken, um zum Original Thread zu gelangen)
craiten
moin @ all,

ich möchte gerne einen google maps generator wie so einen auf meiner homepage erstellen, gibt es dafür vorgefertigte packete oder muss man sich das zusammenschnipseln?
habe schon bei google geschaut, aber viel geholfen aht mir das leideer nicht... für mich sind die anleitungen dort sehr konfus.

mfg
craiten
derletztekick
Hallo,

die API von Goolge-Maps beschreibt wohl so ziemlich alle Feature, die es selbst besitzt.

Gruss
Micha
craiten
ja, ich kenne die fitures, aber die google siete hilft mir, wie schon beshreiben, nicht gerade weiter Augenzwinkern
gibts vielleicht webseiten die sich damit beschäftigen? ich hbae von denen leider keine gefunden beim googeln.
brainnrg
Ich habe gerade geschäftlich mit der Google Maps API zu tun.
Diese kann alles was man möchte, egal ob statische oder dynamische Maps.

Es gibt nichts besseres das auch gratis ist (ich bezweifle sogar das es was besseres gegen bezahlung geben würde)!

Achtung wenn du aber damit Geld verdienen willst musst du das bei google melden und dann kostets was.

Es gibt 100er Codeschnippsel die dir diverse Funktionen der API beschreiben. (Auch in deutsch, googlen hilft)

MFG
craiten
joa ich weiß schon, dass das ne coole sache ist Augenzwinkern aber ich finde eben keine script dafür im i-net.
nur diese seiten (siehe oben den link) bzw. seiten, wo man irgendwie tausende von funktionen für google maps findet, aber nichts, was einer eingabemaske ähnelt.
kennst du da gute seiten, am besten mit direktem link zu den codes?
brainnrg
Sowas wirst du leider glaube ich auch nicht finden den ein Script für Google Maps ist immer nach genau den Wünschen des jeweiligen Betreibers angepasst.

Google Maps API ist an sich "einfach" aufgebaut. Man muss sich hald mal ein paar Tage damit auseinandersetzen. Ich hab Anfangs auch erst verstehen müssen wie es funktioniert und was für was gut ist.

Das Script das du haben möchtest ist an sich sehr simpel und benötigt keine tiefes Wissen der API.

Wie gesagt lernen und mal nach Google Maps Tutorials googlen.

MFG Brain
craiten
also ich habe nun was nütlziches gefunden, was mit php gemacht wird.
sehr gut soweit, es wird der ort angezeigt, DOCH leider hat die map nun keinen punkt, wo eben die adresse ist.
kann mir da vielleicht weiterhelfen?

Hier die Onlineansicht

php:
1:
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:
32:
33:
34:
35:
36:
37:
38:
39:
40:
41:
42:
43:
44:
45:
46:
47:
48:
49:
50:
51:
52:
53:
54:
55:
56:
57:
58:
59:
60:
61:
62:
63:
64:
65:
66:
67:
68:
69:
70:
71:
72:
73:
74:
75:
76:
77:
78:
79:
80:
81:
82:
83:
84:
85:
86:
87:
88:
89:
90:
91:
92:
93:
94:
95:
96:
97:
98:
99:
100:
101:
102:
103:
104:
105:
106:
107:
108:
109:
110:
 



<?

function google_daten($bez$adresse$masse$sonstiges) 
{  
  global $key;  global $b;  global $h;  global $zoom;  global $bezeichnung;  global $eigenschaften;  global $position;  global $land;  global $stadt;  global $strasse;  global $plz;
  $key "ABQIAAAA-ZhVntxzdb5a9EP25HnstxQWNRAg1OtXp4XpE2hBtfYIX70OXhTNyEsmrONDQy0JGrEHMtbk4g1k7w";
  $bezeichnung $bez;
  $adresse rawurlencode($adresse);
  $masse explode(", "$masse);  $b $masse[0];  $h $masse[1];  $zoom $masse[2];
  $eigenschaften explode(", "$sonstiges);
  
    $geo implode(file("http://maps.google.com/maps/geo?q=".$adresse."&output=xml&hl=de&key=".$key));  
    $geo utf8_encode($geo);

  $xml xml_parser_create();  xml_parse_into_struct($xml$geo$ausgabe);  xml_parser_free($xml);

  foreach($ausgabe as $a) 
  {    
   if($a["tag"] == "COORDINATES"$position $a["value"];    
   if($a["tag"] == "ADMINISTRATIVEAREANAME"$land $a["value"];    
   if($a["tag"] == "LOCALITYNAME"$stadt $a["value"];    
   if($a["tag"] == "POSTALCODENUMBER"$plz $a["value"];    
   if($a["tag"] == "ADDRESSLINE"$strasse $a["value"];   
   
  }
  if($strasse == "" && $a["tag"] == "THOROUGHFARENAME"$strasse $a["value"]; 
  $position explode(","$position);  $position $position[1].",".$position[0];

}
  
  
function google_maps($wert) 
{

  global $key;  global $b;  global $h;  global $zoom;  global $bezeichnung;  global $eigenschaften;  global $position;  global $land;  global $stadt;  global $strasse;  global $plz;

  $script "<script src='http://maps.google.com/maps?file=api&v=2.x&hl=de&key=".$key."' type='text/javascript'></script>";  
  $script .= "<script type='text/javascript'>rnrn";  
  $script .= "function zeigekarte(bezeichnung, strasse, plz, ort, land) {";  
  $script .= "tif(GBrowserIsCompatible()) {rn";  
  $script .= "ttvar karte = new GMap2(document.getElementById('karte'));";  
  $script .= "ttvar point = new GLatLng('.$position.');";  
  $script .= "karte.enableScrollWheelZoom();";
  $script .= "ttkarte.setCenter(point, '.$zoom.');";  
  $script .= "ttvar marker = new GMarker(point);";  
  $script .= "ttkarte.addOverlay(marker);";

  if(in_array("fenster"$eigenschaften)) {    
  $script .= "ttif(bezeichnung != '') bezeichnung = '<strong>'.$bezeichnung.'</strong><br />'";   
  $script .= "ttmarker.openInfoWindowHtml('<p>'.$bezeichnung.$strasse.'<br />'.$plz.' '.$ort.'<br />'.$land'</p>');";

  }

    if(in_array("steuerung"$eigenschaften)) $script .= "ttkarte.addControl(new GLargeMapControl());";  
     if(in_array("kartentyp"$eigenschaften)) 
      $script .= "ttkarte.addControl(new GMapTypeControl());";  
      $script .= "ttkarte.addControl(new GLargeMapControl());";
      $script .= "ttkarte.addControl(new GScaleControl());";
      $script .= "ttkarte.addControl(new GMapTypeControl());";
      $script .= "ttkarte.addControl(new GOverviewMapControl());";
      
    if(in_array("uebersicht"$eigenschaften)) 
    
    $positionen explode(" "$position);
    $land ereg_replace(" ","+",$land);
    $stadt ereg_replace(" ","+",$stadt);
    $strasse1 ereg_replace(" ","+",$strasse);

    $script .= "ttkarte.addControl(new GOverviewMapControl());";
    $script .= "t}rn";  $script .= "}rnrn";  $script .= "</script>";
    $karte "<div id='karte' style='width:".$b."px; height:".$h."px'>"; 
    $karte .= '<iframe width="'.$b.'" height="'.$h.'" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" 
    src="http://maps.google.com/maps?f=q&amp;source=s_q&amp;hl=de&amp;geocode=&amp;q='.$land.'+'.$stadt.'+'.$strasse.'+'.$plz.'&amp;sll='.$positionen[0].'&amp;sspn='.$positionen[1].'&amp;ie=UTF8&amp;ll='.$positionen[0].'&amp;spn='.$positionen[1].'&amp;z='.$zoom.'&amp;iwloc=A&amp;output=embed&key='.$key.'"></iframe>';
    $karte .= "</div>";  
    $karte .= '<script type="text/javascript">';  
    $karte .= "zeigekarte('".$bezeichnung."', '".$strasse."', '".$plz."','".$stadt."', '".$land."');";  
    $karte .= "</script>";
    
  return $$wert;

}
  
  google_daten("Landtag Nordrhein-Westfalen""Platz des Landtags 1, Düsseldorf""500, 600, 15""fenster, steuerung, kartentyp, uebersicht");

  ?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>GeoFinder - Google Maps JavaScript API Example</title>

<head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>Google Maps</title>

<? echo google_maps("script"); ?>

</head>

<body>

<? echo google_maps("karte"); ?>

</body>
</html>

brainnrg
Das Script ist eine Vergewaltigung der Google API. Die eigentliche Funktion, das dynamische, wird dadurch total ausgehebelt.

Ich würde das sofort verstecken :-)

Wenn ich heute eventuell kurz Zeit habe kriegst n kleines Script das das was du willst macht.

MFG
craiten
ja, ich weiß das es nicht oprimal ist, aber ich blicke dort besser durch als bei den anderen ^^

ja hey, das wäre echt klasse von dir smile
brainnrg
Hier schnell hingeschmiert. Bitte nicht auf aussehen achten.
Funktionalität sollte gegeben sein. Mit 2 Zeilen PHP Code.

Hier die Daten

HTML Datei
code:
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>
<title>Google Maps Test</title>
<script type="text/javascript" src="http://maps.google.com/maps?file=api&amp;v=2&amp;sensor=true&amp;key=ABQIAAAA_nHjA67smTKX2xCaa91XqxTGv8pFig_qdcIeIanIjQzecSm0lRQLVG5Mnn0o1gkYtOz5YM7j8q0I6A"></script>
<script type="text/javascript" src="maps.js"></script>
</head>
<body>
<input type="text" id="adress" value="ort"/><br/>
<textarea id="info" rows="5" cols="40">Beschreibung</textarea><br/><br/>
<span id="url"></span><br/><br/>
<input type="button" onclick="search_adress()" value="Punkt laden"/>
<br/><br/>
<div id="googleMaps" style="height:500px; width:500px;"></div>
</body>
</html>


maps.js
code:
1:
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:
32:
33:
34:
35:
36:
37:
38:
39:
40:
41:
42:
43:
44:
45:
var map;
function initialize() {
if (GBrowserIsCompatible()) {
		map = new GMap2(document.getElementById("googleMaps"));
		map.setCenter(new GLatLng(0, 0), 1);
		var mapControl = new GMapTypeControl();
		map.addControl(mapControl);
		map.addControl(new GLargeMapControl());
		urlRequest();
	}
}

/*Adressuche*/
function search_adress(){
	map.closeInfoWindow();
	geocoder = new GClientGeocoder();
	geocoder.getLocations( document.getElementById('adress').value.toString(), addToMap);
	function addToMap(response){
		place = response.Placemark[0];
		point = new GLatLng(place.Point.coordinates[1],place.Point.coordinates[0]);
		map.setCenter(point, 12);
		addPoint(place.Point.coordinates[0],place.Point.coordinates[1]);
	}
}

/*Punkt hinzufügen*/
function addPoint(lat,lon,id){
	var point1 = new GPoint(lat, lon);
	var marker = new GMarker(point1);
	map.openInfoWindowHtml(new GLatLng(lon, lat),'<div class="mapsInfo">'+document.getElementById('info').value+'</div>');
	map.addOverlay(marker);
	var spl = location.href.split("/");
	document.getElementById('url').innerHTML = 'DirektLink: '+spl[spl.length-1].split("?")[0]+"?"+encodeURIComponent(document.getElementById('adress').value.toString())+"&"+encodeURIComponent(document.getElementById('info').value.toString());
}

/*URL Request*/
function urlRequest(){
	var string = location.href.split('?')[1];
	var infos = string.split("&");
	document.getElementById('adress').value = decodeURIComponent(infos[0]);
	document.getElementById('info').value = decodeURIComponent(infos[1]);
	search_adress();
}

onload = function(){initialize();}


loadMapsGeo.php
php:
1:
2:
3:
4:
<?php
$str file_get_contents("http://maps.google.com/maps/geo?".$_SERVER['QUERY_STRING']);
echo ($str)?"var jsonObj = $str;":"";
?>


Hoffe du kannst damit was anfangen.

MFG
craiten
hey cool danke, genau sowa brauchte ich smile
eine kleine sache aber nur noch:
kann mir jemand ne möglichkeit vorschlagen, wie ich anstatt dass ich etwas in die textboxen eingeben muss, die daten einfach aus der datenbank lesen kann?

ersetze ich dann einfach dieses
php:
1:
<?php document.getElementById('adress').value ?>


durch dieses

php:
1:
<? echo $adresse?>


?

wäre das so möglich, abgesehn davon, dass ich dann dafür ne php brauche?
brainnrg
Das ist grundlegendes Wissen und das solltest du mit ein wenig probieren und testen selbst herausfinden.

Ich helfe gerne aber die komplette Arbeit übernehme ich nicht.

MFG Brain
craiten
hab ich auch nicht erwartet, wollte ja nur wissen, ob das so im ansatz funktionieren könnte. Augenzwinkern

habe das mal ausprobiert:
(leider ohne erfolg)

php:
1:
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:
32:
33:
34:
35:
36:
37:
38:
39:
40:
41:
42:
43:
44:
45:
46:
47:
48:
49:
50:
51:
52:
53:
54:
55:
56:
57:
58:
59:
60:
61:
62:
63:
64:
65:
66:
67:
68:
69:
70:
71:
72:
73:
74:
75:
76:
77:
78:
79:
80:
81:
82:
83:
84:
 

<?
//hier geändert
$s "bielefeld";
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>
<title>Google Maps Test</title>
<script type="text/javascript" src="http://maps.google.com/maps?file=api&amp;v=2&amp;sensor=true&amp;key=ABQIAAAA-ZhVntxzdb5a9EP25HnstxQWNRAg1OtXp4XpE2hBtfYIX70OXhTNyEsmrONDQy0JGrEHMtbk4g1k7w"></script>
<script type="text/javascript">
 
//hier geändert
var adress = "<?php echo $s?>";
var map;
function initialize() {
if (GBrowserIsCompatible()) {
        map = new GMap2(document.getElementById("googleMaps"));
        map.setCenter(new GLatLng(0, 0), 1);
        var mapControl = new GMapTypeControl();
        map.addControl(mapControl);
        map.addControl(new GLargeMapControl());
        map.addControl(new GOverviewMapControl());  
        _mPreferMetric = true;  
        map.addControl(new GScaleControl());  
        urlRequest();
    }
}

/*Adressuche*/
function search_adress(){
    map.closeInfoWindow();
    geocoder = new GClientGeocoder();

       //hier geändert
    geocoder.getLocations(adress , addToMap);
    function addToMap(response){
        place = response.Placemark[0];
        point = new GLatLng(place.Point.coordinates[1],place.Point.coordinates[0]);
        map.setCenter(point, 12);
        addPoint(place.Point.coordinates[0],place.Point.coordinates[1]);
    }
}

/*Punkt hinzufügen*/
function addPoint(lat,lon,id){
    var point1 = new GPoint(lat, lon);
    var marker = new GMarker(point1);
    map.openInfoWindowHtml(new GLatLng(lon, lat),'<div class="mapsInfo">'+document.getElementById('info').value+'</div>');
    map.addOverlay(marker);
    var spl = location.href.split("/");
    document.getElementById('url').innerHTML = 'DirektLink: '+spl[spl.length-1].split("?")[0]+"?"+encodeURIComponent(adress)+"&"+encodeURIComponent(document.getElementById('info').value.toString());
}

/*URL Request*/
function urlRequest(){
    var string = location.href.split('?')[1];
    var infos = string.split("&");
    document.getElementById('adress').value = decodeURIComponent(infos[0]);
    document.getElementById('info').value = decodeURIComponent(infos[1]);
    search_adress();
}

onload = function(){
initialize(); 
//hier geändert
search_adress();
}

</script>
</head>
<body>
Ort: <input type="text" id="adress"/><br/>
Beschreibung: <textarea id="info" rows="5" cols="40"></textarea><br/><br/>
<span id="url"></span><br/><br/>
<input type="button" value="Punkt laden"/>
<br/><br/>
<div id="googleMaps" style="height:500px; width:500px;"></div>

</body>
</html>
 


hat jhemand ne idee was ich falsch mache?
eigentlich müsste das doch gehen...
brainnrg
Wenn du meine HTML Datei öffnest steht ja sicher was im ersten Textfeld drin "ort"!
Wieso läßt du dort nicht gleich direkt die Adresse ausgeben?

Zeile 10 meiner HTML Datei
<input type="text" id="adress" value="ort"/><br/>
wird zu
<input type="text" id="adress" value="<?=$s?>"/><br/>
craiten
weil ich die map gerne aus datenbankdaten generiert haben möchte.
und ich eben zusätzlich kein textfeld bei der darstellung haben möchte.
das mit dem textfeld war zur eingabe der daten und dem test, das es klappt, jetzt soll aber eben die map aus den db-daten erstlelt werden smile
brainnrg
Wenn du es auf die schnelle machen willst dann mach statt
Ort: <input type="text" id="adress"/><br/>
Beschreibung: <textarea id="info" rows="5" cols="40"></textarea><br/><br/>

das
<input type="hidden" id="adress" value="<?=$adress?>"/>
<input type="hidden" id="info" value="<?=$info?>"/>


Ansonsten wäre für deine Aufgabenstellung ein anderes Konzept von nöten das ich aber nicht mehr erläutere.

MFG
craiten
joa danke, sollte funktionieren, aber das onload event funktioniert nicht.
kann mir da jemand noch nen tipp geben?
wenn ich es mit onclick versuche und dann den button drücje gehts, aber sonst auch nicht.
brainnrg
Onload Event - Was meinst du genau? Meinst du das eigentlich "onload" wenn die komplette Seite geladen ist (<body onload="">) oder von Google Maps.
Google Maps habe ich diese 2 Listener und funzen prima

code:
1:
2:
3:
4:
5:
GEvent.addListener(map, "load", function() {			
});

GEvent.addListener(map, "moveend", function() {		
});


PS: Damit du selbst ordentlich debuggen kannst nutze Firefox + Firebug. Der zeigt meistens ziemlich genau woran der Fehler liegt.

Sodale letzter Tipp von mir.

MFG
craiten
sowohl als ob.
ich habe beides ausprobiert... einmal onload bei dem body und einmal onload bei der map.

und was machen die funktionen?
sind die für das laden der funktionen?
habe sie eingebaut, habe aber keinen unterschied bemerkt.
craiten
kann mir niemand dabei helfen?
bei mir geht schließlich nur das onload nicht, was ic haber nicht verstehe unglücklich
die map wird einfach nicht automatisch geladen
(hier klicken, um zum Original Thread zu gelangen)



Tipp: Ranking-Konzept.de - Das SEO-Forum (Forum rund um die Suchmaschinenoptimierung) der artaxo AG.
Das große Versicherungs ABC von Versicherung.de - mit allen Aspekten der Computerversicherungen!
Fan-Foren.de, die große Community mit Musikforum ist ab sofort online.