Question

我需要旋转图片，但我的代码并没有围绕中心旋转，我不明白为什么。当我运行它时，我看不到它，所以我怀疑它是在屏幕之外绘制的。

push();
rotate(PI / 2 * rotation);
imageMode(CENTER);
image(this.texture, centerPosX, centerPosY);
pop();

当我删除rotate时，它会正确绘制图像，但我需要旋转它。

Answer 1

提供了一个在其他人感到懒惰时旋转图像的功能。

使用rotate_and_draw_image（），您应该能够像传递给普通image（）一样传递相同的信息，但是以度数定义了额外的旋转值。（图像的位置定义为左上角（与默认位置相同，因此无需进行任何更改）。

有点低效的流程，但应该易于实现。很高兴看到任何改进。

cron.schedule("* * * * *", function() {   // every day at 4am = 0 4 * * *
    console.log("running a task every minute");
  });

Answer 2

在旋转之前，您需要将画布原点转换为中心或画布中的任何点（您希望使旋转中心）。

这可以使用translate()方法完成。

<强>ᴅᴇᴍᴏ

var img;

function setup() {
   createCanvas(300, 300);
   img = loadImage('https://i.imgur.com/Q6aZlme.jpg');
}

function draw() {
   background('#111');
   translate(width / 2, height / 2);
   rotate(PI / 180 * 45);
   imageMode(CENTER);
   image(img, 0, 0, 150, 150);
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.5.10/p5.min.js"></script>

如何在p5.js中旋转图像

2 个答案: