DEV Community

Elero Obaitan
Elero Obaitan

Posted on

Help With SVG In Python

Hello Dev.to community!
I am new here and hoping for a rewarding experience. I need help with questions I have about a Python project I am embarking on.

The project has me creating an application in Flask to generate lettering stencils - to be used to form the lettering on concrete tombstones - and also to manage records of the departed. The characters used in the stencils are in SVG format and the stencils are currently made manually using a vector-based editing software. The output is an A3-size PDF file which is then printed and laser-cut.

I seek to automate the stencil-generating process but have no experience working with SVG in Python. The ideal situation would be to find a way to get the application to "recognize" and store each SVG stencil character (perhaps by mapping it to regular alphabets, digits and symbols) and generate the appropriate PDF stencil file whenever the details of a departed person are fed in.

I have tried to do a little research on the SVG libraries available in Python and haven't been very encouraged by my findings (I confess I haven't researched them thoroughly).

My questions are:

  1. Does anyone know any Python library or libraries that would be helpful for a project of this nature?
  2. Is there a better way to do what I am trying to do? (This is really important to me).

Help, comments, questions are all welcome.
Thank you.

Discussion (14)

Collapse
keonigarner profile image
Keoni Garner

Hi there! Welcome to Dev.to!

This sounds like a high-value project! Tell me if I’ve got this right.

It sounds like you already have the SVGs you need.

You want to:

  1. (Precondition) Load the SVGs into your application and map them to writeable characters
  2. Accept user-inputted data about the departed
  3. Map the text to the corresponding SVG
  4. Compose an A3 PDF of the resulting SVGs

Does that sound right?

Collapse
elero profile image
Elero Obaitan Author

Exactly sir, exactly!
This is what I am trying to achieve.

Collapse
keonigarner profile image
Keoni Garner

Okay, so now that we’ve broken that down, let’s take a look at what’s required for each step:

  1. We need the data to be in this application before it can function properly so you could create some sort of data loader to populate the DB that you inevitably use or you could manually populate the DB. How many SVGs are there exactly?
  2. This requires either a script for you to run OR some frontend UI for people to input data. That means an API endpoint as well.
  3. This would happen on the backend side after calling your endpoint - pretty simple once we get the first 2 steps done.
  4. This will also happen after calling the endpoint, likely via a library, will take some tweaking to get it right and handle edge cases

We’ll start to dial in the tasks and come up with actionable items for you with each iteration over these steps. Breaking down the problem helps a ton!

Thread Thread
elero profile image
Elero Obaitan Author

Interesting!
Thank you.

It now feels much easier to do.
Steps 1 and 2 should not be a problem.

Step 3 will require working on an "A3 canvas" and considering spacing, centering and some conditional logic.

Step 4 will be fine if I get through Step 3 😀

I will send a message once I can access the svg characters. Thanks again.

Now I have a road map.

Thread Thread
elero profile image
Elero Obaitan Author

So there are 40 svg characters I need to get into the DB.

Do you think storing them as BLOBs in the DB is a good idea?

Please see the attached image to get an idea of the pdf output. (The duplication ensures there is a spare stencil)

Step 3
As you will see in the attached image, the characters are centered and the character spacing is supposed to be consistent. Also, the varying name lengths will create the need for conditional logic to decide when to use initials. I assume much of this will have to be achieved on an "svg canvas"?

Please let me know how you think I should proceed here.
Thanks.

Thread Thread
keonigarner profile image
Keoni Garner

Blob storage sounds like a good path to me 👍

I don’t see an attachment here - maybe I’m missing something

Yeah so you can achieve your desired results with reportlab to generate the PDF

Thread Thread
elero profile image
Elero Obaitan Author

Thanks again.
I will resend the image.

Thread Thread
elero profile image
Elero Obaitan Author

Here

Thread Thread
elero profile image
Elero Obaitan Author

Here

Collapse
elero profile image
Elero Obaitan Author

As expected, some of the characters on the stencils are standard and never change. Only the names, birth dates and dates of departure vary.

Any help will be appreciated.
Thanks.

Collapse
elero profile image
Elero Obaitan Author

I am having trouble sending the image here for some reason. Is it okay if I email it to you?

Thread Thread
keonigarner profile image
Keoni Garner

Sure!

Thread Thread
keonigarner profile image
Keoni Garner

Okay, I see your point. As long as the SVGs are properly sized, this should be a simple task with reportlab.

My thoughts are:

You could start off by manually (through reportlab) adding the SVGs to the PDF until it resembles the image you’ve shared. Then, it should be easy to refactor that logic to take any text and convert it to the proper collection of SVGs. Then, you’d pop that method into your Flask endpoint to generate and return the pdf.

Is there something a little more specific that you’d need guidance on?

Thread Thread
elero profile image
Elero Obaitan Author

I will go with your suggestions for now. If I need any more help I will let you know.

Thanks!