3

マーカー付きの Google マップを生成する必要があります。

緯度と経度のコードがあります。

スクリプトはたくさんありますが、持っている緯度と経度のコードを使用して、Web ページにマップを表示する最も簡単な方法は何ですか?

これは現在のコードです: - 地図は表示されていません

 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <html>
    <head>
    <title></title>

    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.js"></script>
    <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?sensor=false"></script>

    <script>
    $(document).ready(function (){
         var myLatlng = new google.maps.LatLng(-25.363882,131.044922);
         var myOptions = {
             zoom: 4,
             center: myLatlng,
             mapTypeId: google.maps.MapTypeId.ROADMAP
             }
          map = new google.maps.Map($('#map'), myOptions);
          var marker = new google.maps.Marker({
              position: myLatlng, 
              map: map,
          title:"Fast marker"
         });
    }) 
    </script>

    </head>
    <body>

    <div id="map"></div>
    </body>
    </html>
4

2 に答える 2

7

マークアップ

<script language=javascript src='http://maps.google.com/maps/api/js?sensor=false'></script>
<div id="map"></div>

Javascript

function initialize(){
     var myLatlng = new google.maps.LatLng(-25.363882,131.044922);
     var myOptions = {
         zoom: 4,
         center: myLatlng,
         mapTypeId: google.maps.MapTypeId.ROADMAP
         }
      map = new google.maps.Map(document.getElementById("map"), myOptions);
      var marker = new google.maps.Marker({
          position: myLatlng, 
          map: map,
      title:"Fast marker"
     });
} 

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

Jクエリ

$(document).ready(function (){
     var myLatlng = new google.maps.LatLng(-25.363882,131.044922);
     var myOptions = {
         zoom: 4,
         center: myLatlng,
         mapTypeId: google.maps.MapTypeId.ROADMAP
         }
      map = new google.maps.Map($('#map'), myOptions);
      var marker = new google.maps.Marker({
          position: myLatlng, 
          map: map,
      title:"Fast marker"
     });
}
于 2012-06-04T18:45:01.123 に答える
1

コードは、マップ div に非表示のコンテンツを追加しています。表示するには、CSS を追加する必要があります。

#map { width: 500px; height: 400px; }
于 2016-02-01T17:55:43.467 に答える