Das Laden der Polylinie in Google Maps V3 schlägt fehl

Ich benötige Hilfe bei Google Maps Polyline

Ich habe gerade diesen Code heruntergeladen (nur eine einfache Karte) und es funktioniert einwandfrei. Ich habe mich für eine Google-API angemeldet.

<code><!DOCTYPE html>
<html>
  <head>
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
    <style type="text/css">
      html { height: 100% }
      body { height: 100%; margin: 0; padding: 0 }
      #map_canvas { height: 100% }
    </style>

      <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=AIzaSyD4nINMTYXMM9Mkb35C8Jy_mZ--grp9B1Y&sensor=false">
    </script>
    <script type="text/javascript">
      function initialize() {
        var myOptions = {
          center: new google.maps.LatLng(-34.397, 150.644),
          zoom: 8,
          mapTypeId: google.maps.MapTypeId.ROADMAP
        };
        var map = new google.maps.Map(document.getElementById("map_canvas"),
            myOptions);
      }
    </script>
  </head>

  <body onload="initialize()">
    <div id="map_canvas" style="width:100%; height:100%"></div>
  </body>
</html>
</code>

Aber dieser funktioniert nicht von meinem Computer aus?

Jeder Grund warum, bitte helfen

<code><!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<title>Google Maps JavaScript API v3 Example: Polyline Simple</title>
<link href="/maps/documentation/javascript/examples/default.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=AIzaSyD4nINMTYXMM9Mkb35C8Jy_mZ--grp9B1Y&sensor=false"></script>
<script type="text/javascript">

  function initialize() {
    var myLatLng = new google.maps.LatLng(0, -180);
    var myOptions = {
      zoom: 3,
      center: myLatLng,
      mapTypeId: google.maps.MapTypeId.TERRAIN
    };

    var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

    var flightPlanCoordinates = [
        new google.maps.LatLng(37.772323, -122.214897),
        new google.maps.LatLng(21.291982, -157.821856),
        new google.maps.LatLng(-18.142599, 178.431),
        new google.maps.LatLng(-27.46758, 153.027892)
    ];
    var flightPath = new google.maps.Polyline({
      path: flightPlanCoordinates,
      strokeColor: "#FF0000",
      strokeOpacity: 1.0,
      strokeWeight: 2
    });

   flightPath.setMap(map);
  }

</script>
</head>
<body onload="initialize()">
  <div id="map_canvas"></div>
</body>

</html>
</code>

Debuggen (wenn es gut funktioniert):

<code>[12:46:00.874] file:///C:/Users/Haile/Desktop/polyoverflow.html
[12:46:00.974] GET https://maps.googleapis.com/maps/api/js?key=AIzaSyD4nINMTYXMM9Mkb35C8Jy_mZ--grp9B1Y&sensor=false [HTTP/1.1 200 OK 6738ms]
--
[12:46:07.779] GET https://maps.gstatic.com/intl/en_us/mapfiles/api-3/8/11/main.js [HTTP/1.1 304 Not Modified 667ms]
[12:46:08.622] Error in parsing value for 'background'.  Declaration dropped. @ file:///C:/Users/Haile/Desktop/polyoverflow.html
[12:46:08.718] GET https://maps.gstatic.com/mapfiles/openhand_8_8.cur [HTTP/1.1 304 Not Modified 4200ms]
[12:46:08.744] GET https://maps.gstatic.com/mapfiles/transparent.png [HTTP/1.1 304 Not Modified 6536ms]
[12:46:08.776] GET https://maps.gstatic.com/mapfiles/undo_poly.png [HTTP/1.1 304 Not Modified 2389ms]
[12:46:08.792] GET https://mts1.googleapis.com/vt?lyrs=t@128,r@177000000&src=apiv3&hl=en-US&x=7&y=3&z=3&s=&style=api%7Csmartmaps [HTTP/1.1 200 OK 3746ms]
[12:46:08.808] GET https://mts1.googleapis.com/vt?lyrs=t@128,r@177000000&src=apiv3&hl=en-US&x=7&y=4&z=3&s=G&style=api%7Csmartmaps [HTTP/1.1 200 OK 8703ms]
[12:46:08.826] GET https://mts0.googleapis.com/vt?lyrs=t@128,r@177000000&src=apiv3&hl=en-US&x=0&y=3&z=3&s=Gal&style=api%7Csmartmaps [HTTP/1.1 200 OK 7659ms]
[12:46:08.845] GET https://mts0.googleapis.com/vt?lyrs=t@128,r@177000000&src=apiv3&hl=en-US&x=0&y=4&z=3&s=Gali&style=api%7Csmartmaps [HTTP/1.1 200 OK 8420ms]
[12:46:08.863] GET https://mts0.googleapis.com/vt?lyrs=t@128,r@177000000&src=apiv3&hl=en-US&x=6&y=3&z=3&s=Galil&style=api%7Csmartmaps [HTTP/1.1 200 OK 16613ms]
[12:46:08.890] GET https://mts0.googleapis.com/vt?lyrs=t@128,r@177000000&src=apiv3&hl=en-US&x=6&y=4&z=3&s=Galile&style=api%7Csmartmaps [HTTP/1.1 200 OK 12093ms]
[12:46:08.914] GET https://mts1.googleapis.com/vt?lyrs=t@128,r@177000000&src=apiv3&hl=en-US&x=1&y=3&z=3&s=Galile&style=api%7Csmartmaps [HTTP/1.1 200 OK 19585ms]
[12:46:08.939] GET https://mts1.googleapis.com/vt?lyrs=t@128,r@177000000&src=apiv3&hl=en-US&x=1&y=4&z=3&s=Galileo&style=api%7Csmartmaps [HTTP/1.1 200 OK 2753ms]
[12:46:08.963] GET https://mts1.googleapis.com/vt?lyrs=t@128,r@177000000&src=apiv3&hl=en-US&x=5&y=3&z=3&s=Ga&style=api%7Csmartmaps [HTTP/1.1 200 OK 12625ms]
[12:46:08.988] GET https://mts1.googleapis.com/vt?lyrs=t@128,r@177000000&src=apiv3&hl=en-US&x=5&y=4&z=3&s=Gal&style=api%7Csmartmaps [HTTP/1.1 200 OK 9987ms]
[12:46:09.014] GET https://mts0.googleapis.com/vt?lyrs=t@128,r@177000000&src=apiv3&hl=en-US&x=2&y=3&z=3&s=G&style=api%7Csmartmaps [HTTP/1.1 200 OK 8728ms]
[12:46:09.047] GET https://mts0.googleapis.com/vt?lyrs=t@128,r@177000000&src=apiv3&hl=en-US&x=2&y=4&z=3&s=Ga&style=api%7Csmartmaps [HTTP/1.1 200 OK 2984ms]
[12:46:09.078] GET https://maps.googleapis.com/maps/api/js/ViewportInfoService.GetViewportInfo?1m6&1m2&1d-67.60159243714006&2d-180&2m2&1d67.60159243714006&2d180&2u3&4sen-US&5e4&6sr%40177000000&7b0&8e0&9b0&callback=_xdc_._q07umg&token=24170 [HTTP/1.1 200 OK 10083ms]
[12:46:09.294] GET https://maps.gstatic.com/mapfiles/google_white.png [HTTP/1.1 304 Not Modified 2013ms]
[12:46:09.329] GET https://maps.gstatic.com/mapfiles/mv/imgs8.png [HTTP/1.1 304 Not Modified 2413ms]
[12:46:09.367] GET https://maps.gstatic.com/mapfiles/cb/mod_cb_scout/cb_scout_sprite_api_003.png [HTTP/1.1 304 Not Modified 3958ms]
[12:46:09.404] GET https://maps.gstatic.com/mapfiles/rotate2.png [HTTP/1.1 304 Not Modified 2713ms]
[12:46:09.441] GET https://maps.gstatic.com/mapfiles/szc4.png [HTTP/1.1 304 Not Modified 7609ms]
[12:46:10.190] GET https://maps.googleapis.com/maps/gen_204?ev=api_viewport&cad=src:apiv3,ts:1336902369211 [HTTP/1.0 200 Connection established 25338ms]
[12:46:12.591] GET https://maps.googleapis.com/maps/gen_204?ev=api_ads&cad=src:apiv3,ads:0 [HTTP/1.1 204 No Content 2181ms]
[12:46:13.461] GET https://maps.googleapis.com/maps/api/js/AuthenticationService.Authenticate?1sfile%3A%2F%2F%2FC%3A%2FUsers%2FHaile%2FDesktop%2Fpolyoverflow.html&4sAIzaSyD4nINMTYXMM9Mkb35C8Jy_mZ--grp9B1Y&5e1&callback=_xdc_._q8yv43&token=112869 [HTTP/1.0 200 Connection established 12274ms]
--
[12:46:20.489] GET https://maps.googleapis.com/maps/gen_204?ev=api_marker&cad=src:apiv3,m:2,d:0,s:0 [HTTP/1.1 204 No Content 660ms]
--
[12:46:29.340] GET https://csi.gstatic.com/csi?v=2&s=mapsapi3&action=apiboot&rt=jl.737,mc.784,mb.871,vt.20582,prt.20582,plt.20535,mt.20583&size=1366x246&maptype=r [HTTP/1.1 204 No Content 7383ms]
--
[12:46:38.478] GET https://maps.googleapis.com/maps/api/js/QuotaService.RecordEvent?1sfile%3A%2F%2F%2FC%3A%2FUsers%2FHaile%2FDesktop%2Fpolyoverflow.html&3sAIzaSyD4nINMTYXMM9Mkb35C8Jy_mZ--grp9B1Y&4e1&5e0&6u1&7s5x64nd&callback=_xdc_._9r0xgo&token=4472 [HTTP/1.1 200 OK 697ms]
</code>

Antworten auf die Frage(1)

Ihre Antwort auf die Frage