Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

create text inside a rectangle using inkscape

Tags:

svg

inkscape

I've put some text inside a rectangle using inkscape so the tree is like

<svg:rect><svg:text><svg:tspan>text.... 

The problem is, I can't see the text. I've tried fiddling with the opacity of the rect to no avail. There should be a way of doing this from the UI?

Edit

example as requested

<?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"
   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
   width="184.25197"
   height="262.20471"
   id="svg2"
   sodipodi:version="0.32"
   inkscape:version="0.46"
   version="1.0"
   sodipodi:docname="ex1.svg"
   inkscape:output_extension="org.inkscape.output.svg.inkscape">
  <defs
     id="defs4">
    <inkscape:perspective
       sodipodi:type="inkscape:persp3d"
       inkscape:vp_x="0 : 526.18109 : 1"
       inkscape:vp_y="0 : 1000 : 0"
       inkscape:vp_z="744.09448 : 526.18109 : 1"
       inkscape:persp3d-origin="372.04724 : 350.78739 : 1"
       id="perspective10" />
  </defs>
  <sodipodi:namedview
     id="base"
     pagecolor="#ffffff"
     bordercolor="#666666"
     borderopacity="1.0"
     gridtolerance="10000"
     guidetolerance="10"
     objecttolerance="10"
     inkscape:pageopacity="0.0"
     inkscape:pageshadow="2"
     inkscape:zoom="0.64"
     inkscape:cx="195.9221"
     inkscape:cy="335.3072"
     inkscape:document-units="px"
     inkscape:current-layer="layer1"
     showgrid="false"
     inkscape:window-width="640"
     inkscape:window-height="675"
     inkscape:window-x="44"
     inkscape:window-y="44" />
  <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" />
      </cc:Work>
    </rdf:RDF>
  </metadata>
  <g
     inkscape:label="Layer 1"
     inkscape:groupmode="layer"
     id="layer1">
    <rect
       style="opacity:0.25480766;fill:#ff0000;fill-opacity:1;stroke:#000000;stroke-width:12.94795799;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
       id="rect2383"
       width="150.87796"
       height="84.226181"
       x="18.221733"
       y="39.557121">
      <text
         xml:space="preserve"
         style="font-size:56.0331955px;font-style:normal;font-weight:normal;fill:#000000;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;font-family:Bitstream Vera Sans"
         x="44.815186"
         y="114.0088"
         id="text2385"
         transform="scale(1.0054479,0.9945816)"><tspan
           sodipodi:role="line"
           id="tspan2387"
           x="44.815186"
           y="114.0088">text</tspan></text>
    </rect>
  </g>
</svg>

I'd expect to be able to see this in inkscape.

The workaround is to put text on a layer above the box (the intent is that the box obscures the layers below it) and not try and get clever with nested tags. Shame it doesn't work though.

like image 711
mr calendar Avatar asked May 27 '10 13:05

mr calendar


People also ask

How do I put text into a shape in Inkscape?

To use it: Write the text on the canvas (or copy-paste it). Create the path or shape that the text is supposed to fill. With the Selector tool, select the shape and the text, then use Text ‣ Flow into Frame.

How do I center text in a rectangle in Inkscape?

Make sure to have the "Relative to" setting set on "Biggest object", and not the default "Page" setting. Then click on the third icon of both rows of the alignment settings, to center the text both vertically and horizontally inside the rectangle.

Can you write in Inkscape?

Creating a text object is as simple as switching to the Text tool ( F8 ), clicking somewhere in the document, and typing your text. To change font family, style, size, and alignment, open the Text and Font dialog ( Shift + Ctrl + T ).


1 Answers

A rect element can't contain text elements, that's invalid according to the svg specification and will simply be ignored by compliant user agents.

Just put the text after the rect element to have them render on top.

like image 54
Erik Dahlström Avatar answered Oct 09 '22 09:10

Erik Dahlström