| <?xml version="1.0" standalone="no"?> |
| <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.2//EN" |
| "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd"> |
| |
| <!-- |
| |
| Licensed to the Apache Software Foundation (ASF) under one or more |
| contributor license agreements. See the NOTICE file distributed with |
| this work for additional information regarding copyright ownership. |
| The ASF licenses this file to You under the Apache License, Version 2.0 |
| (the "License"); you may not use this file except in compliance with |
| the License. You may obtain a copy of the License at |
| |
| http://www.apache.org/licenses/LICENSE-2.0 |
| |
| Unless required by applicable law or agreed to in writing, software |
| distributed under the License is distributed on an "AS IS" BASIS, |
| WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. |
| See the License for the specific language governing permissions and |
| limitations under the License. |
| |
| --> |
| |
| <!-- ====================================================================== --> |
| <!-- Tests various text on a path --> |
| <!-- --> |
| <!-- @author bella.robinson@cmis.csiro.au --> |
| <!-- @version $Id$ --> |
| <!-- ====================================================================== --> |
| |
| <?xml-stylesheet type="text/css" href="../../resources/style/test.css" ?> |
| |
| <svg id="body" width="450" height="500" viewBox="0 0 450 500" |
| xmlns="http://www.w3.org/2000/svg" version="1.2" |
| xmlns:xlink="http://www.w3.org/1999/xlink"> |
| <title>Test of Text wrapping stuff.</title> |
| |
| <g id="content" line-height="15px"> |
| |
| <text class="title" x="50%" y="40">'flowRoot' Region flowing</text> |
| |
| <g fill="lightblue" transform="translate(0,60)"> |
| <text x="60" y="5" text-anchor="middle" fill="black">Region break flow</text> |
| |
| <rect x="10" y="10" width="100" height="15"/> |
| <rect x="10" y="30" width="100" height="15"/> |
| <rect x="10" y="50" width="100" height="15"/> |
| <rect x="10" y="70" width="100" height="15"/> |
| |
| <flowRoot font-size="20" fill="black"> |
| <flowRegion> |
| <rect x="10" y="10" width="100" height="15" visibility="hidden"/> |
| <rect x="10" y="30" width="100" height="15" visibility="hidden"/> |
| <rect x="10" y="50" width="100" height="15" visibility="hidden"/> |
| <rect x="10" y="70" width="100" height="15" visibility="hidden"/> |
| </flowRegion> |
| |
| <flowDiv font-size="12"> |
| <flowRegionBreak>A region break 1</flowRegionBreak> |
| <flowRegionBreak>A region break 2</flowRegionBreak> |
| <flowRegionBreak>A region break 3</flowRegionBreak> |
| <flowRegionBreak>A region break 4</flowRegionBreak> |
| </flowDiv> |
| </flowRoot> |
| </g> |
| |
| <g fill="lightblue" transform="translate(0,160)"> |
| <text x="60" y="5" text-anchor="middle" fill="black">Paragraph flowing</text> |
| |
| <rect x="10" y="10" width="100" height="15"/> |
| <rect x="10" y="30" width="100" height="15"/> |
| <rect x="10" y="50" width="100" height="15"/> |
| <rect x="10" y="70" width="100" height="15"/> |
| |
| <flowRoot font-size="20" fill="black"> |
| <flowRegion> |
| <rect x="10" y="10" width="100" height="15" visibility="hidden"/> |
| <rect x="10" y="30" width="100" height="15" visibility="hidden"/> |
| <rect x="10" y="50" width="100" height="15" visibility="hidden"/> |
| <rect x="10" y="70" width="100" height="15" visibility="hidden"/> |
| </flowRegion> |
| |
| <flowDiv font-size="12"> |
| <flowPara>The para 1,</flowPara> |
| <flowPara>The para 2,</flowPara> |
| <flowPara>The para 3,</flowPara> |
| <flowPara>The para 4.</flowPara> |
| </flowDiv> |
| </flowRoot> |
| </g> |
| |
| <g fill="lightblue" transform="translate(0,260)"> |
| <text x="60" y="5" text-anchor="middle" fill="black">Text flowing</text> |
| <rect x="10" y="10" width="100" height="15"/> |
| <rect x="10" y="30" width="100" height="15"/> |
| <rect x="10" y="50" width="100" height="15"/> |
| <rect x="10" y="70" width="100" height="15"/> |
| |
| <flowRoot font-size="20" fill="black"> |
| <flowRegion> |
| <rect x="10" y="10" width="100" height="15" visibility="hidden"/> |
| <rect x="10" y="30" width="100" height="15" visibility="hidden"/> |
| <rect x="10" y="50" width="100" height="15" visibility="hidden"/> |
| <rect x="10" y="70" width="100" height="15" visibility="hidden"/> |
| </flowRegion> |
| |
| <flowDiv font-size="12"> |
| <flowPara>The text 1, The text 2, the text 3, The text 4.</flowPara> |
| </flowDiv> |
| </flowRoot> |
| </g> |
| |
| |
| <g fill="lightblue" transform="translate(0,360)"> |
| <text x="60" y="5" text-anchor="middle" fill="black">Text/line flowing</text> |
| <rect x="10" y="10" width="100" height="15"/> |
| <rect x="10" y="30" width="100" height="15"/> |
| <rect x="10" y="50" width="100" height="15"/> |
| <rect x="10" y="70" width="100" height="15"/> |
| |
| <flowRoot font-size="20" fill="black"> |
| <flowRegion> |
| <rect x="10" y="10" width="100" height="15" visibility="hidden"/> |
| <rect x="10" y="30" width="100" height="15" visibility="hidden"/> |
| <rect x="10" y="50" width="100" height="15" visibility="hidden"/> |
| <rect x="10" y="70" width="100" height="15" visibility="hidden"/> |
| </flowRegion> |
| |
| <flowDiv font-size="12"> |
| <flowPara>The text 1,<flowLine/> <flowLine/> |
| The text 2,<flowLine/> <flowLine/> |
| The text 3,<flowLine/> <flowLine/> |
| The text 4.<flowLine/> <flowLine/> |
| </flowPara> |
| </flowDiv> |
| </flowRoot> |
| </g> |
| |
| <g fill="lightblue" transform="translate(110,60)"> |
| <text x="60" y="5" text-anchor="middle" fill="black">Line flowing</text> |
| <rect x="10" y="10" width="100" height="15"/> |
| <rect x="10" y="30" width="100" height="15"/> |
| <rect x="10" y="50" width="100" height="15"/> |
| <rect x="10" y="70" width="100" height="15"/> |
| |
| <flowRoot font-size="20" fill="black"> |
| <flowRegion> |
| <rect x="10" y="10" width="100" height="15" visibility="hidden"/> |
| <rect x="10" y="30" width="100" height="15" visibility="hidden"/> |
| <rect x="10" y="50" width="100" height="15" visibility="hidden"/> |
| <rect x="10" y="70" width="100" height="15" visibility="hidden"/> |
| </flowRegion> |
| |
| <flowDiv font-size="12"> |
| <flowPara><flowLine>The line 1,</flowLine> |
| <flowLine>The line 2,</flowLine> |
| <flowLine>The line 3,</flowLine> |
| <flowLine>The line 4.</flowLine></flowPara> |
| </flowDiv> |
| </flowRoot> |
| </g> |
| |
| <g fill="lightblue" transform="translate(110,160)"> |
| <text x="60" y="5" text-anchor="middle" fill="black">2xLine flowing</text> |
| <rect x="10" y="10" width="100" height="15"/> |
| <rect x="10" y="30" width="100" height="15"/> |
| <rect x="10" y="50" width="100" height="15"/> |
| <rect x="10" y="70" width="100" height="15"/> |
| |
| <flowRoot font-size="20" fill="black"> |
| <flowRegion> |
| <rect x="10" y="10" width="100" height="15" visibility="hidden"/> |
| <rect x="10" y="30" width="100" height="15" visibility="hidden"/> |
| <rect x="10" y="50" width="100" height="15" visibility="hidden"/> |
| <rect x="10" y="70" width="100" height="15" visibility="hidden"/> |
| </flowRegion> |
| |
| <flowDiv font-size="12"> |
| <flowPara><flowLine><flowLine>The line 1,</flowLine> </flowLine> |
| <flowLine><flowLine>The line 2,</flowLine> </flowLine> |
| <flowLine><flowLine>The line 3,</flowLine> </flowLine> |
| <flowLine><flowLine>The line 4.</flowLine> </flowLine></flowPara> |
| </flowDiv> |
| </flowRoot> |
| </g> |
| |
| <g fill="lightblue" transform="translate(110,260)"> |
| <text x="60" y="5" text-anchor="middle" fill="black">Span flowing</text> |
| |
| <rect x="10" y="10" width="100" height="15"/> |
| <rect x="10" y="30" width="100" height="15"/> |
| <rect x="10" y="50" width="100" height="15"/> |
| <rect x="10" y="70" width="100" height="15"/> |
| |
| <flowRoot font-size="20" fill="black"> |
| <flowRegion> |
| <rect x="10" y="10" width="100" height="15" visibility="hidden"/> |
| <rect x="10" y="30" width="100" height="15" visibility="hidden"/> |
| <rect x="10" y="50" width="100" height="15" visibility="hidden"/> |
| <rect x="10" y="70" width="100" height="15" visibility="hidden"/> |
| </flowRegion> |
| |
| <flowDiv font-size="12"> |
| <flowPara><flowSpan>The span 1,</flowSpan> |
| <flowSpan>The span 2,</flowSpan> |
| <flowSpan>The span 3,</flowSpan> |
| <flowSpan>The span 4.</flowSpan></flowPara> |
| </flowDiv> |
| </flowRoot> |
| </g> |
| |
| <g fill="lightblue" transform="translate(110,360)"> |
| <text x="60" y="5" text-anchor="middle" fill="black">Span/line flowing</text> |
| <rect x="10" y="10" width="100" height="15"/> |
| <rect x="10" y="30" width="100" height="15"/> |
| <rect x="10" y="50" width="100" height="15"/> |
| <rect x="10" y="70" width="100" height="15"/> |
| |
| <flowRoot font-size="20" fill="black"> |
| <flowRegion> |
| <rect x="10" y="10" width="100" height="15" visibility="hidden"/> |
| <rect x="10" y="30" width="100" height="15" visibility="hidden"/> |
| <rect x="10" y="50" width="100" height="15" visibility="hidden"/> |
| <rect x="10" y="70" width="100" height="15" visibility="hidden"/> |
| </flowRegion> |
| |
| <flowDiv font-size="12"> |
| <flowPara><flowSpan>The span 1,</flowSpan><flowLine/><flowLine/> |
| <flowSpan>The span 2,</flowSpan><flowLine/><flowLine/> |
| <flowSpan>The span 3,</flowSpan><flowLine/><flowLine/> |
| <flowSpan>The span 4.</flowSpan><flowLine/><flowLine/></flowPara> |
| </flowDiv> |
| </flowRoot> |
| </g> |
| |
| |
| <g fill="lightblue" transform="translate(220,60)"> |
| <text x="60" y="5" text-anchor="middle" fill="black">Region breaks</text> |
| <rect x="10" y="10" width="100" height="30"/> |
| <rect x="10" y="45" width="100" height="30"/> |
| |
| <flowRoot font-size="20" fill="black"> |
| <flowRegion> |
| <rect x="10" y="10" width="100" height="30" visibility="hidden"/> |
| <rect x="10" y="45" width="100" height="30" visibility="hidden"/> |
| </flowRegion> |
| |
| <flowDiv font-size="12"> |
| <flowRegionBreak>A region break 1</flowRegionBreak> |
| <flowRegionBreak>A region break 2</flowRegionBreak> |
| <flowRegionBreak>A region break 3</flowRegionBreak> |
| <flowRegionBreak>A region break 4</flowRegionBreak> |
| </flowDiv> |
| </flowRoot> |
| </g> |
| |
| <g fill="lightblue" transform="translate(220,160)"> |
| <text x="60" y="5" text-anchor="middle" fill="black">Para elems</text> |
| <rect x="10" y="10" width="100" height="30"/> |
| <rect x="10" y="45" width="100" height="30"/> |
| |
| <flowRoot font-size="20" fill="black"> |
| <flowRegion> |
| <rect x="10" y="10" width="100" height="30" visibility="hidden"/> |
| <rect x="10" y="45" width="100" height="30" visibility="hidden"/> |
| </flowRegion> |
| |
| <flowDiv font-size="12"> |
| <flowPara>The para 1,</flowPara> |
| <flowPara>The para 2,</flowPara> |
| <flowPara>The para 3,</flowPara> |
| <flowPara>The para 4.</flowPara> |
| </flowDiv> |
| </flowRoot> |
| </g> |
| |
| <g fill="lightblue" transform="translate(220,260)"> |
| <text x="60" y="5" text-anchor="middle" fill="black">Just text</text> |
| <rect x="10" y="10" width="100" height="30"/> |
| <rect x="10" y="45" width="100" height="30"/> |
| |
| <flowRoot font-size="20" fill="black"> |
| <flowRegion> |
| <rect x="10" y="10" width="100" height="30" visibility="hidden"/> |
| <rect x="10" y="45" width="100" height="30" visibility="hidden"/> |
| </flowRegion> |
| |
| <flowDiv font-size="12"> |
| <flowPara>The text 1, The text 2, The text 3, The text 4.</flowPara> |
| </flowDiv> |
| </flowRoot> |
| </g> |
| |
| <g fill="lightblue" transform="translate(220,360)"> |
| <text x="60" y="5" text-anchor="middle" fill="black">Text/line elems</text> |
| <rect x="10" y="10" width="100" height="30"/> |
| <rect x="10" y="45" width="100" height="30"/> |
| |
| <flowRoot font-size="20" fill="black"> |
| <flowRegion> |
| <rect x="10" y="10" width="100" height="30" visibility="hidden"/> |
| <rect x="10" y="45" width="100" height="30" visibility="hidden"/> |
| </flowRegion> |
| |
| <flowDiv font-size="12"> |
| <flowPara>The text 1,<flowLine/><flowLine/> |
| The text 2,<flowLine/><flowLine/> |
| The text 3,<flowLine/><flowLine/> |
| The text 4.<flowLine/><flowLine/></flowPara> |
| </flowDiv> |
| </flowRoot> |
| </g> |
| |
| <g fill="lightblue" transform="translate(330,60)"> |
| <text x="60" y="5" text-anchor="middle" fill="black">Line elems</text> |
| <rect x="10" y="10" width="100" height="30"/> |
| <rect x="10" y="45" width="100" height="30"/> |
| |
| <flowRoot font-size="20" fill="black"> |
| <flowRegion> |
| <rect x="10" y="10" width="100" height="30" visibility="hidden"/> |
| <rect x="10" y="45" width="100" height="30" visibility="hidden"/> |
| </flowRegion> |
| |
| <flowDiv font-size="12"> |
| <flowPara><flowLine>The line 1,</flowLine> |
| <flowLine>The line 2,</flowLine> |
| <flowLine>The line 3,</flowLine> |
| <flowLine>The line 4.</flowLine></flowPara> |
| </flowDiv> |
| </flowRoot> |
| </g> |
| |
| <g fill="lightblue" transform="translate(330,260)"> |
| <text x="60" y="5" text-anchor="middle" fill="black">Span elems</text> |
| <rect x="10" y="10" width="100" height="30"/> |
| <rect x="10" y="45" width="100" height="30"/> |
| |
| <flowRoot font-size="20" fill="black"> |
| <flowRegion> |
| <rect x="10" y="10" width="100" height="30" visibility="hidden"/> |
| <rect x="10" y="45" width="100" height="30" visibility="hidden"/> |
| </flowRegion> |
| |
| <flowDiv font-size="12"> |
| <flowPara><flowSpan>The span 1,</flowSpan> |
| <flowSpan>The span 2,</flowSpan> |
| <flowSpan>The span 3,</flowSpan> |
| <flowSpan>The span 4.</flowSpan></flowPara> |
| </flowDiv> |
| </flowRoot> |
| </g> |
| |
| <g fill="lightblue" transform="translate(330,360)"> |
| <text x="60" y="5" text-anchor="middle" fill="black">Span/line elems</text> |
| <rect x="10" y="10" width="100" height="30"/> |
| <rect x="10" y="45" width="100" height="30"/> |
| |
| <flowRoot font-size="20" fill="black"> |
| <flowRegion> |
| <rect x="10" y="10" width="100" height="30" visibility="hidden"/> |
| <rect x="10" y="45" width="100" height="30" visibility="hidden"/> |
| </flowRegion> |
| |
| <flowDiv font-size="12"> |
| <flowPara><flowSpan>The span 1,</flowSpan><flowLine/><flowLine/> |
| <flowSpan>The span 2,</flowSpan><flowLine/><flowLine/> |
| <flowSpan>The span 3,</flowSpan><flowLine/><flowLine/> |
| <flowSpan>The span 4.</flowSpan><flowLine/><flowLine/></flowPara> |
| </flowDiv> |
| </flowRoot> |
| </g> |
| |
| |
| </g> |
| </svg> |