Processing.js 形状不起作用答案

【问题标题】：Processing.js shape not workingProcessing.js 形状不起作用
【发布时间】：2017-05-24 20:08:35
【问题描述】：

我编写了一个函数来绘制具有任意边数的多边形。但是，当我仅在 Java 脚本中运行它时，它不起作用。为什么？

    function sketchProc(processing) {

function polygon (sides, centerX, centerY, radius, fillColor, strokeColor) {
    processing.fill(fillColor);
    processing.stroke(strokeColor);
    var innerAngle = 360/sides;
    var rotationAngle = innerAngle;
    processing.beginShape();
    for (var i = 0; i < sides + 2; i++) {
        processing.vertex(centerX + radius*Math.sin(rotationAngle), centerY + radius*Math.cos(rotationAngle));
    console.log(centerX + radius*Math.sin(rotationAngle), centerY + radius*Math.cos(rotationAngle));
        rotationAngle = innerAngle * i;

    }
    processing.endShape();
}}

它只是画了一个奇怪的锯齿形。（我稍后在我的代码中实现了这个功能，它工作正常，只是形状搞砸了。）

【问题讨论】：

您能否发布一个指向运行您的代码的 JSFiddle 或 CodePen 的链接？
@KevinWorkman 当我输入画布和外部脚本时，它们不起作用。
我不确定你在说什么。我们需要能够运行代码。最好的方法是组合一个 JSFiddle 或一个 CodePen。
当我在其中任何一个中运行代码时，我的画布元素都没有出现；结果视图中不显示任何画布。
能否请您 fork 一个像 this jsfiddle 这样的示例，修改您的更改以演示问题，然后 edit 您的问题包含更新版本的链接？这样我们就可以看到问题了。

标签： javascript function processing.js

【解决方案1】：

将来，您可能希望自己编辑您的问题，而不仅仅是使用 JSFiddle 进行评论。您也可以@reply 每个要求它的人。不然我们看不到！无论如何，谢谢你把它放在一起。

看看这一行：

processing.vertex(centerX + radius*Math.sin(rotationAngle), centerY + radius*Math.cos(rotationAngle));

请注意，您将 rotationAngle 输入到 sin() 和 cos() 函数中。另请注意，rotationAngle 以度数指定。（0 到 360 之间的值。）

这适用于可汗学院，因为默认情况下它们的功能需要学位。

但是，普通的 Processing 和 Processing.js 采用弧度的参数！（介于 0 和 2 PI 之间的值。）所以您必须将您的 rotationAngle 变量转换为弧度值！您可以使用方便的radians() 函数来做到这一点。

更多信息可以在the reference找到。

【讨论】：

非常感谢！