Https://Www.Figma.Com/Proto/89wgPvgI4dxBHiwTpsbiux/JS-Task?Node-Id=1%3A2&Viewport=787%2C600%2C0.9435064792633057&Scaling=Min-Zoom Скажите пожалуйста, такая анимация при нажатии на canvas, в реакте

Если писать с нуля. 1) Матрица для сетки графика 2) Координаты точек - расположить на сетке 3) Высчитывание углов от одной точки к другой - сделать линию А вот как это анимировать, уже задача не из простых...

0

13.02.2022

Arslan Sarakaev Автор вопроса

Назар Швець
Если писать с нуля. 1) Матрица для сетки графика ...

Эти 3 сделал, дальше не могу😂😂

0

13.02.2022

Arslan Sarakaev Автор вопроса

Назар Швець
Если писать с нуля. 1) Матрица для сетки графика ...

https://codesandbox.io/s/graph-ssri8?file=/src/components/GraphCanvas.jsx

0

13.02.2022

Ilya Agarkov

Назар Швець
Если писать с нуля. 1) Матрица для сетки графика ...

“Высчитывание углов от одной точки к другой - сделать линию” - да это то не проблема. в свг можно прям рисовать линию от точки до точки

0

13.02.2022

Назар Швець

Arslan Sarakaev
Эти 3 сделал, дальше не могу😂😂

Если точек неизменное кол-во. Кейс для 2 точек 1) Разделить анимацию на шаги 2) Узнать конечную точку(для 2) 3) Узнать позицию на некст шаг 4) Поворачивать линию на угол этого шага анимации + повышать/понижать позицию точки Не, это прям сложна. Геометрию давно не трогал

0

13.02.2022

Назар Швець

Назар Швець
Если точек неизменное кол-во. Кейс для 2 точек 1) ...

Крч можешь посмотреть на d3.js, я бы на нём пробовал такое мутить

0

13.02.2022

Arslan Sarakaev Автор вопроса

Назар Швець
Крч можешь посмотреть на d3.js, я бы на нём пробов...

Спасибо большое! Я чуть ли уже не оставил это. Попробую.

0

13.02.2022