Collins Software
Software Developer
713-682-1556
ICMap Cg2 JavaScript PHP ETerms Mav Contact Links Videos

DOWNLOAD

CollinsPDF
CollinsHTML
Collins3D
CollinsPARSE
CollinsCOMPILER
CollinsLANGUAGE

CollinsPDF GUIDE
CollinsHTML GUIDE

Math Tags
Report Tags
Graphic Tags
Macro Tags
Misc Tags
Character Set
FAQ

CollinsPlot3D &  CollinsGraphic

CollinsPlot3D.js
Free JavaScript 3D plotting package to HTML Canvas
 perform 3D to 2D projections, transformations, texturing, and hidden surface removal

CollinsGraphic.js
Free JavaScript to manage graphic layers and features with output to CollinsPlot3D


EXAMPLES (Chrome / Firefox / IE9 Examples, -- draw on Canvas)
Bouncing Ball  Sphere  Line Cube  I-Beams 

Capabilities

  • Lines (N-sided)
  • Arc (N-sided)
  • Circles (N-sided)
  • Points (N-sided)
  • Ball (N-Sided)
  • Cube (N-Sided)
  • Polygons / Shape
  • Triangles (Faces)
  • Mesh
  • Symbols
  • Text

Capabilities

  • complex shapes
  • recording 2D graphic primitives
  • recording 2D images

Output formats:

  • Draw on HTML Canvas
  • Export to CG2 (*.cg2)
  • Export to 3D File Format COLLADA (*.dae)

Drawing 3D graphic Features (CG2) (data)

<script src="CollinsPlot3d.js"></script>
<script src="CollinsGraphic.js"></script>
<script>
	graphic = new graphic$();
	graphic.add('layer,roads,color=blue');
	graphic.add('line,roads,style=squarePipe,2,0:0:0,100:100:100');
	graphic.add('cube,,color=red:name=squarePipe,0:0:0,,1,1,1');
	graphic.add('cube,,name=roundPipe:sides=8,0:0:0,1,1,1');
	graphic.add('ball,,sides=32,0:0:0,1,1,1');
	graphic.add('polygon,,height=20,3,100:100:100,150:150:100,120:200:150');
	graphic.add('arc,,,100:100:0,::45,100,0,90');
	graphic.add('circle,,,150:150:50,90,100');
	graphic.add('text,,,150:150:50,90,Hello World,0,CenterCenter');
	graphic.add('symbol,,,150:150:50,90,0,Star,0,LowerLeft');
	graphic.add('mesh,,,4,0:0:0,100:100:0,100:100:100,0:0:100,2,2,0:2:0,1:2:4,0:1:0');
	graphic.add('face,,,3,100:100:100,150:150:100,120:200:150,1,1:2:3');
	
	plot = new plot3d$();
	plot.lootAt(0,0,0);
	plot.lookFrom(100,250,300);
	graphic.draw(plot,'myCanvas');
</script>


Copyright © 2012, Collins Software
Privacy