Method Description
GraphicImage.drawArc()
Draw an arc - partial ellipse
Syntax
GraphicImage = GraphicImage.drawArc(centre, width, height, colour, options)
Parameters
The 'GraphicImage.drawArc' method takes 5 parameters:
| Name | Type/Value | Range/Length | Description | | centre | struct GraphicImage.Point | see definition | Required.
The coordinates of centre point for the arc to be drawn
| | width | number | | Required.
Width of the elipse from which this arc is to be drawn
| | height | number | | Required.
height of the elipse from which this arc is to be drawn
| | colour | number | | Required.
The colour to use for drawing the arc. This can be any colour allocated
with 'colourAlloc' or 'colourResolve', or can be the special
value 'GraphicImage.styled' to use the
defined styled.
| | options | MetaData | | Optional. Object containing optional values that change how the rectangle is drawn |
Results
The 'GraphicImage.drawArc' method returns GraphicImage:
| Type/Value | Range/Length | Description |
| GraphicImage |
|
Returns a reference to 'this' if the operation succeeds, otherwise throws an exception.
|
Remarks Draw an arc - a portion on an ellipse specified by a start and end angle.
The ellipse is specified by it's centre point (the first parameter) and by
the width and height of it's containing rectangle. The last parameter to this call is an set of 'options' expressed as a JavaScript object. To
specify a non-default value for one of these options, include the options object and
set attributes as necessary. Currently defined flags are : | Option | Default | Description |
|---|
| antialias | true |
If set to 'true' anti-aliasing techniques will be used to remove jagged edges.
Note this attribute is currently reserved but has no effect on
the underlying drawing functions at this time - the graphics library doesn't currently
support anti-aliasing of arcs.
| | fill | false | If 'true' the internal area of the arc is filled with the specified colour | | startAngle | 0 |
The start angle for the arc to be drawn. The angle is measured in degrees,
clockwise from the 3 o'clock position. To move anti-clockwise specify
a negative angle.
| | endAngle | 359 |
The end angle for the arc to be drawn. The angle is measured in degrees,
clockwise from the 3 o'clock position. To move anti-clockwise specify
a negative angle.
| | arc | true |
Defines how to draw the outside edge of the ellipse. Imagine the two points on
the ellipse defined by the start angle and the end angle. With 'arc' true
these points are drawn connected together with a curved arc. The alternative
is 'chord'. 'arc' and 'chord' are mutually exclusive.
| | chord | false |
Defines how to draw the outside edge of the ellipse. Imagine the two points on
the ellipse defined by the start angle and the end angle. With 'chord' true
these points are drawn connected together with a straight line. The alternative
is 'chord'. 'arc' and 'chord' are mutually exclusive.
| | edged | false |
If set to true then a straight line is drawn from the centre of the ellipse
to the point on the ellipse defined by the start angle, and that defined
by the end angle. Setting 'chord' to true and 'edged' to true creates a typical
pie-slice type wedge shape.
|
Note that the defaults for startAngle (0) and endAngle (359) describe a complete circle. Example Draw a quarter circle 'pie-slice' outline (don't fill). Note that the ellipse is always drawn from the
startAngle to the endAngle, clockwise.
// Create an empty 100x100 pixel image
var img = (new GraphicImage).create(100,100);
// Draw a quarter circle in the top-right hand quadrant of the image
var blue = img.colourAlloc(0,0,255);
img.setPenWidth(3);
img.drawArc( {x:50,y:50}, // Center of the circle
100,100, // width, height
blue,
{
startAngle:-90,
endAngle:0,
edged:true
});
|
