Trying to change position of svg Shape to centre on sketch

Hi, I was wondering if anyone knew how to do this? I’ve changed my screen sketch size to 1968, 1080, however I can’t figure out how to position my shape in the centre of the screen? Sorry if this doesn’t make much sense.

Otherwise is there a way I can make the background transparent?

typeimport ddf.minim.*;
import ddf.minim.analysis.*;
import ddf.minim.effects.*;
import ddf.minim.signals.*;
import ddf.minim.spi.*;
import ddf.minim.ugens.*;

import processing.serial.*;
import geomerative.*;

Minim minim;
AudioPlayer player;
AudioInput input;

RShape grp;
RPoint[][] pointPaths;

float z = 50;

String inString;  // Input string from serial port
String val;      // Data received from the serial port
int lf = 10;
Serial myPort;

int sensitivity=250;

boolean ignoringStyles = false;

void setup() 

   print (Serial.list());
   size(1968, 1080, P3D);

     minim = new Minim(this);
     player = minim.loadFile("WIND ONE.mp3");
     input = minim.getLineIn();;
   // I know that the first port in the serial list on my mac
   // is always my  FTDI adaptor, so I open Serial.list()[0].
   // On Windows machines, this generally opens COM1.
   // Open whatever port is the one you're using.
   String portName = Serial.list()[1];
   myPort = new Serial(this, portName, 9600);
   grp = RG.loadShape("B2.svg");
  grp.centerIn(g, 100, 1, 1);
   pointPaths = grp.getPointsInPaths();

void draw()
 //z = 10 * sin( frameCount/50.0 * PI);
      loadShape("B2.svg").disableStyle();  // Ignore the colors in the SVG
 fill(0);    // Set the SVG fill to blue
 shapeMode (CENTER);


for(int i = 0; i < player.bufferSize() - 1; i++)
     float Random_var=(float(inString)/400)*50;
     for(int i = 0; i<pointPaths.length; i++){

   if (pointPaths[i] != null) {
    for(int j = 0; j<pointPaths[i].length; j++){
       vertex(pointPaths[i][j].x, pointPaths[i][j].y);
 void serialEvent(Serial p) { 
 inString = p.readString(); 
} or paste code here
1 Like

I don’t use PShapes too often, but have you looked at PShape.width and PShape.height?

1 Like

Here is the key part from the PShape tutorial on how to center a PShape on the screen:

and if we wanted the Rectangle to be drawn from its center:

PShape rectangle;

void setup() {
  rectangle = createShape(RECT,-50,-25,100,50);

We can then move it according to the mouse with translate.

void draw() {
1 Like