Skip to content

how to draw arc which is same as origin canvas arc api? #1840

@lzuntalented

Description

@lzuntalented

Why DrawNode.drawCircle have not a param like startAngle?
It is often necessary to draw an arc.
When I write it by myself, DrawNode.drawSegment be called many time.

The error show me:

Failed to allocate buffer for DrawNode: buffer for 2034 vertices requested

So, could you help me to fix it?
It is very important to me. Thanks!

The code like:

drawCircle: function (handler, center, radius, startAngle, endAngle, segments, drawLineToCenter, lineWidth, color) {
		const _vertices = []; 
		const angle = startAngle;
        lineWidth = lineWidth || this._lineWidth;
        color = color || this._drawColor;
        var coef = endAngle / segments, i, len;
        for (i = 0; i <= segments; i++) {
            var rads = i * coef;
            var j = radius * Math.cos(rads + angle) + center.x;
            var k = radius * Math.sin(rads + angle) + center.y;
            _vertices.push([j, k]);
        }
        if (drawLineToCenter)
            _vertices.push([center.x, center.y]);

        for (i = 0, len = _vertices.length - 1; i < len; i += 1) {
        	const _from = {};
        	const _to = {};
            _from.x = _vertices[i][0];
            _from.y = _vertices[i][1];
            if (i === len - 1) {
            	if (endAngle > 2 * Math.PI) {
            		_to.x = _vertices[0][0];
            		_to.y = _vertices[0][1];
            	} else {
            		break;
            	}
            } else {
            	_to.x = _vertices[i + 1][0];
            	_to.y = _vertices[i + 1][1];
            }
            
            handler.drawSegment(_from, _to, lineWidth, color);
        }
    }

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions