Описание тега snap.svg

Snap.svg - это библиотека JavaScript для создания и работы с SVG.
1 ответ

Местные и абсолютные координаты в Snap.svg

https://jsfiddle.net/foreyez/mfcqx7vw/ var s = Snap("#svg"); var block = s.rect(100, 100, 100, 100, 20, 20); block.attr({ fill: "rgb(236, 240, 241)", stroke: "#1f2c39", strokeWidth: 3 }); block.animate({ transform: "T0,0" }, 200); Я пытаюсь перевес…
22 ноя '16 в 21:31
0 ответов

Snap svg .click предупреждение не срабатывает

У меня есть событие click, привязанное к графике SVG, однако предупреждение не срабатывает при нажатии. Я использую оснастку SVG. greenBoySign = greenBoy.select('g#greenBoySign'); greenBoySign.click(function () { alert("button clicked"); }); Сценари…
19 май '14 в 16:04
1 ответ

Можно ли создать элемент привязки без создания объекта SVG? [Snap.svg]

Я хочу подготовить некоторые элементы оснастки, а затем присоединить их к svg. Документы Snap() говорят, что Snap() может только обернуть существующий объект SVG или создать новый. Я не могу найти метод для создания экземпляра Snap без фактического …
30 апр '16 в 20:50
1 ответ

Snap SVG - анимация пути в обратном направлении

Я работаю над анимацией пути, но застрял в том, как сделать это в обратном порядке. http://jsfiddle.net/t1yu3mcn/1/ В настоящее время красный путь начинается во всю длину, и со временем становится все короче и короче от правильного направления. Я хо…
24 фев '15 в 18:23
1 ответ

snap.svg, jquery.svg стрелка анимации вдоль пути, оставляя след (имеет закругленные углы)

Я потратил довольно много времени на переходы между snap.svg и jquery.svg, пытаясь понять, как анимировать следующее: Стрела, которая рисует, но оставляет хвост позади себя Стрелка имеет изгибы на 90 градусов, но находится на кривой Таким образом, я…
09 июн '14 в 10:56
1 ответ

Динамически обновлять таблицу датчиков Snap.svg

Я нашел некоторый код для диаграммы на Codepen (кредиты: Генри Пойдар), которая использует snap.svg для создания анимированной диаграммы. angular.module('app', []); angular.module('app') .controller('metricsCtrl', function($scope) { $scope.percentag…
25 апр '16 в 21:10
1 ответ

Загрузить сжатый SVG с Snap SVG

Я имею: Snap.load(src, function(f){im = canvas.canvasSvg.g(f.select('*'));}); Где переменная src содержит направление к файлу svg (как в: "resources/foo.svg"). Мне нужно поместить загруженный svg в группу, чтобы получить к нему доступ позже. Это пре…
20 авг '14 в 15:10
1 ответ

Как создать форму "U" с помощью Snap.svg?

Мне нужно создать обратную форму U с использованием JavaScript, но я не могу понять это. В некоторой степени похожа на эту форму ломаной линии, но изогнута в конце, используя те же точки. Я нашел примеры кода для сложной анимации с кривыми и прочим,…
18 апр '17 в 18:30
1 ответ

Как опросить объект события snap svg, чтобы получить координату viewbox?

У меня есть простой SVG-файл, содержащий 2 прямоугольника и текст: <?xml version="1.0" encoding="UTF-8" standalone="no"?> <!-- Created with Inkscape (http://www.inkscape.org/) --> <svg id="mySvg" onload="init()" xmlns:rdf="http://www.…
09 дек '15 в 18:21
1 ответ

Snap.svg: Как программно отменить текущую операцию перетаскивания?

Как отменить операцию перетаскивания в Snap.svg? Я проверил Документы и Группу Google, но не нашел ничего полезного. В настоящее время я устанавливаю var показывая, что операция должна быть отменена, отменить эффект и return из каждого dragMove обра…
28 июн '16 в 06:58
1 ответ

Альтернативное / резервное изображение при использовании Snap SVG

Я только что скачал Snap SVG, и я пытаюсь выяснить, как отобразить изображение с резервным расположением. Вот код: var s = Snap("#MyPopup"); var g = s.g(); var image = g.image("http://myimages.com/xyz.png", 250, 10, 40,40 ); Это отображает изображен…
13 окт '16 в 11:54
2 ответа

Заставить элементы li наследовать всю ширину своих контейнеров

Я пытаюсь заставить элементы li / a в этом примере использовать всю ширину анимированного меню svg-snap, которое вы можете увидеть здесь... http://tympanus.net/Development/ElasticSVGElements/dropdown.html Моя последняя попытка быть здесь... http://c…
16 окт '15 в 16:40
1 ответ

Мне нужно перерисовать связанные линии, когда круги перемещаются SNAP SVG

Круги имеют бесконечную анимацию. Мне нужно все время перерисовать линию через них. ЯШ: var paperHeader = Snap(".circle_anim"); var lineHeader = paperHeader.path("").attr({fill: "transparent", stroke: "#9b9b9c", strokeWidth: 2}); function flyCircle(…
23 сен '15 в 16:11
0 ответов

Explorer 11 не может удалить элемент USE

Я использую библиотеку snapsvg; Удалить <use> элемент в IE11 не работает; Как я могу это исправить? c = Snap(400, 620); c.rect(0, 0, 400, 620).attr({ fill : 'white', stroke : 'black' }); var pattern25x25; var createDiodePattern = function () {…
28 июн '14 в 11:31
1 ответ

Чтение и изменение значения поворота элемента в SnapSVG

Просьба проверить эту неполную скрипку ( https://jsfiddle.net/JayKandari/srqLLd97/). Разметка: <svg id="paper" ></svg> <div id="workingArea"> <button onclick="calculateTransform()">Get Transform</button> <div class="…
09 янв '16 в 07:39
2 ответа

Не пересекающиеся Draggables с Snap.svg (Javascript)

Я впервые публикую вопрос в переполнении стека, поэтому не стесняйтесь комментировать, как я могу улучшить свой вопрос. Я пытаюсь сделать два перетаскиваемых прямоугольника SVG, которые не могут перекрываться. Чтобы сделать это, я использовал Snap.s…
0 ответов

Как использовать snap.svg нарисовать значок загрузки

Как использовать snap.svg нарисовать загрузку как этот https://jxnblk.github.io/loading/, Я думаю, что может использовать метод Snap.load, но я хочу, чтобы он был в центре контейнера. Я пытаюсь использовать pager.group чтобы обернуть его, но все они…
03 авг '14 в 11:57
1 ответ

SVG анимация пути от центральной точки

Я пытаюсь анимировать SVG, который имеет 3 этапа: начальный, зависание и щелчок. Я хочу анимировать все этапы из одной строки. Я использую Snap SVG, чтобы заставить его работать. Вы можете просмотреть рабочий код по адресу http://codepen.io/anon/pen…
18 фев '16 в 10:08
0 ответов

Как замаскировать внутреннюю часть элемента с помощью snap.svg или svg

Я хотел бы знать, возможно ли замаскировать часть элементас формой другого элемента. Это звучит немного абстрактно, поэтому я предлагаю вам взглянуть на пример: Вот пример того, что я хотел бы сделать. Пример HTML (просто визуальный пример): <div…
06 янв '16 в 16:49
0 ответов

SVG поддерживает событие "dragover"?

У меня есть несколько SVG-фигур (внутри элемента ), и когда я перетаскиваю одну поверх другой, мне нужно выделить последнюю. После некоторых исследований я не смог найти упоминаний о нативной поддержке в браузере "dragover" событий для SVG-элементов…
16 фев '15 в 09:33