# [Openstreetmap-dev] drawing algorihtms

SteveC steve at fractalus.com
Mon May 23 16:39:23 BST 2005

```and this time I'll actually attach the png

* @ 23/05/05 04:38:23 PM steve at fractalus.com wrote:
> so something like
>
> looking at the attached png:
>
> 6 lines represented by letters
>
> b and e are street segments connected by the node represented by the
> circle, of radius r. distance between adjacent lines is r also., hence
> they are parallel and glance the circle.
>
> the b - e intersection Ill call p
>
> angle b-p-e is the angle between lines, get that by dot product of p-b
> and p-e. call that angle t for theta.
>
> point g is where b crosses the circle. transform the circle to the
> origin. make point g the complex coordinate r*exp(i t), where r=radius,
> t = theta.
>
> multiply complex g by exp[i Pi] rotates it 90 degrees left which gets
> the point where a glances the circle. multiply by exp[i -Pi] to get
> where c glances. do the same for the other end of the node to get a and
> c in the first place if you want.
>
> do the same for d and f.
>
> now you just need where d crosses c which is a line intersection test,
> so you have your arc and all the points to draw in brown
>
> now make it an algorithm where you can add an arbitrary number of lines,
> since you have an arc and the lines a-f, its all just more intersections
> and shrinking the arc. the arc can never be split in to two...
>
> right?
>
>
> * @ 23/05/05 04:02:55 PM rob.02004 at gmail.com wrote:
> > >From an SVG perspective your algorithm is a bit too low-level. SVG has
> > primatives like: line, polyline, circle, path (supports beizer
> > curves). These can be styled using attributes like: stoke-width,
> > stroke-color, stroke-linecap, fill-color, etc.
> >
> > Streets all one color, with no outline color, could be done in SVG as
> > a 'round join, as shown here:
> > http://zvon.org/xxl/svgReference/Output/exd0e19960.html
> >
> > No exit streets can be done as 'round' cap lines:
> > http://zvon.org/xxl/svgReference/Output/exd0e19896.html
> >
> > On Saturday, for outlined streets, Nick and I were looking at an
> > approach line this:
> > 1) set background to that light brown color
> > 2) draw thick white lines along the street vectors
> > 3) draw separate dark brown outlines at the edge of the thick white
> > lines; when lines intersect:
> >    a) use the angle of intersection to calculate the appropriate place
> > to stop the dark brown outlines on side where intersection angle is
> > less than 180 degrees.
> >    b) if there is an intersection angle greater than 180 degrees then
> > calculate the start and end points of the arc needed to draw the
> > rounded edge outline.
> >
> > I believe Nick has coded the algorithm to do the caculation for step 3(a).
> >
> > Other drawing ideas welcome. :-)
> >
> > Rob
> >
> > SteveC wrote:
> > > I've had to look at google maps a bit lately
> > >
> > > looking closely at
> > >
> > >
> > > for example, I think it'd be possible to recreate that by starting with
> > > a black background. dra your lines by iterating a pixel at a time down
> > > the line drawing a filled white circle at each pixel. hence the rounded
> > > edges in goole maps.
> > >
> > > now you have a load of black islands. fill those with that white brown
> > > colour and the black pixels which touch a white pixel the darker brown.
> > > i think its approximately that simple, though there are details with the
> > > white -> darkbrown -> lightbrown boundaries. the black/white colouring
> > > is just to make it a clear description...
> > >
> > > ideas?
> > >
> > > have fun,
> > >
> > > SteveC steve at fractalus.com http://www.fractalus.com/steve/
> >
> > _______________________________________________
> > Openstreetmap-dev mailing list
> > Openstreetmap-dev at vr.ucl.ac.uk
> > http://bat.vr.ucl.ac.uk/cgi-bin/mailman/listinfo/openstreetmap-dev
> >
>
> have fun,
>
> SteveC steve at fractalus.com http://www.fractalus.com/steve/

have fun,

SteveC steve at fractalus.com http://www.fractalus.com/steve/
-------------- next part --------------
A non-text attachment was scrubbed...
Name: angle.png
Type: image/png
Size: 2399 bytes
Desc: not available
URL: <http://lists.openstreetmap.org/pipermail/dev/attachments/20050523/d01e108d/attachment.png>
```