2

In OpenLayers, I would like to have a rectangle with rounded corners as the background of a feature style (and some text in it). Having a rectangle itself is easy, but how can I make rounded corners?

My approach was to draw four circles in the corners, one big rectangle between the center points of the circles and then four rectangles for the four corners between the big rectangle and the outside of the circle (so that the rectangles form basically a plus shape with the circles for the corners).

However, that is a) very complex and b) the 3/4 of the circle that are not the rounded corner is then behind the rectangle, so as soon as the rounded rectangle should have a semi-transparent background, it doesn't work anymore, as we have then two layers of the same color above each other.

How can I best do that?

Florian
  • 3,145
  • 1
  • 27
  • 38
  • 2
    Probably easiest to draw one in a canvas element then use it as a data url for an icon style https://stackoverflow.com/questions/1255512/how-to-draw-a-rounded-rectangle-on-html-canvas – Mike Nov 07 '18 at 23:20

0 Answers0