在最基本的情況下,圖標(biāo)可以簡(jiǎn)單地表示一個(gè)要代替默認(rèn)的 Google Maps 圖釘圖標(biāo)的圖像。要指定這樣的圖
標(biāo),請(qǐng)將標(biāo)記的 icon
屬性設(shè)置為某個(gè)圖像的 URL。Google Maps API 將自動(dòng)調(diào)整圖標(biāo)大小。
簡(jiǎn)單圖標(biāo)代碼如下:
marker = new google.maps.Marker({
position: new google.maps.LatLng(30.54024807, 104.06966686),
title:'Hello World!',
draggable: true,
icon:'2.png',
animation: google.maps.Animation.DROP,
map:map
});
您也許想要指定復(fù)雜的形狀來表示可點(diǎn)擊的區(qū)域,并指定這些圖標(biāo)相對(duì)于其他疊層的顯示方式(即它們的“疊放
順序”)。以這種方式指定的圖標(biāo)應(yīng)該將其 icon
屬性設(shè)置為一個(gè) Icon
類型的對(duì)象。
Icon
對(duì)象定義了一個(gè)圖像。該對(duì)象還定義了圖標(biāo)的 size
(大小)、圖標(biāo)的 origin
(原點(diǎn),例如當(dāng)您想要
的圖像是一個(gè)較大圖像的一部分時(shí)),以及 anchor
(錨點(diǎn)),錨點(diǎn)是圖標(biāo)熱點(diǎn)的所在之處(基于原點(diǎn))。
var image = {
url: '2.png',
//標(biāo)注的大小32*32像素
size: new google.maps.Size(32, 32),
//標(biāo)注的原點(diǎn)是0,0
origin: new google.maps.Point(0, 0),
// 錨點(diǎn)在底邊上
anchor: new google.maps.Point(0, 32)
};
marker = new google.maps.Marker({
position: new google.maps.LatLng(30.54024807, 104.06966686),
title:'Hello World!',
draggable: true,
icon:image,
zIndex:100,
animation: google.maps.Animation.DROP,
map:map
});