Действительно хорошая и приятная работа. Спасибо!
ыло интересно, как лучше всего переместить круг из точки А в точку Б, используя плавную анимацию.
Я получаю новые координаты с websocket каждую секунду и хотел бы анимировать движение круга от последней точки к новой точке в течение этой секунды.
В этой скрипке я представил, как будет выглядеть установка. Я заменил сторону ws ручным вводом кнопки для этой тестовой цели, но в ней отсутствовала функция перемещения круга.
jQuery тоже приветствуется.
var x = 100;
var y = 50;
var r = 10;
var WIDTH = 600;
var HEIGHT = 400;
var canvas = document.getElementById("canvas");
var ctx = canvas.getContext("2d");
function circle(x, y, r) {
ctx.beginPath();
ctx.arc(x, y, r, 0, Math.PI * 2, true);
ctx.fill();
}
function clear() {
ctx.clearRect(0, 0, WIDTH, HEIGHT);
}
function draw() {
clear(WIDTH, HEIGHT);
ctx.fillStyle = "purple";
circle(x, y, r);
}
draw();
https://jsfiddle.net/1g18rsqy/
Спасибо :)