[Openstreetmap-dev] drawing algorihtms

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

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...


* @ 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
> > 
> > http://maps.google.co.uk/maps?q=aberdeen+place+london&spn=0.015167,0.034171&hl=en
> > 
> > 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/

More information about the dev mailing list