調整谷歌地圖標記圖標圖像

當我將圖像加載到標記的圖標屬性中時，它將顯示其原始大小，這比它應該大很多。調整谷歌地圖標記圖標圖像

我想將尺寸調整爲較小的尺寸。做這個的最好方式是什麼？

代碼：

function addMyPos(latitude,longitude){ 
    position = new google.maps.LatLng(latitude,longitude) 
    marker = new google.maps.Marker({ 
    position: position, 
    map: map, 
    icon: "../res/sit_marron.png" 
    }); 
}

來源

2013-02-26 Golan_trevize

169

如果原始尺寸爲100×100，並希望將其擴展到50×50，使用scaledSize而不是尺寸。

var icon = { 
    url: "../res/sit_marron.png", // url 
    scaledSize: new google.maps.Size(50, 50), // scaled size 
    origin: new google.maps.Point(0,0), // origin 
    anchor: new google.maps.Point(0, 0) // anchor 
}; 

var marker = new google.maps.Marker({ 
    position: new google.maps.LatLng(lat, lng), 
    map: map, 
    icon: icon 
});

來源

2014-07-17 04:27:36

+1，這是爲我工作的。 – elrobis 2014-10-15 17:05:20

這是如何在API v3下完成的。 – 2015-08-21 00:14:53

它的作品，但在這種方式，你失去了比例關於形象.. – 2015-12-07 16:23:42

正如評論mentionned，這是有利於與文檔圖標對象的更新的解決方案。

使用Icon object

var icon = { 
    url: "../res/sit_marron.png", // url 
    scaledSize: new google.maps.Size(50, 50), // scaled size 
    origin: new google.maps.Point(0,0), // origin 
    anchor: new google.maps.Point(0, 0) // anchor 
}; 

posicion = new google.maps.LatLng(latitud,longitud) 
marker = new google.maps.Marker({ 
    position: posicion, 
    map: map, 
    icon: icon 
});

來源

2013-02-26 18:29:55

感謝的人！讚賞 – 2013-02-26 18:40:38

+11

MarkerImage已被棄用：改爲使用圖標對象！ – Bertaud 2013-06-01 23:26:05

這不會調整圖像的大小，但會裁剪圖像嗎？ – 2014-04-09 18:36:12

MarkerImage has been deprecated for Icon

直到谷歌地圖的JavaScript API的版本3.10，複雜的圖標被定義爲MarkerImage物件。 Icon對象文字在3.10中被添加，並從版本3.11開始替換MarkerImage。圖標對象文字支持與MarkerImage相同的參數，允許您通過刪除構造函數，將{}中的以前的參數封裝並添加每個參數的名稱，來輕鬆地將MarkerImage轉換爲圖標。

菲利普的代碼現在將是：

var icon = { 
    url: "../res/sit_marron.png", // url 
    scaledSize: new google.maps.Size(width, height), // size 
    origin: new google.maps.Point(0,0), // origin 
    anchor: new google.maps.Point(anchor_left, anchor_top) // anchor 
}; 

position = new google.maps.LatLng(latitud,longitud) 
marker = new google.maps.Marker({ 
    position: position, 
    map: map, 
    icon: icon 
});

來源

2013-08-14 12:46:27 Jono

我認爲這不會調整圖像大小，但會裁剪圖像。 – 2014-04-09 18:38:14

你想'scaledSize'而不是'size'。 – bbodenmiller 2014-04-24 21:20:31

是啊同意@bbodenmiller，scaledSize可能是你正在尋找的。對於我的項目，我使用scaledSize並且適用於我。 var icon = {url：imageName，scaledSize：new google.maps.Size（8，12）}; – user908645 2015-04-16 06:07:56

像我這樣的初學者的話題可能會發現很難實現這些答案比之一，如果你的控制範圍內，以與在線編輯器或照片編輯器，Photoshop等調整自己的形象。

500x500圖像在地圖上會比50x50圖像顯得更大。

無需編程。

來源

2017-07-19 19:53:19 bearacuda13

刪除起源和錨將更加正規的畫面

var icon = { 
     url: "image path", // url 
     scaledSize: new google.maps.Size(50, 50), // size 
    }; 

marker = new google.maps.Marker({ 
    position: new google.maps.LatLng(lat, long), 
    map: map, 
    icon: icon 
});

來源

2018-01-24 11:46:09 ibrahimyanik

調整谷歌地圖標記圖標圖像

回答

相關問題