Lilli: Map in Homepage einbinden

Hallo liebes Forum,

ich möchte gerne eine G.map in meine Homepage einbinden und habe auch schon reichlich gegoogled.

Dabei habe ich in Erfahrung gebracht, dass es wohl bislang üblich war, sich zunächst eine Art Schlüssel von Google geben zu lassen, mit dem man dann die Karte initialisieren muss. Neuerdings geht das aber wohl auch OHNE diesen besagten Schlüssel - was mir persönlich natürlich lieber ist.

Ich habe tatsächlich auch eine Map erstellen können inkl. Zentrierung auf einen gewünschten Punkt, doch mein Problem ist jetzt einen Punkt auf dieser Map zu markieren. Also einen "Marker" zu setzen.

Folgend mal meine bisherige Map.
[...
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Eine erste einfache Karte</title>
<style type="text/css">
  #karte { width: 400px; height: 400px;}
</style>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false">
</script>
<script type="text/javascript">
function initialize()
         {
         var latlng = new google.maps.LatLng(52.51864, 13.3760);
         var myOptions = {
                         zoom: 15,
                         center: latlng,
                         mapTypeId: google.maps.MapTypeId.ROADMAP
                         };
         var map = new google.maps.Map(document.getElementById("karte"), myOptions);
         }
</script>
</head>
<body onload="initialize()">
  <div id="karte" ></div>
</body>
</html>
...]

Auf diesem Ausschnitt würde ich jetzt gerne einen Punkt markieren.

Ich habe Beispiele gefunden, in denen ein Marker wie folgt gesetzt wird:
[...
marker = new GMarker(new GLatLng(52.51864, 13.3760));
map.addOverlay(marker);
...]

Egal wo ich dieses Beispiel jetzt in meinem obigen Code einsetze, die Karte wird dann überhaupt nicht mehr dargestellt.

Könnt Ihr mir da vielleicht helfen?

Ich möchte einfach nur im ersten Codeabschnitt einen MArker mit einbauen.

Vielen Dank für Eure Hilfe

Lilli

  1. Dabei habe ich in Erfahrung gebracht, dass es wohl bislang üblich war, sich zunächst eine Art Schlüssel von Google geben zu lassen, mit dem man dann die Karte initialisieren muss. Neuerdings geht das aber wohl auch OHNE diesen besagten Schlüssel - was mir persönlich natürlich lieber ist.

    Version 2 der Maps-API benötigt einen API-Schlüssel, Version 3 nicht mehr.

    Dein erster Ansatz sieht aus wie ein verstümmeltes Minimalbeispiel der Maps API V3

    Die Geschichte mit dem Marker sieht man Version 2 aus - das kann nicht funktionieren.

    Ein klassisches RTFM-Problem - anstatt irgendwo "herumzugooglen" solltest du einfach direkt die Goole-Dokumentation lesen, die ist dermaßen idiotensicher, dass man sogar mit Copy&Paste-Programmierung zum Ziel kommt.

    http://code.google.com/intl/de-AT/apis/maps/documentation/javascript/tutorial.html
    http://code.google.com/intl/de-AT/apis/maps/documentation/javascript/overlays.html#Markers

    1. Hallo Suit,

      dass sieht ja alles sehr vielversprechend aus.
      Genau so eine Seite habe ich gesucht.
      Mein Problem ist dann eher meine gewünschten Seiten zu finden.
      Nur mal lehrhalber für mich, wie hast Du diese Seite gefunden?
      Was hast Du in den Suchoptionen eingegeben?

      Vielen Dank schonmal für diese Heilfreichen Links

      Gruß

      Lilli

      1. Was hast Du in den Suchoptionen eingegeben?

        Google Maps Dokumentation, Google Maps API - viele wegen führen zum Ziel.

        Mir ist schleierhaft, wie man diese Doku nicht finden kann.

        1. Naja, ich habe folgende Stichworte Eingegeben:

          "Google maps Homepage einbinden"

          Woher soll ich denn wissen, dass ich API mit eingeben muss?

          Aber Danke nochmal und Gruß

          Lilli

          1. Hi,

            Woher soll ich denn wissen, dass ich API mit eingeben muss?

            OK, das ist ein Punkt - jetzt weißt du es.

            Aber auch ich verstehe nicht, wie du von dem ersten bisschen GoogleMaps Code den du gefunden hast (weil die Map ohne Marker klappt ja) nicht weitergekommen bist.

            Ich hatte da auch nie Probleme irgendwas zu finden ;)  Du musst wohl ein bisschen googlen üben...

            1. Aber auch ich verstehe nicht, wie du von dem ersten bisschen GoogleMaps Code den du gefunden hast (weil die Map ohne Marker klappt ja) nicht weitergekommen bist.

              Weil der erste Code aus der Maps API Version 3 stammt und der zweite aus der Version 3 - beide Versionen sind nichtmal ansatzweise kompatibel zueinander.

              1. Lieber suit,

                _jetzt_ habe ich Dich _überhaupt_ _erst_ verstanden! ;-P

                Liebe Grüße,

                Felix Riesterer.

                --
                ie:% br:> fl:| va:) ls:[ fo:) rl:| n4:? de:> ss:| ch:? js:) mo:} zu:)
              2. Weil der erste Code aus der Maps API Version 3 stammt und der zweite aus der Version 3 - beide Versionen sind nichtmal ansatzweise kompatibel zueinander.

                Da hast du mich missverstanden: Ich habe gemeint, dass er ja (weil die Map ohne Marker ja geklappt hat) offensichtlich irgendwo online einen GoogleMaps Code gefunden haben muss - er wird ihn ja wohl nicht selbst erfunden haben.

                Und von diesem etwas Code finden dann auf restliche GoogleMaps Hinweise etc. zu kommen halte ich für nicht sonderlich schwer...Deshalb habe ich mich gewundert, wieso er da nicht weitergekommen ist, wo er das Grundlegende doch schon gefunden hat.

    2. Lieber suit,

      Version 2 der Maps-API benötigt einen API-Schlüssel, Version 3 nicht mehr.

      wie? Was? Da gibt es jetzt eine 3er API? Gleich mal anschauen. WOW! Da wird ja das DOM überhaupt nimmer mir so vielen globalen Variablen zugemüllt! Das gefällt mir ja außerordentlich!! <aufschneid>Die haben nicht zufällig meinen Lehrgang zum vernünftigen Schreiben eines JavaScripts gelesen, oder?</aufschneid>

      Dass die 3er API auch noch ohne Schlüssel auskommt, finde ich noch besser. Die werden ja ohnehin ihre Tracking-Spitzel-Stasi-Überwachung eingebaut haben. Mal sehen, wie ich meine bisherige Einbindung auf die 3er umbaue...

      Vielen Dank für diese Hinweise! Da hatte ich wohl etwas verpasst... ;-)

      Liebe Grüße,

      Felix Riesterer.

      --
      ie:% br:> fl:| va:) ls:[ fo:) rl:| n4:? de:> ss:| ch:? js:) mo:} zu:)
      1. Mal sehen, wie ich meine bisherige Einbindung auf die 3er umbaue...

        Schon geschehen. War nicht besonders schwer. Musste nur das einbindende JavaScript etwas anpassen.

        Liebe Grüße,

        Felix Riesterer.

        --
        ie:% br:> fl:| va:) ls:[ fo:) rl:| n4:? de:> ss:| ch:? js:) mo:} zu:)