0

I'm trying to draw a path for a rounded rectangle where the sides are optional.

The function would look like this: 

function drawRoundRect(width, height, sides, topLeftRadius, topRightRadius, bottomLeftRadius, bottomRightRadius) {
    pathData = "M 0 0...";
}

But I can't figure out the path data.

The user would be able to say: 

var myPath = drawRoundRect(100,100,"top left right", 10, 10, 10, 10);

and it would create a rectangle with three sides where the bottom line of the rectangle is not drawn.

Or for a full rectangle they would write this: 

var myPath = drawRoundRect(100,100,"top left right bottom", 10, 10, 10, 10);

// top and bottom no rounded corners
var myPath = drawRoundRect(100,100,"top bottom", 0, 0, 0, 0);
1.21 gigawatts
  • 16,517
  • 32
  • 123
  • 231
  • 2
    literally the first result for searching "svg path rounded rectangle" - http://stackoverflow.com/questions/10177985/svg-rounded-corner – Jaromanda X Nov 03 '15 at 05:31
  • Hi this is not a duplicate. That question has a function for rounding the corners of an existing path. My question is about creating a new path. Please do not mark this as duplicate – 1.21 gigawatts Nov 03 '15 at 05:54
  • Hi this question is not a duplicate. Please reopen or I will post it again. – 1.21 gigawatts Nov 03 '15 at 06:29

0 Answers0