mirror of
https://github.com/processing/processing4.git
synced 2026-01-29 11:21:06 +01:00
js mode example: render node tree graph
This commit is contained in:
@@ -0,0 +1,13 @@
|
||||
|
||||
// wait for document to load
|
||||
window.onload = function () {
|
||||
tryFindSketch();
|
||||
}
|
||||
|
||||
function tryFindSketch () {
|
||||
var sketch = Processing.instances[0];
|
||||
if ( sketch == undefined )
|
||||
return setTimeout(tryFindSketch, 200);
|
||||
|
||||
sketch.setTree( document.body.parentNode );
|
||||
}
|
||||
@@ -0,0 +1,88 @@
|
||||
/**
|
||||
* Renders a simple graph from this documents node tree.
|
||||
*/
|
||||
|
||||
Node tree;
|
||||
float tx, ty;
|
||||
float growth = 0.1;
|
||||
|
||||
void setup ()
|
||||
{
|
||||
size( 500, 500 );
|
||||
|
||||
tx = width/2;
|
||||
ty = height-20;
|
||||
}
|
||||
|
||||
void draw ()
|
||||
{
|
||||
background(255);
|
||||
|
||||
if ( tree != null )
|
||||
{
|
||||
drawNode( tree, tx, ty, -HALF_PI, 200 );
|
||||
|
||||
growth += 0.005;
|
||||
growth = constrain(growth, 0, 1);
|
||||
}
|
||||
|
||||
textFont(createFont("Arial",10));
|
||||
}
|
||||
|
||||
void drawNode ( Node n, float x, float y, float rad, int level )
|
||||
{
|
||||
fill(0);
|
||||
noStroke();
|
||||
ellipse(x,y,5,5);
|
||||
|
||||
drawNodeLabel( n.nodeName, x+5, y );
|
||||
|
||||
level *= 0.75;
|
||||
|
||||
if ( n.childNodes != null && n.childNodes.length > 0 )
|
||||
{
|
||||
float l = n.childNodes.length;
|
||||
float d = 90.0*growth/l;
|
||||
float d2 = ((l-1)/2)*d;
|
||||
|
||||
for ( int i = 0; i < l; i++ )
|
||||
{
|
||||
float r = radians(d * i - d2) + rad;
|
||||
float nx = x + cos(r)*level*growth;
|
||||
float ny = y + sin(r)*level*growth;
|
||||
|
||||
stroke(0);
|
||||
line(x,y,nx,ny);
|
||||
|
||||
drawNode( n.childNodes[i], nx, ny, r, level );
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
void drawNodeLabel ( String label, float x, float y )
|
||||
{
|
||||
float tw = textWidth(label);
|
||||
|
||||
fill(200);
|
||||
ellipse( x+10, y, 14, 14 );
|
||||
ellipse( x+10+tw, y, 14, 14 );
|
||||
rect( x+10, y-7, tw-2, 14 );
|
||||
|
||||
fill(0);
|
||||
text( label, x+10, y+3 );
|
||||
}
|
||||
|
||||
void setTree ( Node root )
|
||||
{
|
||||
tree = root;
|
||||
}
|
||||
|
||||
|
||||
/* explain Node to Processing */
|
||||
interface Node
|
||||
{
|
||||
Node[] childNodes;
|
||||
String nodeName;
|
||||
String nodeType;
|
||||
Node parentNode;
|
||||
}
|
||||
Reference in New Issue
Block a user