在谷歌地图上放一张图片

Put an image on Google map

本文关键字：一张 谷歌地图      更新时间：2023-09-26

我正在创建一个使用JavaScript显示谷歌地图的网页。我怎么能把一张图片作为图标放在地图上呢。这是我所拥有的：

<script language="javascript">
    var lat=1067;
    var lon=-110;
    function load() {
      if (GBrowserIsCompatible()) {
        var map = new GMap2(document.getElementById("map"));
        map.setCenter(new GLatLng(lat, lon), 13);
      }
    }
    function map(position) {
        lat = position.coords.latitude;
        lon = position.coords.longitude;
        load();
    }
    function get_location() {
        navigator.geolocation.getCurrentPosition(map);
    }
    </script>
</head>
<body onload="load()" onunload="GUnload()">
<input type ="Button" size = "50" onclick = "get_location();">Search</input>
<div id="map" style="width: 1200px; height: 600px"></div>

谷歌地图中的图标是文档中"覆盖"部分的一部分。这是文件相关部分的链接。

简而言之：

  var image = 'beachflag.png';
  var myLatLng = new google.maps.LatLng(-33.890542, 151.274856); //or wherever you want the marker placed
  var beachMarker = new google.maps.Marker({
      position: myLatLng,
      map: map,
      icon: image
  });

我使用Google Maps API（v3）中的setIcon函数，如：

//这是我们的标记图像，设置大小和位置（从地图中心开始）this.image=新的google.maps.MarkerImage（"/gfx/map/icon_hotel.png"，//此标记宽22像素，高28像素。新google.maps.Size（22，28），//此图像的原点为0,0。新google.maps.Point（0,0），//此图像的锚点是位于0,28处的旗杆底部新google.maps.Point（11，28）)；//这是我们的标记阴影。与标记位置相同，但尺寸不同this.shadow=新的google.maps.MarkerImage（"/gfx/map/icon_hotel_shadow.png"，//阴影图像在水平维度上较大//而位置和偏移与主图像相同。新google.maps.Size（33，28），新google.maps.Point（0,0），新google.maps.Point（11，28）)；

以下是谷歌的一个例子：http://code.google.com/apis/maps/documentation/javascript/examples/icon-complex.html

相关文章：