When you create SVG files with Inkscape, it sometimes happens that you see black boxes when you view them with other programs. They look fine in Inkscape, but e.g. my file browser Caja shows a black rectangle:

enter image description here

I think I have seen that more often when there are text fields. And I think I have seen this problem quite often on Wikipedia Commons.

up vote 3 down vote accepted

See http://wiki.inkscape.org/wiki/index.php/Frequently_asked_questions for details, but in short:

  • The problem is "flowed text".
  • Fix it by selecting the text box and clicking on Text > Convert to Text

The problem is that if you by mistake make empty flowed text box, then they are kind of difficult to delete in inkscape. by opening the svg with a text editor, you can find text as:

    <flowRoot
   style="font-size:16px;font-style:normal;font-weight:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:Sans"
   id="flowRoot3304"
   xml:space="preserve"
   transform="translate(74.961781,225.93469)"><flowRegion
     id="flowRegion3306"><rect
       y="73.362183"
       x="-594"
       height="226"
       width="415"
       id="rect3308" /></flowRegion><flowPara
     id="flowPara3310" /></flowRoot>

Deleting in the everything between and including <flowRoot and </flowRoot> will remove the black box (and of course also the text that it can contain, in the above example there was no text). backup before trying!

There are several option how to remove flowRoots:

replace notempty flow-text using (Inkscape)

  • Click on the in Inkscape visible Text or click on the -tag in the XML Editor of Inkscape
  • go to Text-menu: Click on Convert to Text (you could also click on Unflow, but this one sometimes replaces the text)
  • repeat for all (nonempty) flow-texts
  • save file (If you save as a Optimized-SVG you will get a flowRoot-warning if you forgot one text)

There is also an automatic script

inkscape filename.svg --verb=EditSelectAll --verb=ObjectFlowtextToText --verb=FileSave --verb=FileClose --verb=FileQuit

That the black square won't get rendered (Text-Editor)

add fill-opacity="0" in the < rect … fill-opacity="0"/> (or in < path d="…" fill-opacity="0">) which is between < flowRegion> and < /flowRegion>

Further methods If it does not work: further methods are explained on Wikimedia

Your Answer

 

By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.

Not the answer you're looking for? Browse other questions tagged or ask your own question.