Google Map API未显示

时间:2014-08-03 20:43:36

标签: google-maps-api-3

我在我的网站中包含了一个Google Map API,其中显示了带有信息弹出窗口的多个标记。我已将所有值输入到我的标记变量中,但地图本身根本没有显示。我已经包含了所有的javascript文件。我似乎无法弄清楚出了什么问题。任何帮助将不胜感激。以下是标记的脚本:

<script type="text/javascript">

  $(function(){

    $('#test1').gmap3({
      map:{
        options:{
          center:[34.8400335,-115.967051],
          zoom: 7
        }
      },
      marker:{
        values:[
          {latLng:[48.8620722, 2.352047],data:"info"},
           {latLng:[34.1301, -117.286],data:"Client: Hi-Grade Materials, Project: San Bernardino Mine, Surveyed for Desert Tortoise Species"},
           {latLng:[34.8958, -117.016],data:"Client: City of Barstow, Project: South Borrow Area, Surveyed for Desert Tortoise and Burrowing Owl"},
           {latLng:[34, -117.3],data:"Client: R.A.M. Architecture, Project: Hesperia Development, Surveyed for Burrowing Owls"},
           {latLng:[33.6778, -117.215],data:"Client: Brookfield Residential, Project: Audie Murphy Ranch, Surveyed for Burrowing Owls"},
           {latLng:[33.5555, -117.203],data:"Client: Pacific Coast Land Consultants, Project: Westpark Promenade, Surveyed for various sensitive species"},
           {latLng:[34.5221, -117.325],data:"Client: Civic Rogers LLC, Project: Civic Rogers Development, Surveyed for Mojave Ground Squirrel, Desert Tortoise and Burrowing Owl"},
           {latLng:[37.5194, -122.039],data:"Client: Bielectric USA, Project: Navajo Solar Development, Surveyed for Mojave Ground Squirrel"},
           {latLng:[34.134, -118.332],data:"Client: Sunlight Partners, Project: Arrache 4006, Surveyed for Desert Tortoise and Burrowing Owls"},
            {latLng:[33.6885, -117.188],data:"Client: Golden Eagle Properties, Project: Villa Siena, Surveyed for various sensitive species"},
             {latLng:[34.1197, -117.536],data:"Client: Winchester Associates, Project: Moreno Development, Surveyed for Burrowing Owl species"},
             {latLng:[38.3991, -122.84],data:"Client: Dyna Solar, Project: MA Solar Site, Surveyed for Burrowing Owls"},
          {address:"10253 6th Avenue, Hesperia, CA", data:"Client: UEG, Mojave Square Project, Surveyed for Burrowing Owl Species"},
          {address:"", data:"", options:{icon: "http://maps.google.com/mapfiles/marker_green.png"}}
        ],
        options:{
          draggable: false 
        },
        events:{
          mouseover: function(marker, event, context){
            var map = $(this).gmap3("get"),
              infowindow = $(this).gmap3({get:{name:"infowindow"}});
            if (infowindow){
              infowindow.open(map, marker);
              infowindow.setContent(context.data);
            } else {
              $(this).gmap3({
                infowindow:{
                  anchor:marker, 
                  options:{content: context.data}
                }
              });
            }
          },
          mouseout: function(){
            var infowindow = $(this).gmap3({get:{name:"infowindow"}});
            if (infowindow){
              infowindow.close();
            }
          }
        }
      }
    });
  });
</script>

2 个答案:

答案 0 :(得分:1)

如果您未手动设置<div>的大小,Google地图将以不会显示的div格式呈现。追捕是一个非常恼人的错误。

尝试设置div的大小:

<div id="yourID" style="width:400px; height:400px;"></div>

并包含脚本设置的任何ID。这可能就是@geocodezip在代码中获得正确结果的原因 - 就像你一样,你只是看不到它。

答案 1 :(得分:0)

gmap3不是google maps api函数,是一个函数或Gmap3'包装'api。请参阅http://gmap3.net/en/以供参考。请确保包含对此api的脚本的引用 对不起,我的英语水平很差。