bug fix: ctx.drawImage() didn't like textures of size (0,0)
bug fix: wrong bounding box expressions.
I made a plugin to draw polygons (:
- Collision: Enabled|Disabled
- Debug Mode: Enabled|Disabled
- Is overlapping another object
Same as Sprite is overlapping
Same as Sprite is overlapping at offset
Same as Sprite collision enabled (return true if collision is enabled)
Trigger when the Draw action is executed
Compare the area of the drawn polygon
- Add Vertex(x,y,local or world-space)
add a vertex to the vertex list
remove a vertex from the vertex list
- Insert Vertex(index,x,y,local or world-space)
insert a vertex in the vertex list
- Move Vertex(index,x,y,local or world-space)
move a vertex of the vertex list
- SetOrigin(x,y,local or world-space)
change the origin of the polygon
print vertex list in the console log
- Draw Polygon(fillColor,lineWidth,lineColor)
draw the polygon using the vertex list, filling the shape with fillColor and stroking the outline with a line of thickness lineWidth and color lineColor
clear the vertex list and erase the polygon
load a vertex list in JSON format
open a window with a download link of a JSON file containing the a vertex list
- Area: area in px of the shape. gives a wrong results for invalid polygons (when edges cross each other)
- asJSON: return the vertex list as a JSON string (to use in the load action)
- OriginalWidth: width of the original polygon texture
- OriginalHeight: height of the original polygon texture
- LocalVertexX(index): the original values entered in Add Vertex (local-space)
- LocalVertexY(index): the original values entered in Add Vertex (local-space)
- VertexX(index): X position of the vertex (by index) in world space
- VertexY(index): Y position of the vertex (by index) in world space
- VertexCount: total number of vertices in the vertex list (usefull to loop through them)
- Left: X position of left of unrotated bounding box
- Right: X position of right of unrotated bounding box
- Top: Y position of top of unrotated bounding box
- Bottom: Y position of bottom of unrotated bounding box
- CenterX: X position of center of unrotated bounding box
- CenterY: Y position of center of unrotated bounding box
- BarycenterX: X position of barycenter (average of vertices position)
- BarycenterY: Y position of barycenter (average of vertices position)
How does it work?
A polygon is defined by an ordered list of vertices.
To create this list you use the action Add Vertex.
The order in which you add vertices is important. The plugin will draw the polygon starting from the first vertex you added until the last one and close the shape back to the first.
Another thing to keep in mind, when you Add vertices, you add them relatively to the position/orientation/scale of the object (local space) or directly in the world position (world-space)
So if you want to make a square around the origin of the object you will have something like that:
global number sideLength = 100
Polygon: Add vertex -sideLength/2, -sideLength/2 (local-space)
Polygon: Add vertex sideLength/2, -sideLength/2 (local-space)
Polygon: Add vertex sideLength/2, sideLength/2 (local-space)
Polygon: Add vertex -sideLength/2, sideLength/2 (local-space)
But if you do only that, nothing will happen. Once you've built your vertex list, you have to tell C2 to draw the polygon (it's not done after each Add for obvious reasons (:)
To draw the polygon, it looks like that:
Polygon: draw with outline (1.0 px, "rgb(255,0,0)") and fill with ("hsl(180,50%,50%)")
(you have to specify color with a string (in "") and you can use either rgb(r,g,b), hsl(hue,saturation,lightness) or "#rrggbb" or special recognized values like "black" "red" "green" etc)
You can move, or remove vertices via their indexes (0-based)
You can insert a vertex inside the list by giving an index.
If the index you specify is negative or greater than the index of the current last vertex, it will be respectively clamped to 0 or [index of the last vertex] + 1
Clear polygon will do two things at the same time:
empty the vertex list and delete the current polygon texture.
I basically copied the piece of code from the Array plugin. So you can load and save a vertex list in JSON format.
It can be usefull if you want to copy a polygon shape or save some shape for later uses (polygon editor?)
When you use the draw polygon action, you basically create a texture. This texture can then be scaled using width/height, and rotated using angle.
But remember that since it became a texture, you will see stretching artefacts.
Another thing to be aware of, if you stretch your polygon, you basically modify the relation between originalWidth (which is the distance between the left most and the right most vertex in local space) and current Width of the object.
The draw polygon action will keep this relation.
If your width is twice your originalWidth, and you modify your vertex list and draw, the ratio will be kept.
Local-Space vs World-Space
Add, Insersion and move can be either done in local space or world space.
Local-space means relative to the space of the polygon object. So if you add vertices and then change the angle of the object, you'll have the same result the other way around.
Via expression, you have access to the local coordinate (LocalVertexX,LocalVertexY) or the world-space coordinate, their real position in the world (VertexX,VertexY)
The value you get from the Area expression or evaluated with the Compare area condition will be right for convex and concave polygon but wrong for invalid polygons (when two edge cross each other).
You can set the Origin of the polygon wherever you want to, even after your vertex list is built.
The vertex list will be recalculated accordingly, and the position will be changed so the origin is moved but nothing is changed visually.
It may be usefull to set a new rotating point or anything you want to do in runtime.
You can test it in the demo.capx in the zip or Creation/Edition demo below.
To help you during development, you can enable the debug mode property.
This way you can see what vertex are added, inserted or removed, when polygon are drawn and when JSON's are loaded
But sometimes you don't need that much, or you would prefer triggering debug information yourself via event.
For that, you have the log vertex list action. It will write the list of vertices in the console (only in preview)
You can test everything about scaling, rotating, vertex creation here:
Just to fool around
Creating random graphs
One possible application of it:
One crazy really unusable and "you shouldn't do that" application:
Here is the plugin with the capx of the demo in it.
(I didn't provide the 3D one because I don't want to encourage anyone to use that method (:)
I made some video to show you how I to use it
Polygon Plugin:RamblingActionsExpressionsPolygon Splitting:Starting ShapeCutting NodesNode SelectionSplit FunctionLine EquationGroupingChildren CreationPolygon SelectionHelper FunctionsFeedbacksNode FilteringLittle BugFinal Rambling
Do remember that drawing a polygon is an expensive computation, avoid as much as possible to do that every tick.
I hope you like it and don't hesitate to report bug and tell me how you used it (:Yann2013-04-23 00:21:22