@domoinc/multiline-chart
Version:
MultiLineChart - Domo Widget
47 lines (46 loc) • 1.63 kB
JavaScript
//----------------------------------------------------------------------------------
//----------------------------------------------------------------------------------
// Round any corner of a rectangle you want:
// Usage: append a path and use this function to build the "d" attribute.
// Parameters:
// x: x-coordinate
// y: y-coordinate
// w: width
// h: height
// r: corner radius
// tl: top_left rounded?
// tr: top_right rounded?
// bl: bottom_left rounded?
// br: bottom_right rounded?
// example:
/*\
|*|
|*| d3.select("path")
|*| .attr({
|*| "d": function (d, i) {
|*| return d3.roundedRect( 0, 0, 100, 100, 5, true, false, false, true );
|*| }
|*| });
|*|
\*/
//----------------------------------------------------------------------------------
//----------------------------------------------------------------------------------
d3.roundedRect = function(x, y, w, h, r, tl, tr, bl, br)
{
var retval;
retval = "M" + (x + r) + "," + y;
retval += "h" + (w - 2*r);
if (tr) { retval += "a" + r + "," + r + " 0 0 1 " + r + "," + r; }
else { retval += "h" + r; retval += "v" + r; }
retval += "v" + (h - 2*r);
if (br) { retval += "a" + r + "," + r + " 0 0 1 " + -r + "," + r; }
else { retval += "v" + r; retval += "h" + -r; }
retval += "h" + (2*r - w);
if (bl) { retval += "a" + r + "," + r + " 0 0 1 " + -r + "," + -r; }
else { retval += "h" + -r; retval += "v" + -r; }
retval += "v" + (2*r - h);
if (tl) { retval += "a" + r + "," + r + " 0 0 1 " + r + "," + -r; }
else { retval += "v" + -r; retval += "h" + r; }
retval += "z";
return retval;
}