Google지도 크기 조정 마커 아이콘 이미지

Question

마커의 아이콘 속성에 이미지를로드 할 때 원래 크기로 표시됩니다. 크기가 훨씬 커야합니다.

표준 크기보다 작은 크기로 크기를 조정하려고합니다. 이 작업을 수행하는 가장 좋은 방법은 무엇입니까?

코드 :

의견 했나요으로

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

Answer 1

원래 크기는 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 
}); 

Answer 2

,이 문서와 아이콘 오브젝트에 찬성 업데이트 된 솔루션입니다.

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

Answer 3

MarkerImage has been deprecated for Icon

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

Answer 4

주제에 자신과 같은 완전한 초보자는 온라인 편집기 나 포토샵 같은 사진 편집기를 사용하여 이미지 자신 크기를 조정 에, 당신의 통제 내 경우는 열심히보다 이러한 응답 중 하나 구현하는 찾을 수 있습니다.

500x500 이미지는지도에서 50x50 이미지보다 크게 표시됩니다.

프로그래밍 할 필요가 없습니다.

Answer 5

삭제 기원과 앵커 더 정기적으로 사진을

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