google map custom marker для этого кода

Question

Мы используем следующий код для отображения пользовательской карты google. У нас есть пользовательский маркер, который я могу с радостью сделать тень. Мы должны показать наш CUSTOM маркер на карте, а не комплектного красного маркера от Google

Вот наш код:

<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 на этот вопрос.

Anyhoo смотрел на этот сайт для информации:

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> 

У меня есть маркер и тень сделали, но они не отображаются, пути правильны просто не знает, почему оно не показывает .. У меня склонил его.

Answer 1

[Обновить 2] Похоже, вы не обратили внимание на версию API Карт Google. В обновленном примере вы объединили API V2 и V3. Следующий ответ относится к API V2 - как вы использовали в своем исходном вопросе.

Создайте значок, как описано на связанной странице, в итоге вы получите переменную 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>