Google Maps in Homepage integrieren

Hallo,

ich versuche eine Reisestrecke aus Google Maps in meine Homepage zu integrieren. Hier ist der Code-Schnipsel:

 

<div style="border-style: ridge; border-width: 5pt; width: 98%; height: 600pt; border-color: #c0c0c0;" id="map"></div>    </p>

<script src="http://maps.google.com/maps?file=api&v=2&key=ABQIAAAA4TXvmVIHfrzZQV4B50E_uRSi0ForHvFuop6pCz8lxj1mikaL_BTfmUd691EZOWeXkuTHgzKxU-O0ug" type="text/javascript"></script>

   <script type="text/javascript">
   //<![CDATA[

   // the map to display
   var map;
   // the directions objects used to retrieve directions
   // each direction object can handle a maximum of 25 stops
   var directions = []

   function addMarker(point, text) {
      marker = new GMarker(point);
      marker.bindInfoWindowHtml(text);
      map.addOverlay(marker);
   }
   
    function onLoad() {
       // Create basic map into div with id "map"
       map = new GMap2(document.getElementById("map"));
       // add zoom buttons
       map.addControl(new GLargeMapControl());
       // add map type switch control
      map.addControl(new GMapTypeControl());
      // add small overview map
      map.addControl(new GOverviewMapControl());
       // initialize map, center at LA at zoom to level 6, you can put appropriate value here!
       // however, the map will be zoomed and centered below, too. This call is to initialize the map.
      map.setCenter(new GLatLng (33.905755787445045, -118.070068359375), 6);
      // set appropriate initial map type, adjust as needed
      map.setMapType(G_MAP_TYPE);
      //map.setMapType(G_HYBRID_TYPE);
      //map.setMapType(G_SATELLITE_TYPE);
      
      // create the necessary direction objects
      tempDir = new GDirections(null, null);
      // add a listener which will add the route polyline as overlay to the map when directions are loaded
      GEvent.addListener(tempDir, "load", function() {
         var pol = this.getPolyline();
         map.addOverlay(pol);
      });
      directions.push(tempDir);
      
      // populate the map with the markers and directions
      initializeData();
   }
   
   function initializeData() {
<!-- Orlando, FL, USA -->
      addMarker(new GLatLng(28.553154, -81.364438), '<a target="_blank" href="http://www.frankgayer.com/reiseberichte/2007-2/tag15.php">Reisebericht 2007</a>
<img src="http://www.frankgayer.com/reiseberichte/2007-2/images/89.jpg" width"350" height="230">>');
<!-- Cocoa Beach, FL, USA -->
      addMarker(new GLatLng(28.332968, -80.610573), '<a target="_blank" href="http://www.frankgayer.com/reiseberichte/2007-2/tag2.php">Reisebericht 2007</a>
<img src="http://www.frankgayer.com/reiseberichte/2007-2/images/9.jpg" width"350" height="230">>');
<!-- Lauderdale-By-the-Sea, FL, USA -->
      addMarker(new GLatLng(26.189851, -80.09666), '<a target="_blank" href="http://www.frankgayer.com/reiseberichte/2007-2/tag15.php">Reisebericht 2007</a>
<img src="http://www.frankgayer.com/reiseberichte/2007-2/images/9.jpg">');
<!-- Miami Beach, FL, USA -->
      addMarker(new GLatLng(25.813099, -80.122986), '<a target="_blank" href="http://www.frankgayer.com/reiseberichte/2007-2/tag3.php">Reisebericht 2007</a>
<img src="http://www.frankgayer.com/reiseberichte/2007-2/images/15.jpg" width"350" height="230">');
<!-- Everglades, FL, USA -->
      addMarker(new GLatLng(25.231031705373177, -80.81954956054688), '<a target="_blank" href="http://www.frankgayer.com/reiseberichte/2007-2/tag4.php">Reisebericht 2007</a>
<img src="http://www.frankgayer.com/reiseberichte/2007-2/images/21.jpg" width"350" height="230">');
<!-- Islamorada, FL, USA -->
      addMarker(new GLatLng(24.975337, -80.553644), '<a target="_blank" href="http://www.frankgayer.com/reiseberichte/2007-2/tag5.php">Reisebericht 2007</a>
<img src="http://www.frankgayer.com/reiseberichte/2007-2/images/27.jpg" width"350" height="230">>');
<!-- Key West, FL, USA -->
      addMarker(new GLatLng(24.561046, -81.77894), '<a target="_blank" href="http://www.frankgayer.com/reiseberichte/2007-2/tag6.php">Reisebericht 2007</a>
<img src="http://www.frankgayer.com/reiseberichte/2007-2/images/33.jpg" width"350" height="230">>');
<!-- Bahia Honda SP FL, USA -->
      addMarker(new GLatLng(24.666986385216273, -81.25625610351562), '<a target="_blank" href="http://www.frankgayer.com/reiseberichte/2007-2/tag6.php">Reisebericht 2007</a>
<img src="http://www.frankgayer.com/reiseberichte/2007-2/images/37.jpg" width"350" height="230">>');

<!-- Cape Canaveral, FL, USA -->
      addMarker(new GLatLng(28.391772, -80.608261), '<a target="_blank" href="http://www.frankgayer.com/reiseberichte/2007-2/tag7.php">Reisebericht 2007</a>
<img src="http://www.frankgayer.com/reiseberichte/2007-2/images/45.jpg" width"230" height="350">');
<!-- Biscayne NP, FL, USA -->
      addMarker(new GLatLng(25.455674943606645, -80.3375244140625), '<a target="_blank" href="http://www.frankgayer.com/reiseberichte/2007-2/tag8.php">Reisebericht 2007</a>
<img src="http://www.frankgayer.com/reiseberichte/2007-2/images/54.jpg" width"350" height="230">');
<!-- Shark Valley, FL, USA -->
      addMarker(new GLatLng(25.75784610230624, -80.71380615234375), '<a target="_blank" href="http://www.frankgayer.com/reiseberichte/2007-2/tag9.php">Reisebericht 2007</a>
<img src="http://www.frankgayer.com/reiseberichte/2007-2/images/59.jpg" width"350" height="230">');
<!-- Naples, FL, USA -->
      addMarker(new GLatLng(26.147369, -81.795483), '<a target="_blank" href="http://www.frankgayer.com/reiseberichte/2007-2/tag10.php">Reisebericht 2007</a>
<img src="http://www.frankgayer.com/reiseberichte/2007-2/images/65.jpg" width"350" height="230">');
<!-- Corkscrew Swamp Sanctuary, FL, USA -->
      addMarker(new GLatLng(26.410013099138993, -81.7547607421875), '<a target="_blank" href="http://www.frankgayer.com/reiseberichte/2007-2/tag10.php">Reisebericht 2007</a>
<img src="http://www.frankgayer.com/reiseberichte/2007-2/images/67.jpg" width"230" height="350">');
<!-- Treasure Island, FL, USA -->
      addMarker(new GLatLng(27.769166, -82.769141), '<a target="_blank" href="http://www.frankgayer.com/reiseberichte/2007-2/tag11.php">Reisebericht 2007</a>
<img src="http://www.frankgayer.com/reiseberichte/2007-2/images/77.jpg" width"350" height="230">');
<!-- Fort De Soto, St Pete Beach, FL, USA -->
      addMarker(new GLatLng(27.61528, -82.73639), '<a target="_blank" href="http://www.frankgayer.com/reiseberichte/2007-2/tag13.php">Reisebericht 2007</a>
<img src="http://www.frankgayer.com/reiseberichte/2007-2/images/84.jpg" width"230" height="350">');
<!-- Walt Disney World, USA -->
      addMarker(new GLatLng(28.374827, -81.559641), '<a target="_blank" href="http://www.frankgayer.com/reiseberichte/2007-2/tag14.php">Reisebericht 2007</a>
<img src="http://www.frankgayer.com/reiseberichte/2007-2/images/91.jpg" width"350" height="230">');
      
      var stops = [];
      stops.push(new GLatLng(28.553154, -81.364438));
      stops.push(new GLatLng(28.332968, -80.610573));
      stops.push(new GLatLng(26.189851, -80.09666));
      stops.push(new GLatLng(25.813099, -80.122986));
      stops.push(new GLatLng(25.231031705373177, -80.81954956054688));
      stops.push(new GLatLng(24.975337, -80.553644));
      stops.push(new GLatLng(24.561046, -81.77894));
      stops.push(new GLatLng(24.666986385216273, -81.25625610351562));
      stops.push(new GLatLng(28.391772, -80.608261));
      stops.push(new GLatLng(25.455674943606645, -80.3375244140625));
      stops.push(new GLatLng(25.75784610230624, -80.71380615234375));
      stops.push(new GLatLng(26.147369, -81.795483));
      stops.push(new GLatLng(26.410013099138993, -81.7547607421875));
      stops.push(new GLatLng(27.769166, -82.769141));
      stops.push(new GLatLng(27.61528, -82.73639));
      stops.push(new GLatLng(28.374827, -81.559641));
      for (j = 0; j < (stops.length / 24); j++) {
         // create temporary stop array and copy at most 25 stops in them
         temp = [];
         for (i = 0; (i < 25) && ((j*24+i) < stops.length); i++) {
            temp.push(stops[j*24 + i]);
         }
         directions[j].loadFromWaypoints(temp, {getPolyline: true});
         // routing will be added to map in an event listener to the load event
         // loading of directions is asynchronous
      }
      
      // slides and scales the map so that all points can be displayed
      var bounds = new GLatLngBounds(stops[0]);
      for (i = 1; i < stops.length; i++) {
         bounds.extend(stops);
      }
      map.setCenter(bounds.getCenter(), map.getBoundsZoomLevel(bounds));
   }
//]]>
</script>
 

  <body onload="onLoad()" onunload="GUnload()">