SpiderPigAndCat
@SpiderPigAndCat
занимаюсь салообразованием

Как скейлить svg карту как гугл карту?

Есть крта svg. Каждая страна это path как можно увеличить скролом этоу карту, двигать ее мышкой и увеличивать на телефоне и двигать как гугл карту. d3 не работает (дергается и на телефоне слишком чувствительный. уменьшал параметры на телефоне чтоб убрать сильную чувствительность но сработало не полностью и все еще дергается.)
Вот сайт. (все полностью законно и это просто информация на американский рынок. Никак не продажа или типа того)
  • Вопрос задан
  • 275 просмотров
Решения вопроса 2
SpiderPigAndCat
@SpiderPigAndCat Автор вопроса
занимаюсь салообразованием
сделал все максимально просто
дока тут
<script src='https://unpkg.com/panzoom@9.4.0/dist/panzoom.min.js'    query='#svg' name='pz'></script>


let move_y=0;
       let move_x=0;
       $(".zoom").on("click", function() {pz.zoomTo(move_x, move_y, 1.25)})
       $(".unzoom").on("click", function() {pz.zoomTo(move_x, move_y, 0.8)})
       $(".arrdown").on("click", function() {  pz.moveTo(move_x, move_y+=10) })
       $(".arrup").on("click", function() {pz.moveTo(move_x, move_y-=10) })
       $(".arrright").on("click", function() {pz.moveTo(move_x+=10, move_y) })
       $(".arrleft").on("click", function() {pz.moveTo(move_x-=10, move_y) })
Ответ написан
Комментировать
Recreator
@Recreator
использовать готовый плагин, например svg.panzoom.js
Ответ написан
Комментировать
Пригласить эксперта
Ответы на вопрос 1
profesor08
@profesor08 Куратор тега JavaScript
Оберни свою свг в контейнер, и навешивай все ивенты на этот контейнер. На основе полученных данных из ивентов двигай карту.
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы