Search code examples
javaprocessingp5.js

what is processing equivalent of p5.js textToPoints() functions for fonts?


https://p5js.org/reference/#/p5.Font/textToPoints

This function traces the boundary of the text and gives me an array of points in that boundary.

Do we have an equivalent of this in Processing or the Java API?


Solution

  • It can be done on a per-character basis in Processing.

    Getting the Edge Vertices of a Given Character

    ArrayList<PVector> edgeVertices = new ArrayList<>();
    
    PFont font = createFont("Arial", 96, true);
    
    PShape shape = font.getShape(char c);
    
    for (int i = 0; i < shape.getVertexCount(); i++) {
        edgeVertices.add(shape.getVertex(i));
    }
    

    Drawing an Outline from Edge Vertices

    strokeWeight(2);
    beginShape();
    for (PVector v : edgeVertices) {
        vertex(v.x + 55, v.y + 125);
    }
    endShape(CLOSE);
    

    Result (char = 'H', font = Comfortaa)

    enter image description here