Когда я загружаю изображение в свойство значка маркера, оно отображается с исходным размером, который намного больше, чем должен быть.
Я хочу изменить размер от стандартного до меньшего. Как лучше всего это сделать?
Код:
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"
});
}
javascript
google-maps
google-maps-markers
image-resizing
Golan_trevize
источник
источник
scaledSize
вместоscale
= любовьКак упоминалось в комментариях, это обновленное решение в пользу объекта Icon с документацией.
Использовать объект Icon
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 });
источник
icon object
иscaledSize: new google.maps.Size(h, w)
собственность на этом объектеnew google.maps.Size(w, h)
НЕ ДОЛЖНО быть h, wMarkerImage устарел для Icon
Код Филиппа теперь будет:
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 });
источник
scaledSize
скорее хотите , чемsize
.Удалите начало координат и привязка будет более обычной картинкой
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 });
источник
Полному новичку, подобному мне, может оказаться труднее реализовать один из этих ответов, чем, если это под вашим контролем, самостоятельно изменить размер изображения с помощью онлайн-редактора или фоторедактора, такого как Photoshop.
Изображение 500x500 будет больше на карте, чем изображение 50x50.
Никакого программирования не требуется.
источник
Так что у меня была такая же проблема, но немного другая. У меня уже был значок в виде объекта, как предлагает Филиппе Буассонно , но я использовал изображение SVG.
Для меня это решило следующее:
переключиться с SVG-изображения на PNG и последовать примеру Кэтрин Нио о том, что изображение в два раза больше того, что вы будете использовать.
источник
Если вы используете vue2-google-maps, как я, код для установки размера выглядит следующим образом:
<gmap-marker .. :icon="{ .. anchor: { x: iconSize, y: iconSize }, scaledSize: { height: iconSize, width: iconSize }, }" >
источник