@outplayedrq

Как можно отрисовать и округлить два аватара в Canvas?

Добрый день, пытаюсь вывести два аватара в canvas, без округления - выводится, если делать округление только первой всё выводится. Делаю округление второй - выводится только первая. Я так понимаю, где-то я не там begin и closePath поставил, могли бы вы подсказать, что не так. Пример взят с документации Discord JS

// Output Avatar 1

  ctx.beginPath();
  ctx.arc(125, 125, 100, 0, Math.PI * 2, true);
  ctx.closePath();
  ctx.clip();

  const avatar1 = await loadImage(member.user.displayAvatarURL({ format: 'jpg' }));
  ctx.drawImage(avatar1, 25, 25, 200, 200);

// Output Avatar 2

  ctx.beginPath();
  ctx.arc(575, 125, 100, 0, Math.PI * 2, true);
  ctx.closePath();
  ctx.clip();

  const avatar2 = await loadImage(member.user.displayAvatarURL({ format: 'jpg' }));
  ctx.drawImage(avatar2, 500, 25, 200, 200);
  • Вопрос задан
  • 42 просмотра
Решения вопроса 1
RAX7
@RAX7
// Output Avatar 1
  ctx.save(); // <- сохраняем контекст
  ctx.beginPath();
  ctx.arc(125, 125, 100, 0, Math.PI * 2, true);
  ctx.closePath();
  ctx.clip();

  const avatar1 = await loadImage(member.user.displayAvatarURL({ format: 'jpg' }));
  ctx.drawImage(avatar1, 25, 25, 200, 200);
  ctx.restore(); // <- восстанавливаем контекст

тоже самое повторить со 2-ой картинкой
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы