Я пишу кроссплатформенное веб-приложение, которое отображает информацию с использованием SVG. Мне нужен мультисенсорный интерфейс для панорамирования и масштабирования SVG-графики. Из моего исследования выяснилось, что Hammer.js - мой лучший подход, и я использую версию библиотеки jQuery.

Я могу панорамировать и масштабировать изображение с помощью свойства viewBox SVG. Проблема яЯ использую информацию о центральной точке во время масштабирования (по сравнению с масштабированием из верхнего левого угла). Эта центральная точка, где бы она ни находилась на моем изображении, должна оставаться в центре щепотки. Ясно, что решение состоит в том, чтобы изменить первые две части viewBox, но яЯ не могу определить правильные значения. Центральная точка (event.gesture.center), по-видимому, находится в координатах страницы браузера, поэтому мне нужно выяснить, как надежно масштабировать ее, а затем рассчитать координаты viewBox x и y. Я'я искал примеры, но не могне найти ничего, что было бы связано.

Является ли использование атрибута viewBox лучшим способом масштабирования изображений SVG? Есть ли лучшие альтернативы? У кого-нибудь есть пример кода увеличения изображения SVG из центра пинча?

Также я'я заметил, что, хотя яПривязывая обработку событий к элементу SVG, жест пинча, кажется, работает из любой точки страницы. Это н't браузер по умолчанию обрабатывает пинч, потому что он только масштабирует изображение SVG, используя мой код. Вот'это код, который яm используется для привязки события пинч:

$(window.demoData.svgElement).hammer().on("pinch", function (event) {
    event.preventDefault();
    ...
});

Спасибо за любую помощь по этим двум вопросам.