Flex Chart Component: Dashed Lines
May 30th, 2006
[page]:http://www.quietlyscheming.com/blog/charts/dashed-lines/
I get requests for dashed and dotted lines in the flex charts probably about once a week. Writing a dashed line routine is a little tricker than it sounds at first, if you want to make sure the dashes render correctly at arbitrary angles and across multiple segments of a poly-line. So here, for your use and education, is a Utility routine for rendering dashed lines in flash, and a simple LineSeries renderer that makes use of it.
[Dashed Line example and source][page]
May 30th, 2006 at 11:12 pm
I actually think the whole topic of drawing programatically is rather poorly documented in the otherwise excellent Flex documentation set. This is a shame since this is a big competitive advantage for Flex.
More posts like this please from experts at using the Flash class library for drawing and typography!!
May 31st, 2006 at 11:42 am
Great example. But can you add a bit of comments to your code? It’s a bit hard to figure out all the internal chart classes and why you override some stuff, so some well placed comments would help a lot.
May 31st, 2006 at 6:22 pm
It was great meeting you last night. I didn’t catch your email so this is my ghetto way of reaching out. :P
Jameson
June 10th, 2006 at 5:02 am
In your source for DashedSandbox.mxml you use:
wow! that is nasty. :-)
Any other way to reference the “pattern” variable without having to use “outerDocument”?
Thanks,
ThomasB
June 10th, 2006 at 5:04 am
Sorry the html code sample was stripped in my previous comment. Here is the original code sample to which I was referring:
qsc:DashedLineRenderer pattern=”{outerDocument.pattern}”
July 23rd, 2006 at 9:57 am
Sounds like adding native linetype support to the Flash engine would be a reasonable request… ;-)
Even just solid, dashed, dotted…
Thank again for your help with tips when we were developing our custom charts. Worked out well.
February 8th, 2007 at 6:10 am
I might be confused but I am not seeing a class for DashedLineRenderer in the source code?
April 13th, 2007 at 4:38 am
hi, great code, in use on my real time UK gas and electricity forward price system which uses FDS and Coldfusion plus a bunch of server side calculation stuff
But…. I am stuck on how to get dashed lines as the surround to an area series. Where do I start on this? Have you done it? (gotta ask ;-) its always the “easiest” solution after Google ! )
Thanks anyway for an excellent site and contact me if you want a login to see my meagre efforts
Mike
September 24th, 2007 at 5:40 pm
I can’t seem to draw a hairline 1px dotted line, I set the stroke weight properly (tried it down to 0), and the stroke still displays at least 2px high. Any idea?
Thanks!
September 24th, 2007 at 6:49 pm
There is obviously some bugs with strokes in Flex. Probably rounding or anti-aliasing issue, one pixel stroke is rendered incorrectly. pixelHinting doesn’t really help. The only solution I found is to draw a 1×1 rectangle instead.
Thanks!
December 28th, 2007 at 12:13 pm
I’ve re-written the drawPolyLine code in GraphicsUtilities.as in order to allow dashed lines the same way as the example using a pattern array.. Everything works great – Except, the nasty bezier curves. I understand the code fine and can re-produce the same curves in my own code, but the problem is the code for the curveTo function from Graphics isn’t available (playerGlobal.swc) – Making the bezier curves follow the dash pattern will require a change in the curveTo function, which I can’t do if the code is missing (okay, it’s possible to do without changing the curveTo code, but the math would get real ugly and I’d rather not)
I guess my only option is to re-write my own curveTo function, but it won’t have the same effect unless I can read the code to see what it’s doing.. Is there any way to get a copy of that function’s code? I have a license to the charting source, but I’m sure noone has access to the playerGlobal.swc code except adobe.