# How can I generate vertex data from an SVG?

I am trying out the Phaser game engine, and am interested in making a vector graphics game (simple black and white like Asteroids), but I want to use vector graphics instead of raster PNGs.

I was looking at this example, which looks like what I want to do...

Where I am stuck is, say I draw a simple Asteroids style ship in Illustrator, consisting of 3 connected lines. How do I export that data into an array of vertices that would work with the setPolygon() method in Phaser/Box2d?

The first parameter is an element of type SVG, it can be a path, rect, circle, etc. The second parameter is the distance of segments. Returns an array as a javascript object, which is generally used in Phaser or matter js.

function toVertex(pathSVG, n){
let pathLength = pathSVG.getTotalLength();
let vtx = [];
var i = 0;
while(i < pathLength){
let arr =  pathSVG.getPointAtLength(i);
vtx.push({x:arr.x, y:arr.y});
i+=n;
}
return vtx;
}