Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Converting text into path (svg) on server?

How can I create text from a TTF font and convert it into a static SVG path? So that anyone could open it in illustrator and see the word (as an .SVG).

Our server is Debain, and we primarily use PHP for backend coding.

Happy to use Imagemagick or Inkscape - whatever gets it done!

like image 295
Walker Avatar asked Dec 07 '11 21:12

Walker


People also ask

How do I put text inside an SVG path?

The <textPath> SVG element is used to render the text along with a certain path. To render text along with a certain path, enclose the text in an <textPath> element that has a href attribute with a reference to the <path> element. Attribute: href: The URL to the path or basic shape on which to render the text.


2 Answers

You can also tell inkscape to open your file in gui mode and then issue commands. The following command line input opens an svg, selects all nodes, and converts them into paths. This will allow you to save your converted svg back to svg.

inkscape -f your.svg --with-gui --verb EditSelectAll --verb ObjectToPath --verb FileSave --verb FileQuit

Beware, this will override your file!

like image 165
blurryroots Avatar answered Oct 07 '22 14:10

blurryroots


Try this:

  1. Create a svg template file in Inkscape (see an example below).
  2. Open that file with a text editor, and place some placeholder tokens for the variables you want to change: The font, and the text.
  3. Create a web page so the user can select the font and write the text.
  4. Retrieve that data in server.
  5. Read the template file, and change the placeholder tokens with the user data.
  6. Call Inkscape through command line.
inkscape template.svg --export-text-to-path --export-id=maintext --export-pdf=new_file.pdf

Now, I know, I know, you said you want an svg output... I tried the option:

--export-plain-svg=new_file.svg

But according to the Inkscape man page:

-T, --export-text-to-path
    Convert text objects to paths on export, where applicable (for PS, EPS, and PDF export).

Soooo... can't get plain svg export and exporting text to path :S ... BTW this should be filled as a bug.

You can serve the PDF, or call again:

inkscape -l new_file.svg new_file.pdf

Which... I know, is quite stupid. No, really, file a bug on Inkscape :P

This is the example Inkscape template:

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->

<svg
   xmlns:dc="http://purl.org/dc/elements/1.1/"
   xmlns:cc="http://creativecommons.org/ns#"
   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
   xmlns:svg="http://www.w3.org/2000/svg"
   xmlns="http://www.w3.org/2000/svg"
   version="1.1"
   width="440.29297"
   height="39.824219"
   id="svg2">
  <defs
     id="defs4" />
  <metadata
     id="metadata7">
    <rdf:RDF>
      <cc:Work
         rdf:about="">
        <dc:format>image/svg+xml</dc:format>
        <dc:type
           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
        <dc:title></dc:title>
      </cc:Work>
    </rdf:RDF>
  </metadata>
  <text
     x="-3.4374955"
     y="30.390625"
     id="maintext"
     xml:space="preserve"
     style="font-size:40px;font-style:normal;font-weight:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:[FONT_PLACEHOLDER]"><tspan
       x="-3.4374955"
       y="30.390625"
       id="tspan3006"
       style="fill:#000000">[TEXT_PLACEHOLDER]</tspan></text>
</svg>

Kind regards.

like image 41
Havok Avatar answered Oct 07 '22 12:10

Havok