2011-05-12 63 views
1

我们使用以下代码来显示自定义谷歌地图。 我们有一个自定义标记,我可以愉快地为它制作一个阴影。 我们需要的,而不是从谷歌谷歌地图此代码的自定义标记

这里捆绑的红色标记在地图上显示我们的定制标记,是我们的代码:

<script type="text/javascript"> 

var userLocation = '< ? php echo $address; ? >'; 

if (GBrowserIsCompatible()) { 
    var geocoder = new GClientGeocoder(); 
    geocoder.getLocations(userLocation, function (locations) {   
     if (locations.Placemark) 
     { 
     var north = locations.Placemark[0].ExtendedData.LatLonBox.north; 
     var south = locations.Placemark[0].ExtendedData.LatLonBox.south; 
     var east = locations.Placemark[0].ExtendedData.LatLonBox.east; 
     var west = locations.Placemark[0].ExtendedData.LatLonBox.west; 

     var bounds = new GLatLngBounds(new GLatLng(south, west), 
             new GLatLng(north, east)); 

     var map = new GMap2(document.getElementById("map_canvas")); 

     map.setCenter(bounds.getCenter(), map.getBoundsZoomLevel(bounds)); 
     map.addOverlay(new GMarker(bounds.getCenter())); 
     } 
    }); 
} 
</script> 

我已经改变了PHP的一部分用于这个问题。

安美居看这个网站的信息:

http://econym.org.uk/gmap/custom.htm

只是不知道在哪里以及如何正确地他引用(在上面的链接)的代码添加到我们的代码。 或者如果有更好的方法。

代码我现在是:

<script type="text/javascript"> 

    var userLocation = '< ? php echo $address; ? >'; 

    if (GBrowserIsCompatible()) { 
     var geocoder = new GClientGeocoder(); 
     geocoder.getLocations(userLocation, function (locations) {   
      if (locations.Placemark) 
      { 
      var north = locations.Placemark[0].ExtendedData.LatLonBox.north; 
      var south = locations.Placemark[0].ExtendedData.LatLonBox.south; 
      var east = locations.Placemark[0].ExtendedData.LatLonBox.east; 
      var west = locations.Placemark[0].ExtendedData.LatLonBox.west; 

      var bounds = new GLatLngBounds(new GLatLng(south, west), 
              new GLatLng(north, east)); 

      var map = new GMap2(document.getElementById("map_canvas")); 

      map.setCenter(bounds.getCenter(), map.getBoundsZoomLevel(bounds)); 
      map.addOverlay(new GMarker(bounds.getCenter()), Icon); 

      var image = new google.maps.MarkerImage(
    'images/marker.png', 
    new google.maps.Size(33,50), 
    new google.maps.Point(0,0), 
    new google.maps.Point(17,50) 
); 

var shadow = new google.maps.MarkerImage(
    'images/shadow.png', 
    new google.maps.Size(61,50), 
    new google.maps.Point(0,0), 
    new google.maps.Point(17,50) 
); 

var shape = { 
    coord: [21,1,21,2,23,3,25,4,26,5,27,6,28,7,29,8,31,9,31,10,31,11,32,12,32,13,32,14,32,15,32,16,32,17,32,18,32,19,32,20,32,21,32,22,32,23,32,24,32,25,32,26,31,27,31,28,31,29,30,30,29,31,29,32,29,33,28,34,28,35,27,36,27,37,26,38,26,39,25,40,25,41,24,42,24,43,23,44,23,45,22,46,21,47,21,48,20,49,12,49,11,48,11,47,10,46,10,45,9,44,8,43,8,42,7,41,7,40,6,39,6,38,5,37,5,36,4,35,4,34,3,33,3,32,3,31,2,30,2,29,1,28,1,27,1,26,0,25,0,24,0,23,0,22,0,21,0,20,0,19,0,18,0,17,0,16,0,15,0,14,0,13,0,12,1,11,1,10,1,9,4,8,4,7,5,6,6,5,7,4,9,3,11,2,11,1,21,1], 
    type: 'poly' 
}; 

var marker = new google.maps.Marker({ 
    draggable: true, 
    raiseOnDrag: false, 
    icon: image, 
    shadow: shadow, 
    shape: shape, 
    map: map, 
    position: point 
}); 
      } 
     }); 
    } 
</script> 

我有标记,并取得了阴影,但他们没有显示,路径是正确的只是不知道为什么它不是显示..我有没有翘起起来。

回答

1

[Update 2]看起来你并没有关注Google Maps API的版本。在更新的示例中,您已经将V2和V3 API混合在一起。以下答案与V2 API相关 - 就像您在原始问题中使用的那样。

按照链接页面中所述构建图标,您将以表示Icon对象的Icon变量结束。然后,它作为第二个参数添加到您的new GMarker功能:

map.addOverlay(new GMarker(bounds.getCenter()), Icon); 

更新 - 添加例如:

<script type="text/javascript"> 

var userLocation = '< ? php echo $address; ? >'; 

if (GBrowserIsCompatible()) { 
    var geocoder = new GClientGeocoder(); 
    geocoder.getLocations(userLocation, function (locations) {   
     if (locations.Placemark) 
     { 
     var north = locations.Placemark[0].ExtendedData.LatLonBox.north; 
     var south = locations.Placemark[0].ExtendedData.LatLonBox.south; 
     var east = locations.Placemark[0].ExtendedData.LatLonBox.east; 
     var west = locations.Placemark[0].ExtendedData.LatLonBox.west; 

     var bounds = new GLatLngBounds(new GLatLng(south, west), 
             new GLatLng(north, east)); 

     var map = new GMap2(document.getElementById("map_canvas")); 

      var Icon = new GIcon(); 
      Icon.image = "mymarker.png"; 
      Icon.iconSize = new GSize(20, 34); 

     map.setCenter(bounds.getCenter(), map.getBoundsZoomLevel(bounds)); 
     map.addOverlay(new GMarker(bounds.getCenter()), Icon); 
     } 
    }); 
} 
</script> 
+0

我得到的,我只是不明白我怎么添加的JavaScript的剩余部分,正确。你能否提供一个简单的例子? – 422 2011-05-12 01:47:32

+0

向原始问题 – 422 2011-05-12 02:07:29

+0

添加了上述示例,试图证明它不起作用。 – 422 2011-05-12 02:17:39