创建圆形游戏板 - 旋转不按我想要的方式工作

Question

我正在尝试用p5.js制作游戏板。我希望电路板的圆形形状总共有60个瓷砖，这意味着旋转应该是6度（6 * 60 = 360度），如果我想要60个圆形的瓷砖。

即使我认为我做得对，我也无法解决这个问题。这基本上就是我想做的事情：

如果我尝试使用/** * Downloads the image at the given URL if not present in cache or return the cached version otherwise. * * @param url The URL to the image * @param options A mask to specify options to use for this request * @param progressBlock A block called while image is downloading * @note the progress block is executed on a background queue * @param completedBlock A block called when operation has been completed. * * This parameter is required. * * This block has no return value and takes the requested UIImage as first parameter and the NSData representation as second parameter. * In case of error the image parameter is nil and the third parameter may contain an NSError. * * The forth parameter is an `SDImageCacheType` enum indicating if the image was retrieved from the local cache * or from the memory cache or from the network. * * The fith parameter is set to NO when the SDWebImageProgressiveDownload option is used and the image is * downloading. This block is thus called repeatedly with a partial image. When image is fully downloaded, the * block is called a last time with the full image and the last parameter set to YES. * * The last parameter is the original image URL * * @return Returns an NSObject conforming to SDWebImageOperation. Should be an instance of SDWebImageDownloaderOperation 并且没有翻译（因为这显然完全不起作用），我会得到这样的结果：

在https://jsfiddle.net/mortenmoulder/ze6fn3av/查看我的代码（您可能需要调整窗口大小并再次点击运行）并在此处：

rotate(6)

我做错了什么？

Answer 1

前言：我之前从未使用过p5.js.

无论如何，我调整了你的代码并且非常接近：

var tileInnerWidth = 52;
var tileOuterWidth = 57
var tileHeight = 50;

translate(width / 2, height / 2);
for (let i = 0; i <= 60; i++) {
    quad(-tileOuterWidth/2, centerH, tileOuterWidth/2, centerH, tileInnerWidth/2, centerH - tileHeight,-tileInnerWidth/2,centerH - tileHeight);
    rotate(6);
}

这是一个小提琴：https://jsfiddle.net/mht3o21p/2/

解释我在做什么：

• 有一个翻译可以将原点移动到屏幕的中间位置，以便旋转可以相对于那个
• 我绘制了圆形底部的梯形。它需要水平居中，因此它的x坐标除以2.尺寸是通过反复试验来挑选的，看起来不错。
• 我旋转6度并重复。