- From: Jeff Schiller <codedread@gmail.com>
- Date: Wed, 20 Aug 2008 07:46:49 -0500
- To: david.vergnaud@finnova.ch, www-svg <www-svg@w3.org>
This thread may help you: http://groups.google.com/group/mozilla.dev.tech.svg/browse_thread/thread/1c36a5f200072fc2/965fcf6f36f7838a Browsers have been focusing on SVGF 1.1. It's too bad browsers don't yet support non-scaling stroke: http://www.w3.org/TR/SVGMobile12/painting.html#NonScalingStroke (a SVGT 1.2 feature) Regards, Jeff On Wed, Aug 20, 2008 at 3:47 AM, <david.vergnaud@finnova.ch> wrote: > > Hi everyone, > > I'm having a hard time trying to automatically generate SVG objects that look the way I want. I'm translating them from another vector format, so I'm not all free about the values (e.g. the viewbox attributes, as well as width and height, are set and can't be changed). > One thing I still have control over is the stroke-width, and that seems to be the one that doesn't work - and I can't really make any sense of the specification and what I'm seeing now. Here's a short example: > > <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="453.55pt" height="310.75pt" viewBox="1134 1418 15695 10754"> > <g id="_x0000_s1053"> > > <g id="_x0000_s1059"> > <svg x="5682" y="5038" width="636" height="484" viewBox="0 0 21600 21600" preserveAspectRatio="none" fill="white" stroke="cyan" stroke-width="4.132231404958677%" opacity="1" overflow="visible"> > <path d="M 10800,0 L 0,10800 10800,21600 21600,10800 z "/> > </svg> > </g> > <g transform=" translate(12012 0) matrix(-1 0 0 1 0 0) rotate(90 6006 5921)" id="_x0000_s1073"> > <svg x="5606" y="5917" width="800" height="9" viewBox="0 0 21600 21600" preserveAspectRatio="none" fill="none" stroke="purple" stroke-width="10000px" opacity="1" overflow="visible"> > <path d="M 0,0 L 0,0 0,21600 21600,21600 M 0,0 "/> > </svg> > </g> > <g id="_x0000_s1104"> > <svg x="5224" y="6321" width="1569" height="485" viewBox="0 0 21600 21600" preserveAspectRatio="none" fill="white" stroke="red" stroke-width="4.123711340206185%" opacity="1" overflow="visible"> > <path d="M 0,0 L 0,21600 l 21600,0 L 21600,0 z "/> > </svg> > </g> > <g id="line1"> > <line x1="0" x2="21600" y1="5038" y2="5038" stroke="green" stroke-width="10px"></line> > </g> > <g id="line3"> > <line x1="0" x2="21600" y1="5522" y2="5522" stroke="blue" stroke-width="10px"></line> > </g> > > <g id="line2"> > <line x1="0" x2="21600" y1="6321" y2="6321" stroke="orange" stroke-width="10px"></line> > </g> > > <g id="line4"> > <line x1="0" x2="21600" y1="5917" y2="5917" stroke="pink" stroke-width="10px"></line> > </g> > > </g> > </svg> > > There probably are a few "inelegances" in this code, but as I said most of it's automatically generated (I added the horizontal lines myself). What I'm really not coping with is, as I said, the stroke-width attributes. Maybe someone could explain to me why: > - the stroke-width of the purple line should be set to 10000px to be visible? > - setting the stroke-width of this same purple line to 100% also makes it visible, BUT > - the purple line exceeds its expected height (width before rotation) of 800 (depicted by the blue and orange horizontal lines)? > > My other concern is about the other objects' stroke-width attributes: although it looks alright on the cyan diamond, it looks a bit irregular on the red rectangle, where the vertical sides are "bolder" than the horizontal ones. I take it it's because the viewBox is "square" whilst the actual object isn't, but how can I solve that? > > I guess all this can be summed up in one big question (although of course I'd like to understand how it works): how can I set my stroke-width attributes so that all lines/sides have a width of 1 (one) "screen-pixel"? I tried px, pt, mm, no unit (which I think is the same as px), ... to no avail. It'd be real great if someone could take some time to explain this! > > Thanks in advance! > > David > > >
Received on Wednesday, 20 August 2008 12:47:30 UTC