плавная анимация pixi.js по радиусу окружности

#javascript #d3.js #leaflet #pixi.js

#javascript #d3.js #брошюра #pixi.js

Вопрос:

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

https://drive.google.com/file/d/10d5L_zR-MyQf1H9CLDg1wKcvnPQd5mvW/view?usp=sharing

Всего с несколькими окружностями D3 работает нормально. Затем браузер сворачивается. Я совершенно новичок в Pixi.js Я думаю, это должно быть сделано с изменением масштаба. Мне удалось изменить это, но совсем не плавно. Есть что-то похожее на D3.js для анимации?

Я пытаюсь использовать листовку.Плагин PixiOverlay, используемый в качестве ссылки для кодирования этого примера заранее спасибо

Ответ №1:

Линейная интерполяция:

 lerp = (a, b, c) => a * (1 - c)   b * c;
  

Используйте это при выполнении цикла requestAnimationFrame

 circle.radius = lerp(circle.radius, /* Your Radius Here*/, 0.1);