Thank you all for your great replies. In particular I know I'll never be able to read references carefully enough..

Anyway I think sharing the result I got so far, could really help the discussion.

This is a working sketch that asks you to select a SVG file and then begins "drawing" it (something like the OpenCanvas animation effect..)

PShape s;

ArrayList ve;

int nve = 1;

// max length of segments

float slen = 5.0;

// scale factor for the image

float sf = 0.8;

String svgFile = "image.svg";

void setup() {

ve = new ArrayList();

frameRate(20);

size(400, 400);

svgFile = selectInput();

s = loadShape(svgFile);

s.scale(sf);

smooth();

//shape(s);

exVert(s, sf);

println("# of vertex: " + ve.size());

}

void draw(){

if(nve < ve.size()){

if(((Point) ve.get(nve)).z != -10.0) // a way to separate distinct paths

line(((Point) ve.get(nve-1)).x, ((Point) ve.get(nve-1)).y, ((Point) ve.get(nve)).x, ((Point) ve.get(nve)).y);

//ellipse( ((Point) ve.get(nve)).x, ((Point) ve.get(nve)).y, 2, 2 );

nve++;

}

else{ // restart drawing

background(200);

nve = 1;

}

}

// - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

// recursively find PShape children and trigger function to get existing vertex and fill-in vertex

//

void exVert(PShape s, float sf) {

PShape[] ch; // children

int n, i;

n = s.getChildCount();

if (n > 0) {

for (i = 0; i < n; i++) {

ch = s.getChildren();

exVert(ch[i], sf);

}

}

else { // no children -> work on vertex

n = s.getVertexCount();

//println("vertex count: " + n + " getFamily():" + s.getFamily()+ " isVisible():" + s.isVisible());

for (i = 0; i < n; i++) {

float x = s.getVertexX(i)*sf;

float y = s.getVertexY(i)*sf;

// println(i + ") getVertexCode:"+s.getVertexCode(i));

if (i>0) {

float ox = s.getVertexX(i-1)*sf;

float oy = s.getVertexY(i-1)*sf;

stepToVert(ox, oy, x, y, slen);

}

else {

ve.add(new Point(x, y, -10.0));

}

}

}

}

// - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

// fill in with points, if needed, from (ox, oy) to (x, y)

//

void stepToVert(float ox, float oy, float x, float y, float slen) {

int i;

float n;

float dt = dist(ox, oy, x, y);

if ( dt > slen) {

n = floor(dt/slen);

// println("Adding "+n+" points...");

for (i = 0; i < n; i++) {

float nx = lerp(ox, x, (i+1)/(n+1));

float ny = lerp(oy, y, (i+1)/(n+1));

ve.add(new Point(nx, ny, 0));

}

}

ve.add(new Point(x, y, 0));

}

// - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

// myClass for a 3D point

//

class Point {

float x, y, z;

Point(float x, float y, float z) {

this.x = x;

this.y = y;

this.z = z;

}

void set(float x, float y, float z) {

this.x = x;

this.y = y;

this.z = z;

}

}

So far so good and this is the overall effect I'm looking for, but now I'd like to:

1 - understand why a straight segment joins together some consecutive paths that should be separate

2 - take advantage of functions like bezierPoint, but how do I find out which are the control points?

3 - get the color of the lines/areas as defined in the source file (is it possible?)

- know how to paste formatted code in this forum ;) ... copy as HTML command doesn't seem to work

Hope you like it and of course any feedback and suggestion would be greatly appreciated.

Thanks!