Изменение размера изображения значка маркера Google Maps


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

Я хочу изменить размер до стандартного меньшего размера. Каков наилучший способ сделать это?

код:

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"
  });
}
5 102

5 ответов:

если исходный размер равен 100 x 100 и вы хотите масштабировать его до 50 x 50, используйте scaledSize вместо Size.

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
});

Как уже упоминалось в комментариях, это обновленное решение в пользу объекта 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
 });

MarkerImage был осужден для значка

до версии 3.10 Google Maps JavaScript API, сложные иконки были определены как объекты MarkerImage. Объект значок литерал был добавлен в 3.10, и заменяет MarkerImage от версии 3.11 и далее. Икона объектные литералы поддерживают те же параметры, что и MarkerImage, что позволяет вы можете легко конвертировать MarkerImage в значок, удалив конструктор, обертывающий предыдущие параметры в {} ' s, и добавление имена каждого параметра.

код Филиппа теперь будет:

 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
 });

полный новичок, как я к теме может найти его труднее реализовать один из этих ответов, чем, если в пределах вашего контроля, чтобы изменить размер изображения себя С онлайн-редактором или редактором фотографий, таким как Photoshop.

изображение размером 500x500 будет отображаться на карте больше, чем изображение размером 50x50.

Программирование не требуется.

удалить начало и якорь будет более регулярное изображение

  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
 });