使用纬度和经度代码脚本生成谷歌地图

时间:2012-06-04 18:38:15

标签: javascript jquery google-maps

我需要使用标记生成谷歌地图。

我有纬度和经度代码。

周围有很多脚本,但是使用我拥有的纬度和经度代码在网页上显示地图的最快方法是什么?

这是当前代码: - 没有显示地图

 <!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>

2 个答案:

答案 0 :(得分: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);

<强> Jquery的

$(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"
     });
} 

答案 1 :(得分:1)

代码正在向地图div添加一些不可见的内容。要查看它,我们需要添加CSS:

#map { width: 500px; height: 400px; }