Processing.js形状不起作用

时间:2017-05-24 20:08:35

标签: javascript function processing.js

我有一个函数,我写的是用任意数量的边绘制多边形。但是,当我仅在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();
}}

它只是绘制一个奇怪的锯齿形状。 (我稍后在我的代码中实现了这个函数,它工作正常,只是形状搞砸了。)

1 个答案:

答案 0 :(得分:0)

将来,您可能希望自己编辑问题而不是仅使用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之间。)因此,您必须将rotationAngle变量转换为弧度值!您可以使用方便的radians()函数来执行此操作。

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