Away3D Forum Irregular Polygon

bitmapdata, Newbie
Posted: 13 August 2012 04:51 PM Total Posts: 24

How would I create a irregular polygon shape given a bunch of points?

Richard Olsson, Administrator
Posted: 16 August 2012 09:44 AM Total Posts: 1192 [ # 1 ]

Using the vertex and index buffers of SubGeometry. Look at how the parsers or primitives work.

bitmapdata, Newbie
Posted: 16 August 2012 10:21 AM Total Posts: 24 [ # 2 ]

Hi Richard, Thanks,
What are index buffers and how do I know the correct numbers to give it? Had a hard time finding this info.
Thanks,
Jacob

Richard Olsson, Administrator
Posted: 16 August 2012 10:25 AM Total Posts: 1192 [ # 3 ]

The index buffer specifies which vertices (from the vertex buffer) that make up a triangle, using the index of the vertices in the vertex buffer.

For example if you have just three vertices in a vertex buffer (each with x, y, z positions, so 9 numbers in total) their indices are 0, 1 and 2. To create a single triangle using these three vertices you insert into the index buffer those three indices.

This is a general concept in GPU programming (and even non-GPU Flash programming using the Graphics.drawTriangles() method) so you should be able to find some general information about how this works.

Also, look in the existing primitives to figure out how vertex, index and UV buffers can be filled procedurally.

bitmapdata, Newbie
Posted: 16 August 2012 11:31 AM Total Posts: 24 [ # 4 ]

Thank you. That helps a lot.

bitmapdata, Newbie
Posted: 19 August 2012 11:38 AM Total Posts: 24 [ # 5 ]

I got it initially working! But I have some issues.
Here is it working sort of:
http://customers.bisonkick.com/away/irregpoly.png
I passed in the coordinated as an array of Point objects.
I then triangulate the shape (using a custom class I found which returns an array of custom Triangle objects each with three points (p0,p1p2) for the three corners of the triangle)
I got the triangulation classes from here: http://en.nicoptere.net/?p=16
I then duplicate the shape at the required depth to create a top and bottom cap for the polygon. I then go around the original coordinates of the polygon (which is the border) and I add two triangles around each coordinate to be the sides.
For the UV data I have absolutely no ideawhat I am doing (after researching this) so I just add enough numbers to the uv array with 0.5. This is probably what is giving it that court jester look.
I know it’s not right because when I try to use it in CSG it just doesn’t work right at all. Also when I add rotation to it, it flies away meaning that the center or centroid is not right.
How should I be doing the UV data correctly?
Is this the right method to follow to make an irregular polygon?
Here is the code:

var triangles:Array = EarCutting.cut(sdm.coordinates);
   var segments:Array = EarCutting.buildSegments(sdm.coordinates);
   var s:Segment;
   
   var vertices:Vector.<Number> = new Vector.<Number>;
   var indices:Vector.<uint> = new Vector.<uint>;
   var uvs:Vector.<Number> = new Vector.<Number>;
   
   
   var t:Triangle;
   var count:uint = 0;
   // make flat side
   for each( t in triangles )
   {
    //top cap
    indices.push(count,++count,++count);
    vertices.push(
     t.p0.x,
     0,
     t.p0.y,
     t.p1.x,
     0,
     t.p1.y,
     t.p2.x,
     0,
     t.p2.y);
    
    count++;
    //bottom cap
    indices.push(count,++count,++count);
    vertices.push(
     t.p0.x,
     sdm.depth,
     t.p0.y,
     t.p1.x,
     sdm.depth,
     t.p1.y,
     t.p2.x,
     sdm.depth,
     t.p2.y);
    count++;
   }
   
   //make walls around poly
   for each(s in segments)
   {
    indices.push(count,++count,++count);
    vertices.push(
     s.p0.x,
     0,
     s.p0.y,
     
     s.p0.x,
     sdm.depth,
     s.p0.y,
     
     s.p1.x,
     0,
     s.p1.y);
    count++;
    
    indices.push(count,++count,++count);
    vertices.push(
     s.p1.x,
     0,
     s.p1.y,
     
     s.p1.x,
     sdm.depth,
     s.p1.y,
     
     s.p0.x,
     sdm.depth,
     s.p0.y);
    count++;
   }
   
   var _numUvs:uint = (triangles.length * 2) + (segments.length * 2);
   for(var i:uint = 0; i < _numUvs; i++)
   {
    uvs.push(0.5,0.5,0.5,0.5,0.5,0.5);
   }
   
   var subGeometry:SubGeometry = new SubGeometry();
   subGeometry.updateVertexData(vertices);
   subGeometry.updateUVData(uvs);
   subGeometry.updateIndexData(indices);
   subGeometry.autoDeriveVertexTangents  = true;
   subGeometry.autoDeriveVertexNormals = true;
   
   model.reuseGeometry = new Geometry();
   model.reuseGeometry.addSubGeometry(subGeometry);
   
   model.cavityMaterial.bothSides = true;
   
   model.reuseMesh.geometry = model.reuseGeometry;
   model.reuseMesh.material = model.cavityMaterial;

   model.reuseMesh.x = (mainFoamHeight / 2) - sdm.y;
   model.reuseMesh.y = shapeDepthNum - (sdm.depth / 2) + 0.01;
   //meshCyl.y = 0.3;
   //width -1 to left +1 to right 0 center
   model.reuseMesh.z = (mainFoamWidth / 2)  - sdm.x;    model.reuseMesh.rotati
   model.view3D.scene.addChild(model.reuseMesh);
  } 

Tayyab, Member
Posted: 22 August 2012 02:08 AM Total Posts: 72 [ # 6 ]

this is the class i have been using, i found this in the away3d Forum:

package
{
 import away3d.core.base.SubGeometry;
 import away3d.materials.MaterialBase;
 import away3d.primitives.PrimitiveBase;
 
 import flash.geom.Vector3D;
 
 public class Triangle extends PrimitiveBase
 {
  private var _v0:Vector3D;
  private var _v1:Vector3D;
  private var _v2:Vector3D;
  private var _uv0:Vector3D;
  private var _uv1:Vector3D;
  private var _uv2:Vector3D;
  
  // Define vertices in a clockwise manner.
  public function Triangle(v0:Vector3D, v1:Vector3D, v2:Vector3D,
         uv0:Vector3D = null, uv1:Vector3D = null, uv2:Vector3D = null)
  {
   super(/*material*/);
   
   _v0 = v0;
   _v1 = v1;
   _v2 = v2;
   _uv0 = uv0;
   _uv1 = uv1;
   _uv2 = uv2;
  }
  
  override protected function buildGeometry(target:SubGeometry):void
  {
   var rawVertices:Vector.<Number> = Vector.<Number>([_v0.x, _v0.y, _v0.z, _v1.x, _v1.y, _v1.z, _v2.x, _v2.y, _v2.z]);
   var rawIndices:Vector.<uint> = Vector.<uint>([0, 1, 2]);
   
   var d0:Vector3D = _v1.subtract(_v0);
   var d1:Vector3D = _v2.subtract(_v0);
   var rawTangents:Vector.<Number> = Vector.<Number>([0, 0, 0]);
   
   var normal:Vector3D = d0.crossProduct(d1);
   normal.normalize();
   var rawNormals:Vector.<Number> = Vector.<Number>([normal.x, normal.y, normal.z, normal.x, normal.y, normal.z, normal.x, normal.y, normal.z]);
   
   target.updateVertexData(rawVertices);
   target.updateIndexData(rawIndices);
   target.updateVertexNormalData(rawNormals);
   target.updateVertexTangentData(rawTangents);
  }
  
  override protected function buildUVs(target:SubGeometry):void
  {
   var rawUvData:Vector.<Number>
   if(_uv0 && _uv1 && _uv2)
    rawUvData = Vector.<Number>([_uv0.x, _uv0.y, _uv1.x, _uv1.y, _uv2.x, _uv2.y]);
   else
    rawUvData = Vector.<Number>([0, 0, 0, 1, 1, 1]);

   target.updateUVData(rawUvData);   
  }
 }  
} 

everything works fine, except that the UVData is still messing up, its probably because i haven’t still got the hang of UVMapping in away3d.


rawUvData = Vector.<Number>([0, 0, 0, 1, 1, 1]);

the line above rotates the UVs.

I hope it helps you, and if you manage to do it, let me know aswell. maybe i would get some hints as to how to implement proper UVMapping.

bitmapdata, Newbie
Posted: 22 August 2012 02:06 PM Total Posts: 24 [ # 7 ]

Thanks for that. I don’t really know how to solve uv issues either. But I’ve been using the set uv dummy data. That’s in sub geometry.
So how would you use this triangle class when creating irregular polygons?

Irregular Polygon Software: Away3D 4.x

bitmapdata, Newbie Posted: 13 August 2012 04:51 PM Total Posts: 24 How would I create a irregular polygon shape given a bunch of points?
Richard Olsson, Administrator Posted: 16 August 2012 09:44 AM Total Posts: 1192 [ # 1 ] Using the vertex and index buffers of SubGeometry. Look at how the parsers or primitives work.
bitmapdata, Newbie Posted: 16 August 2012 10:21 AM Total Posts: 24 [ # 2 ] Hi Richard, Thanks, What are index buffers and how do I know the correct numbers to give it? Had a hard time finding this info. Thanks, Jacob
Richard Olsson, Administrator Posted: 16 August 2012 10:25 AM Total Posts: 1192 [ # 3 ] The index buffer specifies which vertices (from the vertex buffer) that make up a triangle, using the index of the vertices in the vertex buffer. For example if you have just three vertices in a vertex buffer (each with x, y, z positions, so 9 numbers in total) their indices are 0, 1 and 2. To create a single triangle using these three vertices you insert into the index buffer those three indices. This is a general concept in GPU programming (and even non-GPU Flash programming using the Graphics.drawTriangles() method) so you should be able to find some general information about how this works. Also, look in the existing primitives to figure out how vertex, index and UV buffers can be filled procedurally.
bitmapdata, Newbie Posted: 16 August 2012 11:31 AM Total Posts: 24 [ # 4 ] Thank you. That helps a lot.
bitmapdata, Newbie Posted: 19 August 2012 11:38 AM Total Posts: 24 [ # 5 ] I got it initially working! But I have some issues. Here is it working sort of: http://customers.bisonkick.com/away/irregpoly.png I passed in the coordinated as an array of Point objects. I then triangulate the shape (using a custom class I found which returns an array of custom Triangle objects each with three points (p0,p1p2) for the three corners of the triangle) I got the triangulation classes from here: http://en.nicoptere.net/?p=16 I then duplicate the shape at the required depth to create a top and bottom cap for the polygon. I then go around the original coordinates of the polygon (which is the border) and I add two triangles around each coordinate to be the sides. For the UV data I have absolutely no ideawhat I am doing (after researching this) so I just add enough numbers to the uv array with 0.5. This is probably what is giving it that court jester look. I know it’s not right because when I try to use it in CSG it just doesn’t work right at all. Also when I add rotation to it, it flies away meaning that the center or centroid is not right. How should I be doing the UV data correctly? Is this the right method to follow to make an irregular polygon? Here is the code: var triangles:Array = EarCutting.cut(sdm.coordinates); var segments:Array = EarCutting.buildSegments(sdm.coordinates); var s:Segment; var vertices:Vector.<Number> = new Vector.<Number>; var indices:Vector.<uint> = new Vector.<uint>; var uvs:Vector.<Number> = new Vector.<Number>; var t:Triangle; var count:uint = 0; // make flat side for each( t in triangles ) { //top cap indices.push(count,++count,++count); vertices.push( t.p0.x, 0, t.p0.y, t.p1.x, 0, t.p1.y, t.p2.x, 0, t.p2.y); count++; //bottom cap indices.push(count,++count,++count); vertices.push( t.p0.x, sdm.depth, t.p0.y, t.p1.x, sdm.depth, t.p1.y, t.p2.x, sdm.depth, t.p2.y); count++; } //make walls around poly for each(s in segments) { indices.push(count,++count,++count); vertices.push( s.p0.x, 0, s.p0.y, s.p0.x, sdm.depth, s.p0.y, s.p1.x, 0, s.p1.y); count++; indices.push(count,++count,++count); vertices.push( s.p1.x, 0, s.p1.y, s.p1.x, sdm.depth, s.p1.y, s.p0.x, sdm.depth, s.p0.y); count++; } var _numUvs:uint = (triangles.length * 2) + (segments.length * 2); for(var i:uint = 0; i < _numUvs; i++) { uvs.push(0.5,0.5,0.5,0.5,0.5,0.5); } var subGeometry:SubGeometry = new SubGeometry(); subGeometry.updateVertexData(vertices); subGeometry.updateUVData(uvs); subGeometry.updateIndexData(indices); subGeometry.autoDeriveVertexTangents = true; subGeometry.autoDeriveVertexNormals = true; model.reuseGeometry = new Geometry(); model.reuseGeometry.addSubGeometry(subGeometry); model.cavityMaterial.bothSides = true; model.reuseMesh.geometry = model.reuseGeometry; model.reuseMesh.material = model.cavityMaterial; model.reuseMesh.x = (mainFoamHeight / 2) - sdm.y; model.reuseMesh.y = shapeDepthNum - (sdm.depth / 2) + 0.01; //meshCyl.y = 0.3; //width -1 to left +1 to right 0 center model.reuseMesh.z = (mainFoamWidth / 2) - sdm.x; model.reuseMesh.rotati model.view3D.scene.addChild(model.reuseMesh); }
Tayyab, Member Posted: 22 August 2012 02:08 AM Total Posts: 72 [ # 6 ] this is the class i have been using, i found this in the away3d Forum: package { import away3d.core.base.SubGeometry; import away3d.materials.MaterialBase; import away3d.primitives.PrimitiveBase; import flash.geom.Vector3D; public class Triangle extends PrimitiveBase { private var _v0:Vector3D; private var _v1:Vector3D; private var _v2:Vector3D; private var _uv0:Vector3D; private var _uv1:Vector3D; private var _uv2:Vector3D; // Define vertices in a clockwise manner. public function Triangle(v0:Vector3D, v1:Vector3D, v2:Vector3D, uv0:Vector3D = null, uv1:Vector3D = null, uv2:Vector3D = null) { super(/material/); _v0 = v0; _v1 = v1; _v2 = v2; _uv0 = uv0; _uv1 = uv1; _uv2 = uv2; } override protected function buildGeometry(target:SubGeometry):void { var rawVertices:Vector.<Number> = Vector.<Number>([_v0.x, _v0.y, _v0.z, _v1.x, _v1.y, _v1.z, _v2.x, _v2.y, _v2.z]); var rawIndices:Vector.<uint> = Vector.<uint>([0, 1, 2]); var d0:Vector3D = _v1.subtract(_v0); var d1:Vector3D = _v2.subtract(_v0); var rawTangents:Vector.<Number> = Vector.<Number>([0, 0, 0]); var normal:Vector3D = d0.crossProduct(d1); normal.normalize(); var rawNormals:Vector.<Number> = Vector.<Number>([normal.x, normal.y, normal.z, normal.x, normal.y, normal.z, normal.x, normal.y, normal.z]); target.updateVertexData(rawVertices); target.updateIndexData(rawIndices); target.updateVertexNormalData(rawNormals); target.updateVertexTangentData(rawTangents); } override protected function buildUVs(target:SubGeometry):void { var rawUvData:Vector.<Number> if(_uv0 && _uv1 && _uv2) rawUvData = Vector.<Number>([_uv0.x, _uv0.y, _uv1.x, _uv1.y, _uv2.x, _uv2.y]); else rawUvData = Vector.<Number>([0, 0, 0, 1, 1, 1]); target.updateUVData(rawUvData); } } } everything works fine, except that the UVData is still messing up, its probably because i haven’t still got the hang of UVMapping in away3d. `rawUvData = Vector.<Number>([0, 0, 0, 1, 1, 1]);` the line above rotates the UVs. I hope it helps you, and if you manage to do it, let me know aswell. maybe i would get some hints as to how to implement proper UVMapping.
bitmapdata, Newbie Posted: 22 August 2012 02:06 PM Total Posts: 24 [ # 7 ] Thanks for that. I don’t really know how to solve uv issues either. But I’ve been using the set uv dummy data. That’s in sub geometry. So how would you use this triangle class when creating irregular polygons?

Irregular Polygon

Login

Away3D Forum

Member Login