Category: svg

13
Окт
2021

подскажите как доделать прогресс бар на svg

Как сделать такой рейтинг или прогресс бар? я начал делать его на svg но как правильно его реализовать я не знаю.
нужно что бы это выглядело как прогресс бар, или что то наподобие рейтинга, который должен может кто знает как такое реализов…

08
Окт
2021

не работает svgr/webpack

Выдает ошибку когда пытаюсь вывести svg через плагин svgr/webpack
Error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: object.

в зависимости плагин установлен,…

08
Окт
2021

не работает svgr/webpack

Выдает ошибку когда пытаюсь вывести svg через плагин svgr/webpack
Error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: object.

в зависимости плагин установлен,…

07
Окт
2021

Как изменить заливку круга на основе цвета фона с помощью javascript?

В основном я хочу, чтобы круг менял цвет, когда ползунок перемещает его по флагу: зеленый на белом фоне, белый на зеленом прямоугольнике.

function move() {
let slider = document.querySelector(“#slider”);
let circle = document.query…

05
Окт
2021

Возможность учитывать координаты для вставки в path

Всем добрый день
Встал такой вопрос о возможности получения координат для вставки в path не через сторонний софт (Illustrator/Inkscape) а напрямую в вебе.
Принцип такой: помещаем картинку в область, кликами по ней ловим координаты чтоб мож…

03
Окт
2021

Как получить элементы SVG для заданных координат?

Я хотел бы получить элементы SVG для заданных координат.
Я пробовал использовать document.elementsFromPoint(x, y).
Однако он возвращает только основной элемент svg, а не под элементы (круги, пути и т.д .) внутри svg.
Как мне найти элементы…

24
Сен
2021

CSS – Можно ли анимировать clip на изображении, чтобы открывать квадранты по часовой стрелке?

У меня есть два круглых изображения. Верхнее изображение располагается абсолютно поверх нижнего изображения. Я показываю верхнее изображение с интервалом 25% с помощью клипа, и мне интересно, можно ли его анимировать, чтобы квадрант постеп…

17
Сен
2021

Прошу помочь разобраться с тем, как сделать подобное с svg

Необходимо сделать подобный спидометр, но я мало работал с svg, поэтому прошу помощи) Будет достаточно хотя бы направления, куда копать, как гуглить. Может какие то ссылки на похожие примеры. Заранее благодарен!

17
Сен
2021

Как сделать анимацию линии спидометра с выводом числовых значений скорости

Необходимо сделать подобный спидометр
,
но я мало работал с svg, поэтому прошу помощи) Будет достаточно хотя бы направления, куда копать, как гуглить. Может какие то ссылки на похожие примеры. Заранее благодарен!

06
Сен
2021

Как определить, находится ли точка внутри сложной, неправильной векторной формы (SVG)?

Я более-менее новичок во всем этом. Я пытаюсь создать приложение с использованием SVG (я бы предпочел векторные фигуры, которые можно масштабировать без потери качества). Используя веб-технологии и позже перейдем на React-native.
Есть ли …

05
Сен
2021

Как создать эффект (анимацию) вращения по оси Y объекта формы монеты с помощью СSS?

Была задумка сделать вращение круга, который по оси Z растягивался б на 20+ px (чтобы видно было толщину, как у ребра монеты), но как только я начал выставлять элементы по оси Z, элементы стали вращаться по совсем другой траектории. Как мо…

05
Сен
2021

Плавная горизонтальная прокрутка по якорям внутри SVG

Внутри блока с фиксированной шириной и горизонтальной прокруткой внутри него, находится длинный горизонтально ориентированный SVG-объект, внутри которого есть несколько элементов rect (разноцветные прямоугольники). Задача – организовать пл…

21
Авг
2021

Как я могу анимировать текст SVG, чтобы он постепенно появлялся

Я пытаюсь анимировать SVG, как если бы он был записан, как в этом примере на Codepen.
И как я могу сделать свою собственную SVG-анимацию (например, в коде приведенном ниже) такими же, как в Codepen?
(Помимо замены идентификатора пути!)

15
Авг
2021

Формула для динамического интервала <rect> в svg

Как сделать базу динамического интервала из координат возвращенных данных?
Я хочу, чтобы, если возвращаются только одно значение, они располагались посередине. Если возвращены несколько данных, он будет скорректирован и так далее.

var …

15
Авг
2021

Нужна помощь с svg canvas (скролл к последнему элементу). Как сделать прокрутку к последнему элементу на canvas svg

Кто-нибудь работал с графиками(Svg canvas)? Если да, то кто-то может подсказать, как сделать скролл в конец графика по нажатию определенной кнопки?(другими словами, передвижение к последний котировке ). Буду очень благодарен, если кто-то п…

15
Авг
2021

Нужна помощь с svg canvas (скролл к последнему элементу). Как сделать прокрутку к последнему элементу на canvas svg

Кто-нибудь работал с графиками(Svg canvas)? Если да, то кто-то может подсказать, как сделать скролл в конец графика по нажатию определенной кнопки?(другими словами, передвижение к последний котировке ). Буду очень благодарен, если кто-то п…

07
Авг
2021

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

У меня есть круг и простая функция Math.cos(x)
Я хочу, чтобы круг был заполнен, когда он пересекается с этой функцией (заполнить только верхнюю сторону).
Но это у меня не работает.
Script:
// circle
var point1 = app.board.create(‘point…

07
Авг
2021

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

У меня есть круг и простая функция Math.cos(x)
Я хочу, чтобы круг был заполнен, когда он пересекается с этой функцией (заполнить только верхнюю сторону).
Но это у меня не работает.
Script:
// circle
var point1 = app.board.create(‘point…

30
Июл
2021

Создайть нижнюю границу меньшего размера, чем элемент, и с более толстой серединой

Я использую стилизованные HR для создания разделителей секций.
Но теперь я пытаюсь создать элемент H1 с нижней границей меньше ширины H1 (переменная ширина в соответствии с шириной текста H1) и с более толстой чертой в середине (высотой).

29
Июл
2021

Как реализовать якорную ссылку при помощи JS и Ajax

Не получается реализовать якорную ссылку, как только не пробовал.
Есть страница https://gr-region.ru/cropproduction/
По центру расположен цветок, каждый лепесток ссылка на другую страницу, которую он при помощи ajax подгружает под цветком,…

25
Июл
2021

Как обеспечить минимальный радиус кубическим Безье?

Строится кривая, состоящая из множества кубических Безье, следующих друг за другом. Пробую обеспечить отсутствие крутых поворотов со сверхмалым радиусом, изломов.
Для этого вычисляю угол, образующийся между условным последним отрезком (по …