Google Map js eine Karte in China zeigt nicht die tatsächliche Lage

Question

Grundsätzlich bin ich nur versucht, meine Web-Seite google map einrichten, um einen Ort zu zeigen, dass ich die Koordinaten bekommen haben, aber es zeigt einen Standort in China auf meiner Webseite, egal welche Koordinaten ich versuche, es ist immer der gleiche Ort.

if($('#map-canvas').length != 0){ 
 
\t \t var map; 
 
\t \t function initialize() { 
 
\t \t \t var mapOptions = { 
 
\t \t \t \t zoom: 16, 
 
\t \t \t \t scrollwheel: false, 
 
\t \t \t \t center: new google.maps.LatLng(25.932884, 83.569633), 
 
\t \t \t \t styles: [ 
 
\t \t \t \t \t \t \t {"stylers": [{ hue: "#000000" }, 
 
\t \t \t \t \t \t \t { saturation: -100 }, 
 
\t \t \t \t \t \t \t { lightness: -5 }]}, 
 
    \t \t \t \t \t { 
 
\t \t \t \t \t  "featureType": "road", 
 
\t \t \t \t \t  "elementType": "labels", 
 
\t \t \t \t \t  "stylers": [{"visibility": "off"}] 
 
\t \t \t \t \t  }, 
 
\t \t \t \t \t  { 
 
\t \t \t \t \t  "featureType": "road", 
 
\t \t \t \t \t  "elementType": "geometry", 
 
\t \t \t \t \t  "stylers": [{"lightness": 100}, 
 
\t \t \t \t \t    {"visibility": "simplified"}] 
 
\t \t \t \t \t  } 
 
\t \t \t \t ] 
 
\t \t \t }; 
 
\t \t \t map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions); 
 
\t \t \t var image = 'include/images/map-marker.png'; 
 
\t \t \t var myLatLng = new google.maps.LatLng(39.091617, -77.204273); 
 
\t \t \t var beachMarker = new google.maps.Marker({ 
 
\t \t \t \t position: myLatLng, 
 
\t \t \t \t map: map, 
 
\t \t \t \t icon: image 
 
\t \t \t }); 
 
\t \t } 
 

 
\t \t google.maps.event.addDomListener(window, 'load', initialize); 
 
\t }

.map-container{height:400px; position:relative; margin:0; padding:0; } 
 
#map-canvas{height:100%;}

<script src="https://maps.googleapis.com/maps/api/js"></script> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="map-container"> 
 
    \t <div id="map-canvas"></div> 
 
    </div>

ich es erwartet Sie diese Koordinaten zeigen: http://delcontedesigns.com/yaeger/contact

: 39,0916165, -77,2064619

Stattdessen habe ich eine Karte von China sehen, können beispielsweise hier zu sehen Irgendwelche Vorschläge oder Hilfe würden geschätzt. Ich habe schon Karten gemacht, bin aber nie auf dieses Problem gestoßen.

Answer 1

Ihr Code wird Zentrieren der Karte bei center: new google.maps.LatLng(25.932884, 83.569633). Ändern Sie das in center: new google.maps.LatLng(39.0916165, -77.2064619) oder rufen Sie map.setCenter(myLatLng); (sobald Sie das definiert haben).

Code-Schnipsel:

if ($('#map-canvas').length != 0) { 
 
    var map; 
 

 
    function initialize() { 
 
    var mapOptions = { 
 
     zoom: 16, 
 
     scrollwheel: false, 
 
     center: new google.maps.LatLng(25.932884, 83.569633), 
 
     styles: [{ 
 
      "stylers": [{ 
 
       hue: "#000000" 
 
      }, 
 
      { 
 
       saturation: -100 
 
      }, 
 
      { 
 
       lightness: -5 
 
      } 
 
      ] 
 
     }, 
 
     { 
 
      "featureType": "road", 
 
      "elementType": "labels", 
 
      "stylers": [{ 
 
      "visibility": "off" 
 
      }] 
 
     }, 
 
     { 
 
      "featureType": "road", 
 
      "elementType": "geometry", 
 
      "stylers": [{ 
 
       "lightness": 100 
 
      }, 
 
      { 
 
       "visibility": "simplified" 
 
      } 
 
      ] 
 
     } 
 
     ] 
 
    }; 
 
    map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions); 
 
    var image = 'include/images/map-marker.png'; 
 
    var myLatLng = new google.maps.LatLng(39.091617, -77.204273); 
 
    var beachMarker = new google.maps.Marker({ 
 
     position: myLatLng, 
 
     map: map, 
 
     // icon: image 
 
    }); 
 
    map.setCenter(myLatLng); 
 
    } 
 

 
    google.maps.event.addDomListener(window, 'load', initialize); 
 
}

.map-container { 
 
    height: 400px; 
 
    position: relative; 
 
    margin: 0; 
 
    padding: 0; 
 
} 
 

 
#map-canvas { 
 
    height: 100%; 
 
}

<script src="https://maps.googleapis.com/maps/api/js"></script> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="map-container"> 
 
    <div id="map-canvas"></div> 
 
</div>

Answer 2

Wahrscheinlich, weil Sie Ihre Karte auf den falschen Koordinaten sind Zentrierung. Versuchen Sie Folgendes statt:

center: new google.maps.LatLng(39.0916165, -77.2064619) 

DEMO