jvectormap плавное увеличение и уменьшение при нажатии

Question

Кто-нибудь знает, возможно ли увеличение масштаба изображения в jvectormap с помощью анимации, например плавного погружения, и если да, то как я могу продолжить? Я искал это весь день, и я не могу поверить, что никто другой никогда не искал это, поскольку я думаю, что это будет иметь столь большое значение для и без того удивительного плагина. Я пробовал использовать функцию animate jquery, но она не работает с SVG, если я не использую плагин Raphael. Я не могу использовать его, так как мне действительно нужно использовать функциональность маркеров jvectormap, и я, к сожалению, не могу объединить два плагина.

Буду признателен за любую оказанную помощь.

Спасибо джефф

Answer 1

Да, это возможно.

Увеличение происходит, когда элемент группы svg (тег g под тегом svg) имеет новые значения для масштаба и перевода. Эти значения устанавливаются как атрибут html. Если вы установите эти значения в качестве атрибутов CSS, то вы можете анимировать их с помощью переходов CSS.

Я попробовал на моей консоли Firefox. Это работает довольно хорошо.

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

Этот метод может не работать в старых браузерах, так как они не поддерживают преобразование. Вы можете подумать о проверке поддержки преобразований и переходов и применять свою реализацию только тогда, когда она поддерживается.