Google지도처럼 작동하는 이미지 스크롤러를 만들고 싶습니다. 웹 사이트가 처음로드 될 때 이미지의 일부를 포함하는 페이지 중간에보기 상자가 나타납니다. 사용자는 스크롤하고있는 이미지를 클릭하여 드래그하여 이미지의 다른 영역을 검사 할 수 있습니다. 사용자가 이미지 둘레를 벗어나 스크롤하면 상자에 인접한 이미지가로드됩니다. 또한 이러한 이미지를 사용자가 클릭하여 자세한 내용을 볼 수있는 마커로 오버레이하고 싶습니다.javascript - 이미지 스크롤과 같은 Google지도
이미 원하는 것을하는 라이브러리가 있습니까? 아니면 내가 원하는대로 가깝게 커스터마이징을 시작할 수 있습니까? 또는 처음부터 구축해야한다면 일반적인 접근 방식에 대한 제안은 무엇입니까?
jquery 라이브러리를 사용하는 것이 좋기 때문에 jquery로 구축 한 모든 것이 멋질 것입니다.
Overscroll jQuery 플러그인을 살펴보십시오.
나는 이와 비슷한 프로젝트에 OpenLayers을 사용했으며 매우 효과적입니다! jQuery를 기반으로하지 않습니다.
무료지도를 제공하지만 나만의 이미지를 가질 수도 있습니다.
나는 이것이 당신이 찾고있는 모든 것을 않습니다 생각하지 않지만, 시작하기에 좋은 장소가 될 수 있습니다 그냥 몇 가지 디자인 아이디어에 대한 SpryMap
당신의 해결책을 찾기/기록 할 때 고려해야 :
두 가지 방법이 있습니다. 하나는 여러 개의 잘린 이미지로 사용자가 근처로 스크롤 할 때 미리로드하고 다른 하나는 더 간단하고 하나의 큰 이미지를로드하는 것입니다.
이미지가 매우 큰 경우 세그먼트를 미리로드하는 솔루션을 선택해야합니다. 세그먼트를 미리로드하면 훨씬 원활하게 처리 할 수 있습니다.
큰 이미지는 일부 컴퓨터/모바일 장치의 속도를 크게 떨어 뜨립니다.
직접 작성한 항목은 순수한 jQuery 일 수 없습니다. 큰 이미지를 캐시하는 세그먼트로 처리하거나 즉시 세그먼트를 처리하는 서버 스크립트를 작성하고 싶을 것입니다. 그것이 jQuery를 사용하여로드 된 ans를 제어 할 수있는 시점입니다.
나는 CraftMap이 당신이 요구하는 것을 제공한다고 생각합니다. 그러나 확대/축소를 지원하는지 확신 할 수 없습니다.
[SpryMap 데모] (http://www.spidersMap.au/demo/sprymap/) 및 [GitHub의 IE 수정 코드] (https://github.com/slav123/SpryMap)도 확인하십시오. – Genhis