# Imported SVG is PShape GROUP, cannot convert to ArrayList of PVector

**URL:** <https://discourse.processing.org/t/imported-svg-is-pshape-group-cannot-convert-to-arraylist-of-pvector/22642>\
**Category:** Coding Questions\
**Created:** [July 15, 2020, 6:23pm UTC](https://discourse.processing.org/t/imported-svg-is-pshape-group-cannot-convert-to-arraylist-of-pvector/22642 "2020-07-15T18:23:38Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![loremipsum](https://avatars.discourse-cdn.com/v4/letter/l/f19dbf/32.png) [@loremipsum](https://discourse.processing.org/u/loremipsum)\
**Post date:** [July 15, 2020, 6:23pm UTC](https://discourse.processing.org/t/imported-svg-is-pshape-group-cannot-convert-to-arraylist-of-pvector/22642/1 "2020-07-15T18:23:38Z")

</div>

I’ve been trying to read in a .svg i made in Illustrator. It imports/displays properly as a PShape, but I’m hoping to convert the shape into an ArrayList of PVectors so I can manipulate the shape.

Here’s what I’ve done:  
• loadShape and store in PShape  
• .getFamily() on the shape and got “0” (which means it’s a PShape group?)

Problem:  
• When I try to loop through the vertices on this imported shape I get this error message: “getVertexCount() only works with PATH or GEOMETRY shapes”  
• When I try .getVertex() on the loaded PShape, I get: “NullPointerException  
Could not run the sketch (Target VM failed to initialize).” - assuming this is similar in that the PShape commands don’t work on a group  
_See code below._

The .svg is just a path in illustrator (see image below) too.

 ![Screen Shot 2020-07-15 at 11.17.32 AM](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/a/a5d3e1acb11ead8a5fa3c2810fd6139af7012be9.png)

Some ideas?  
• I’m wondering if I can either export the .svg in a way that would result in it being a PATH or GEOMETRY shape instead of a GROUP.  
• Alternatively, is there something wrong with the .svg I loaded? If so, how should I export it?  
• Are there any other ways I can import shapes drawn elsewhere?

Thank you!

```auto
PShape wa; 
ArrayList<PVector> newshape;

void setup() {
  size(600, 600);
  wa = loadShape("test.svg");
  println(wa.getFamily());
}

void draw() {
  background(255);

  //go thru the pshape and make it into array list of pvectors
  newshape = new ArrayList<PVector>();
  
  for (int i = 0; i<wa.getVertexCount(); i++) {
    PVector v = wa.getVertex(i);
    newshape.add(v);
  }
  
  stroke(180);
  noFill();
  beginShape();
  for (PVector v: newshape) {
    vertex(v.x,v.y);
  }
  endShape(CLOSE);
}

```

---

<div class="post-metadata">

**Author:** ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)\
**Post date:** [July 15, 2020, 7:45pm UTC](https://discourse.processing.org/t/imported-svg-is-pshape-group-cannot-convert-to-arraylist-of-pvector/22642/2 "2020-07-15T19:45:22Z")

</div>

when it’s a group check out [https://www.processing.org/reference/PShape\_getChildCount\_.html](https://www.processing.org/reference/PShape_getChildCount_.html)

and [https://www.processing.org/reference/PShape\_getChild\_.html](https://www.processing.org/reference/PShape_getChild_.html)

which is again a PShape

Chrisir

---

<div class="post-metadata">

**Author:** ![noel](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/noel/32/213_2.png) [@noel](https://discourse.processing.org/u/noel)\
**Post date:** [July 17, 2020, 2:06pm UTC](https://discourse.processing.org/t/imported-svg-is-pshape-group-cannot-convert-to-arraylist-of-pvector/22642/3 "2020-07-17T14:06:38Z")

</div>

> [@loremipsum](#):
>
> Are there any other ways I can import shapes drawn elsewhere?

In my quest to derive parametric functions of shapes I wrote some codes. Maybe [this one](https://discourse.processing.org/t/heaviside-step-function-deriving-parametric-functions-of-shapes/21931/20) will be of interest to you. You just draw a dark colored shape on a bright background and load this bitmap into the program. Then you can edit the beziers anchor and control points. Right clicking the anchor points will remove them. Afther that you can print the code to the console. I took your image to Gimp and filled the shape with a black color. This was the printed code:

```auto
shp1 = createShape(PShape.PATH);
shp1.beginShape();
shp1.vertex(273.0, 31.0);
shp1.bezierVertex(301.0, 39.0, 276.0, 66.0, 305.0, 80.0);
shp1.bezierVertex(338.16666, 88.166664, 451.0, 71.0, 472.0, 80.0);
shp1.bezierVertex(459.0, 100.0, 307.0, 93.0, 305.0, 115.0);
shp1.bezierVertex(306.0, 132.0, 327.16666, 156.83333, 341.0, 157.0);
shp1.bezierVertex(354.83334, 157.16667, 372.0, 126.0, 388.0, 116.0);
shp1.bezierVertex(414.0, 120.0, 403.0, 141.0, 399.0, 154.0);
shp1.bezierVertex(390.16666, 165.0, 350.33334, 173.83333, 349.0, 189.0);
shp1.bezierVertex(370.0, 231.0, 392.0, 230.0, 394.0, 259.0);
shp1.bezierVertex(376.0, 306.0, 318.0, 323.0, 320.0, 340.0);
shp1.bezierVertex(350.0, 439.0, 404.0, 441.0, 394.0, 455.0);
shp1.bezierVertex(329.0, 448.0, 283.0, 382.0, 288.0, 343.0);
shp1.bezierVertex(291.0, 302.0, 346.0, 285.0, 351.0, 261.0);
shp1.bezierVertex(359.83334, 246.0, 336.0, 230.66667, 329.0, 220.0);
shp1.bezierVertex(272.83334, 186.33333, 279.0, 207.0, 259.0, 215.0);
shp1.bezierVertex(261.0, 226.0, 299.0, 232.0, 301.0, 253.0);
shp1.bezierVertex(279.0, 258.0, 255.0, 239.0, 224.0, 242.0);
shp1.bezierVertex(192.0, 260.0, 185.33333, 282.0, 186.0, 305.0);
shp1.bezierVertex(186.66667, 328.0, 214.0, 347.0, 201.0, 402.0);
shp1.bezierVertex(194.0, 417.0, 179.66667, 430.0, 170.0, 414.0);
shp1.bezierVertex(165.0, 363.0, 145.0, 328.0, 139.0, 296.0);
shp1.bezierVertex(152.5, 245.83333, 173.0, 248.0, 182.0, 221.0);
shp1.bezierVertex(166.0, 195.0, 158.0, 175.0, 163.0, 146.0);
shp1.bezierVertex(191.0, 99.0, 246.0, 104.666664, 258.0, 91.0);
shp1.bezierVertex(257.0, 68.0, 256.0, 34.0, 272.0, 31.0);
shp1.endShape();

```

 ![beest](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/8/8765c0ef0c9e796e542fa33acc6adb5872475905.png) ![beest2](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/7/72f7981d9ba5249765384636d6fef180b3715cf0.png)