Google지도 마커에서 효과/애니메이션을 만드는 방법을 알고 싶습니다. 특히, 주어진 시간 후에 마커를 확대/축소하거나 "페이드"하고 싶습니다. HTML5에서 가능할 수 있습니까? 이 일을위한 jquery 효과 라이브러리가 있습니까? 사전에Google지도 마커를 사용한 효과 및 애니메이션
감사를
(... 나는지도 타일 오버레이를 만들기위한지도 타일 서버를 사용할 수 있습니다 및 타일 오버레이마다 초를 다시 생성하지만, 나는 그것이 매우 처리 집약적 인 것 같다)
필자는이 작업을 수행 할 라이브러리를 보지 못했으며, API에서 마커를 약화시킬 수있는 기능이 없습니다.
대신 마커처럼 보이는 Custom Overlay을 만들어 마커를 시뮬레이션 할 수 있습니다. 사용자 정의 오버레이는 대개 div가 포함되어 있습니다.이 div는 사용자 정의 오버레이 작성 중에 할당 한 클래스 나 ID를 기반으로 JavaScript/jQuery를 사용하는 불투명도를 쉽게 제어 할 수 있습니다.
예를 들어, this 페이지를 보면 가시성을 전환하는 데 사용되는 버튼을 볼 수 있습니다. 그 JavaScript를 쉽게 변경하여 무언가의 불투명도를 제어 할 수 있습니다.
나는 비슷한 것을하고있다. 모든 마커에 마커 옵션 'optimized : false'를 설정하면 각 마커에 고유 한 요소가 있으므로 jQuery를 사용하여지도의 모든 마커를 $ ('# map_canvas img [src * = "filename"] '), 마커에 대해 사용자 정의 이미지를 사용한다고 가정합니다.
이 문제를 해결하기 위해 반환 된 배열의 각 요소가 특정 마커와 관련되어 있습니다. 지도에 마커를 한 번에 하나씩 추가하고 jquery 선택기를 다시 실행하고 반환 된 요소와 이전 실행을 비교하여 어떤 요소가 새로운 요소인지 확인할 수 있다고 생각합니다. 나는이 부분을 테스트하지 않았다. (나는 첫 번째 단락에서 내가 말한 것을 가지고있다.) 나는 약간 다른 것을 시도하고있다.
그런 다음 이미지의 불투명도/크기를 직접 조정할 수 있어야합니다. 많은 수의 표식에 대해서는 어색해 할 수 있습니다.
위의 두 번째 단락은 어리 석다.
지도에 표식을 추가하고 최적화 됨 : false 옵션을 설정해야합니다.
var freshlyAddedMarkerImage = $('#map_canvas img[src*="your_marker_icon"][class!="adjustMe"]');
새로 추가 된 마커에는 클래스가 없으므로 선택된 유일한 요소가됩니다. className을 설정하기 전에 ID를 설정하고 해당 마커 객체가 다른 배열에 보유 된 것과 같은 색인 위치에있는 요소에 요소를 추가 할 수 있습니다.
구현하기에 훨씬 까다롭지 않아야합니다 나는 이전에 제안했다. 조만간 실습 예제를 시도해 보겠습니다.
같은 변환이나 확대/축소를 사용하는 마커 그룹이 있다는 것을 알고 있다면 같은 나이가 되었기 때문에 모든 것을 추가하고 jQuery select 만 사용하면됩니다. 마지막으로 반환 된 요소를 반복하면서 en-masse를 조정할 수있는 클래스를 설정합니다.