Как сделать перетягивание и увеличение изображения как в примере?

Question

[Николай Евсюков]

https://www.mapplic.com/real-estate/?location=lot28
Здесь реализован функционал наподобии карты, меня интересует есть ли либы jquery которые позволяют перетягивать изображение и увеличивать как в примере.

Comments

[Николай Евсюков]

prntscr.com/h2zjn4 у меня почему-то пример перестал открываться я добавил скрин. На скрине не видно, но зажал ЛКМ можно перетягивать карту в этом фиксированном окне

Answer 1

[Stalker_RED]

Для зума подписываетесь на wheel и применяете transform: scale()

С перетягиванием чуть сложнее:
При событии mousedown начинаете слушать mousemove
При mousemove сдвигаете объект (translate)
При mouseup или mouseleave - прекращаете слушать mousemove
(в некоторых либах оно есть готовое, называется "drag" или типа того)

Библиотек для SVG вагон и тележка, при этом почти все они могут работать и с jQuery.