0

我有一个函数，它基本上使用线条来绘制一个特定大小的伪圆并用颜色填充它。

但是，当我尝试调用我的方法时，它不会绘制，并且我在调试控制台（我使用的是 chrome）上没有发现任何错误，并且 jsfiddle 没有为我抛出任何错误。

这是代码：

function drawLineCircle (x, y, size, colour, scale, segments) {
    context.save();

    context.strokestyle = '#000000';
    context.fillStyle   = colour;
    context.lineWidth   = 3;

    context.beginPath();

    var anglePerSegment = Math.PI *2 / segments;

    for (var i = 0; i <= segments; i = i + 1){
        var angle  = anglePerSegment * i;
        var radius = size * scale;
        var a      = x + radius * cos (angle);
        var b      = y + radius * sin (angle);
        if (i == 0)
            context.moveTo (a, b);
        else
            context.lineTo (a, b);

    }

    context.stroke();
    context.fill();

    context.closePath();
    context.restore();
}

任何帮助将不胜感激！

4

1 回答 1

1

您的代码有几个问题：

  1. 你没有定义context
  2. cos并且sin是Math

这是一个更正的示例：http: //jsfiddle.net/REw7j/1/

function drawLineCircle (x, y, size, colour, scale, segments) {
    var canvas = document.getElementById('example');
    var context = canvas.getContext('2d');
    context.save();

    context.strokestyle = '#000000';
    context.fillStyle   = colour;
    context.lineWidth   = 3;

    context.beginPath();

    var anglePerSegment = Math.PI *2 / segments;

    for (var i = 0; i <= segments; i = i + 1){
        var angle  = anglePerSegment * i;
        var radius = size * scale;
        var a      = x + radius * Math.cos (angle);
        var b      = y + radius * Math.sin (angle);
        if (i == 0)
            context.moveTo (a, b);
        else
            context.lineTo (a, b);

    }

    context.stroke();
    context.fill();

    context.closePath();
    context.restore();
}
于 2012-12-08T16:49:45.497 回答