2011-01-27 46 views
27

在谷歌地圖中使用DirectionsRender時,我正在更改標記圖標。我從here算出瞭如何將兩個標記更改爲相同的圖標,但我正在尋找開始和結束點上的自定義圖標。有任何想法嗎?更改谷歌地圖方向api V3中的單個標記V3

編輯:我正在尋找如何將單獨的圖標分配到開始和結束標記。我知道如何改變它們,但有不同的標記圖標證明是困難的。

回答

61

對於那些噸需要一個例子,像我一樣,這裏有一個基本的一個:

// Map and directions objects 
var map = new google.maps.Map(element, options); 
var service = new google.maps.DirectionsService(); 
var directions = new google.maps.DirectionsRenderer({suppressMarkers: true}); 

// Start/Finish icons 
var icons = { 
    start: new google.maps.MarkerImage(
    // URL 
    'start.png', 
    // (width,height) 
    new google.maps.Size(44, 32), 
    // The origin point (x,y) 
    new google.maps.Point(0, 0), 
    // The anchor point (x,y) 
    new google.maps.Point(22, 32) 
), 
    end: new google.maps.MarkerImage(
    // URL 
    'end.png', 
    // (width,height) 
    new google.maps.Size(44, 32), 
    // The origin point (x,y) 
    new google.maps.Point(0, 0), 
    // The anchor point (x,y) 
    new google.maps.Point(22, 32) 
) 
}; 

service.route({ origin: origin, destination: destination }, function(response, status) { 
if (status == google.maps.DirectionsStatus.OK) { 
    display.setDirections(response); 
    var leg = response.routes[ 0 ].legs[ 0 ]; 
    makeMarker(leg.start_location, icons.start, "title"); 
    makeMarker(leg.end_location, icons.end, 'title'); 
} 
}); 
function makeMarker(position, icon, title) { 
new google.maps.Marker({ 
    position: position, 
    map: map, 
    icon: icon, 
    title: title 
}); 
} 

從路由請求響應返回根據您的路線上的停靠次數腿(S)。我只是做一個A到B的路線,所以只需要第一回合,並獲得標記需要去的位置,併爲這些點創建標記。

10

不要因爲他們在該網頁上說,你鏈接到:

  • suppressMarkers選項設置爲true,以防止默認的開始和結束標記從顯示
  • 創建images兩個新的標誌物
  • 創建markers,並將位置設置爲開始位置和結束位置,並將圖標設置爲您創建的位置
+0

但是,您如何將它們分配給Renderer對象?它只需要一個MarkerOptions對象,而不是兩個。 – 2011-01-27 17:25:02

+3

你不分配它們。只需獲取它們的座標並創建兩個新的標記。 – aniri 2011-01-28 09:20:55