Re: Arcs for Xr (was: Re: Small Xr example)
Vadim Plessky <[email protected]> Wed, 4 Dec 2002 15:29:57 +0300
| Newsgroups | gmane.comp.xfree86.render |
|---|---|
| Message-ID | <[email protected]> |
--Boundary-00=_GVf79U2rPPgApuz
Content-Type: text/plain;
charset="iso-8859-1"
Content-Transfer-Encoding: 8bit
Content-Disposition: inline
On Tuesday 03 December 2002 8:05 pm, Carl Worth wrote:
[...]
|
| As always, feedback is welcome and encouraged.
|
| -Carl
|
| PS. Oh, and how about a convenience function for rectangles? I think
| XrRectangle should add a rectangle to the path, (convenience function
| for a MoveTo and four LineTo's).
Going from LineTo to Rectangle is not that easy.
You should take care about junction of those lines.
Besides, you should take into consideration dashed lines (with specified dash
pattern) and rectangles (beziers, arcs) with such dashed lines...
I attached couple of simplified examples illustrating this problem
(there are also few nice examples Dom committed to librsvg2 source tree)
Compare rendeirng of those files with different renderers (ImageMagick, KSVG,
librsvg2, Adobe SVG viewer), and you will see that implementing *rectangle*
is quite difficult task.
| I don't see the need now to implement
| functions like PostScript's rectstroke/rectfill, (any such
| optimization functions can be added later if necessary). I'm inclined
| not to add rounded rectangle support.
I am not sure what do you mean under "rounded rectangle support".
Does rectangle with rounded/ (not *round*) corners, like in attached example,
fall into this category? All examples are valid SVG files, so support for
drawing primitives like this is really necessary for SVG compliance.
|
| [*] For any inclined to more reading, here's the results of my review
| of arc support in graphics systems:
|
| From surveying several 2D graphics systems it seems there are two
| major means of specifying arcs:
|
| Center Parameterization
| -----------------------
| Accepts center point, radius, and two angular extents.
| This parameterization has a two-way ambiguity (depending on which
| direction the arc is drawn).
|
| Endpoint Parameterization
| -------------------------
| Accept initial and final arc endpoints.
| This parameterization has a four-way ambiguity.
|
| Here are what several graphics systems provide and how the ambiguities
| are handled:
|
| PDF
| ---
| No arc support.
|
| Core X11 arcs
| --------------
| Center parameterization. Ambiguity resolved by the sign of the angles,
| (I don't know what happens if the sign of the two angles differs).
|
| Java 2D
| -------
| Center parameterization. I couldn't find a reference explaining how
| the ambiguity is resolved, (perhaps arcs are always drawn in the
| positive direction?).
|
| SVG
| ---
| Endpoint parameterization. Ambiguity resolved with two flags,
| (large arc flag and sweep flag).
|
| PostScript
| ----------
| Center parameterization. Ambiguity resolved with two different
| operators, arc and arcn (arc negative).
|
| Note: If current point is defined, also draws line from current point
| to initial arc endpoint.
|
| PostScript also provides another more specialized arc function:
|
| arct (point_1, point_2, radius)
|
| arcto (point_1, point_2, radius)
|
| arct specifies a circular arc that fits within and tangent to a
| polygon formed by the current point, point_1, and point_2. This is
| quite similar to the way that splines are specified. An important
| difference is that the endpoints of the arc are not provided as
| explicit arguments, but are implicit given the tangents and the
| radius. For this reason, the arcto flavor is also provided. It
| constructs the same arc as arct, but it also returns the two endpoints
| of the arc.
|
| arct cannot be used as a general arc function since it will not draw
| arcs with extents greater than 180 degrees, (so it can't be used to
| draw a complete circle). But, this is a very handy operator for doing
| things such as rounded corners on rectangles.
|
| Conclusions
| -----------
| Center parameterization is clearly more popular than endpoint
| parameterization. I also prefer it since I dislike APIs that involve
| lots of boolean flags.
|
| Postscript uses my preferred mechanism for resolving an ambiguity,
| which is to provide distinct operators with distinct behavior rather
| than passing a flag. However, I do prefer more descriptive names.
--
Vadim Plessky
SVG Icons * BlueSphere Icons 0.3.0 released
http://svgicons.sourceforge.net
My KDE page
http://kde2.newmail.ru (English)
KDE mini-Themes
http://kde2.newmail.ru/themes/
--Boundary-00=_GVf79U2rPPgApuz
Content-Type: image/svg+xml;
name="rectangles-lineJoin.svg"
Content-Transfer-Encoding: 7bit
Content-Disposition: attachment; filename="rectangles-lineJoin.svg"
<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN"
"http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd"
[
<!ATTLIST svg
xmlns:xlink CDATA #FIXED "http://www.w3.org/1999/xlink">
]>
<!-- Created with Sodipodi ("http://www.sodipodi.com/") -->
<svg
id="svg1"
sodipodi:version="0.27"
width="256pt"
height="256pt"
sodipodi:docbase="/home/vad/SVG/"
sodipodi:docname="/home/vad/SVG/rectangles-lineJoin.svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:xlink="http://www.w3.org/1999/xlink">
<defs
id="defs3" />
<sodipodi:namedview
id="base" />
<rect
style="font-size:12;fill:#808080;fill-rule:evenodd;stroke:#000000;stroke-width:1.08036;stroke-opacity:0.99;"
id="rect4"
x="24.444233"
y="17.504442"
width="99.549316"
height="75.119304"
rx="0.000000"
ry="0.000000" />
<rect
style="font-size:12;fill:#808080;fill-rule:evenodd;stroke:#000000;stroke-width:8.64285;stroke-opacity:0.99;"
id="rect5"
x="157.686829"
y="17.583702"
width="99.549316"
height="75.119304"
rx="0.000000"
ry="0.000000" />
<rect
style="font-size:12;fill:#808080;fill-rule:evenodd;stroke:#000000;stroke-width:1.08036;stroke-linejoin:round;stroke-opacity:0.99;"
id="rect6"
x="23.434769"
y="119.570026"
width="99.549316"
height="75.119301"
rx="0.000000"
ry="0.000000" />
<rect
style="font-size:12;fill:#808080;fill-rule:evenodd;stroke:#000000;stroke-width:8.64285;stroke-linejoin:round;stroke-opacity:0.99;"
id="rect7"
x="156.677364"
y="119.649303"
width="99.549316"
height="75.119301"
rx="0.000000"
ry="0.000000" />
<rect
style="font-size:12;fill:#808080;fill-rule:evenodd;stroke:#000000;stroke-width:1.08036;stroke-linejoin:bevel;stroke-opacity:0.99;"
id="rect15"
x="23.434769"
y="221.673973"
width="99.549316"
height="75.119301"
rx="0.000000"
ry="0.000000" />
<rect
style="font-size:12;fill:#808080;fill-rule:evenodd;stroke:#000000;stroke-width:8.64285;stroke-linejoin:bevel;stroke-opacity:0.99;"
id="rect16"
x="156.677364"
y="221.753258"
width="99.549316"
height="75.119301"
rx="0.000000"
ry="0.000000" />
</svg>
--Boundary-00=_GVf79U2rPPgApuz
Content-Type: image/svg+xml;
name="rectangle-dashes.svg"
Content-Transfer-Encoding: 7bit
Content-Disposition: attachment; filename="rectangle-dashes.svg"
<?xml version="1.0" encoding="iso-8859-1"?>
<!-- Generator: Adobe Illustrator 9.0, SVG Export Plug-In -->
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20000303 Stylable//EN" "http://www.w3.org/TR/2000/03/WD-SVG-20000303/DTD/svg-20000303-stylable.dtd" [
<!ENTITY st3 "fill-rule:nonzero;clip-rule:nonzero;stroke:#000000;stroke-miterlimit:4;">
<!ENTITY st4 "fill:none;stroke-width:10;">
<!ENTITY st5 "fill:none;stroke:#FB0F0C;stroke-width:6;stroke-dasharray:12;">
]>
<svg width="103.62pt" height="118.511pt" viewBox="0 0 103.62 118.511" xml:space="preserve">
<g id="Layer_x0020_1" style="&st3;">
<g>
<path style="&st4;" d="M96.706,49.537H6.397V5h90.309v44.537z"/>
<path style="&st5;" d="M96.706,49.537H6.397V5h90.309v44.537z"/>
</g>
</g>
</svg>
--Boundary-00=_GVf79U2rPPgApuz
Content-Type: image/svg+xml;
name="rectangle-dashes-3.svg"
Content-Transfer-Encoding: 7bit
Content-Disposition: attachment; filename="rectangle-dashes-3.svg"
<?xml version="1.0" encoding="iso-8859-1"?>
<!-- Generator: hand-crafted SVG by Vadim Plessky <[email protected]> -->
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20000303 Stylable//EN" "http://www.w3.org/TR/2000/03/WD-SVG-20000303/DTD/svg-20000303-stylable.dtd" [
<!ENTITY st1 "fill-rule:nonzero;clip-rule:nonzero;stroke:#000000;stroke-miterlimit:4;">
<!ENTITY st2 "fill:none;stroke:blue;stroke-width:2;stroke-dasharray:1 1;">
<!ENTITY st3 "fill:none;stroke:blue;stroke-width:2;stroke-dasharray:12 6 6 6 3 6;">
<!ENTITY st4 "fill:none;stroke:blue;stroke-width:2;stroke-dasharray:6 12 12 12 3 12;">
<!ENTITY st5 "fill:none;stroke:blue;stroke-width:4;stroke-dasharray:12;">
<!ENTITY st6 "fill:none;stroke:blue;stroke-width:4;stroke-dasharray:12 6 6 6;">
<!ENTITY st7 "fill:none;stroke:blue;stroke-width:2;stroke-dasharray:2 2;">
]>
<svg width="384.0pt" height="256.0pt" xml:space="preserve">
<g id="Layer1" style="&st1;">
<g>
<rect style="&st5;" x="10" y="10" width="120" height="70" />
</g>
</g>
<g id="Layer2" style="&st1;">
<g>
<rect style="&st6;" x="10" y="120" width="120" height="70" />
</g>
</g>
<g id="Layer3" style="&st1;">
<g>
<rect style="&st3;" x="150" y="10" width="120" height="70" />
</g>
</g>
<g id="Layer4" style="&st2;">
<g>
<rect style="&st4;" x="150" y="120" width="120" height="70" />
</g>
</g>
<g id="Layer5" style="&st1;">
<g>
<rect style="&st2;" x="300" y="10" width="120" height="70" />
</g>
</g>
<g id="Layer6" style="&st1;">
<g>
<rect style="&st7;" x="300" y="120" width="120" height="70" />
</g>
</g>
</svg>
--Boundary-00=_GVf79U2rPPgApuz--