How to use SVG on Processing(p5)

toyotarone

Koji Toyota

Posted on June 1, 2018

How to use SVG on Processing(p5)

First of all, my sample program is here.

Prerequisites

You've installed Processing on your PC/Mac.
Also please get a SVG file to show.

How to

At first, you have to prepare PShape object.
After that, call the loadShape method.

PShape some_kind_of_shape;
some_kind_of_shape = loadShape("Some_Kind_of_Shape.svg");

Enter fullscreen mode Exit fullscreen mode

Actually, I defined PShape variable as static in my sample code for simplicity.

After you've prepared the object properly, just calling shape method in draw method and you can see your svg.

void draw() {
  background(255);
  shape(some_kind_of_shape, position_x, position_y, shape_width, shape_height);
}
Enter fullscreen mode Exit fullscreen mode
💖 💪 🙅 🚩
toyotarone
Koji Toyota

Posted on June 1, 2018

Join Our Newsletter. No Spam, Only the good stuff.

Sign up to receive the latest update from our blog.

Related

How to use SVG on Processing(p5)
processing How to use SVG on Processing(p5)

June 1, 2018