Javascript - карта google как прокрутка изображения

Я хочу создать скроллер изображений, который работает как карта google. Когда сайт загружается первым, в середине страницы появится окно просмотра, содержащее часть изображения. Пользователь может щелкнуть и перетащить изображение, которое прокручивается, для проверки других областей изображения. Если пользователь выполняет прокрутку по периметру изображения, в поле будет загружено соседнее изображение. Я также хочу наложить эти изображения на маркеры, которые пользователь может щелкнуть, чтобы увеличить масштаб для более подробной информации.

Есть ли библиотека, которая уже делает то, что я хочу? Или что-то близкое к тому, что я хочу, чтобы начать его настраивать? Или, если мне нужно строить с нуля, любые предложения по общему подходу?

Мне нравится использовать jquery-библиотеку, поэтому все, что было построено с помощью jquery, было бы удивительным.

Ответ 1

Взгляните на плагин Overscroll jQuery.

Ответ 2

Я не думаю, что это делает все, что вы ищете, но может быть хорошим местом для начала: SpryMap

Ответ 3

Я использовал OpenLayers для проектов, подобных этому, и он отлично работает! Однако не на основе jQuery.

Он предоставляет бесплатные карты, но вы также можете иметь свои собственные изображения.

Ответ 4

Только для некоторых дизайнерских идей, которые необходимо учитывать при написании/поиске вашего решения:

Есть два способа сделать это: один с несколькими измельченными изображениями, которые предварительно загружаются, когда пользователь прокручивается рядом с ними, а другой, который проще и загружает одно большое изображение.

Если ваши изображения очень большие, вы должны выбрать решение, которое предварительно загружает сегменты, так как это будет намного более удобным для пользователя, если вы можете сделать это без проблем.

Большое изображение значительно замедлит работу некоторых компьютеров/мобильных устройств!

Ответ 5

Если вы сами что-то создали, это, вероятно, не может быть чистым jQuery. Вы хотите написать сервер script, который либо обрабатывает ваши большие изображения в сегменты, которые вы кешируете, либо обслуживает сегменты "на лету". Это тот момент, когда вы можете начать использовать jQuery для управления загружаемыми и когда.

Ответ 6

Я думаю, CraftMap, похоже, обеспечивает то, о чем вы просите. Но я не уверен, поддерживает ли оно масштабирование.