CODEWITHSUNDEEP
algorithmgeometry
Wesley Workman
Wesley Workman

Reputation: 917

Algorithm for drawing rectangle borders w/ different overlapping border

I'm looking for information about how to draw borders around rectangles and provide a slightly different rendering for overlapped borders. These rectangles are user generated so they can have a variety of sizes and overlaps. Users specify the z-order. Here is an example:

enter image description here

My data is modeled with simple rect data structures. For simplicity, I'm expecting to draw all border with lines (even when there is no overlap). I'm planning to draw the rectangles and borders using SVGs in a browser, but I'm just looking for a generic solution that is platform agnostic. .

This problem domain is new to me. I don't have much experience in this area, but I'll happily take and information I can get.

Upvotes: 4

Views: 975

Answers (1)

Angela Pretorius
Angela Pretorius

Reputation: 243

From the picture, it looks like the border of a rectangle is only affected by rectangles on top of it.

Draw the rectangles in order from top to bottom. For each of the eight corner-adjoining-edge pairs of the next rectangle to draw, loop through all currently drawn rectangles to find the rectangle which contains the corner and overlaps the longest portion of the edge. Render that portion of the edge as overlapped.

If this is too slow, use a two-dimensional segment tree to store all currently drawn rectangles so that the rectangles containing a given corner can be quickly identified.

Upvotes: 2

Related Questions