Set operator in Venn

by RichardAD

HTML

<title>Results of two sets and operations there upon</title>
<body>
<canvas id='canvas' width=600 height=400 style='border:1px solid gray'>Uh oh, canvas is not supported.</canvas>
</body>

JavaScript

CanvasRenderingContext2D.prototype.arcText = function(
  x
, y
, r               // radius
, position        // radians  Anchor position on the circle, regardless of facing direction
, text            // text         The text to be displayed in circular fashion
, align           // left | right | center
, textInside      // true to show inside the diameter. False to show outside
, inwardFacing    // true for baseline of text facing inward. false for outward 
, fName           // name of font family. Make sure it is loaded
, fSize           // size of font family. Don't forget to include units
, kerning         // letter gap (pixels). 0 for normal, > 0 expanded, < contracted
) 
{ 
		// code from James Alford, http://blog.graphicsgen.com/2015/03/html5-canvas-rounded-text.html
    align = align.toLowerCase();
    var clockwise = align == "right" ? 1 : -1; // draw clockwise for aligned right. Else Anticlockwise

    // calculate height of the font.
    var div = document.createElement("div");
    div.innerHTML = text;
    div.style.position = 'absolute';
    div.style.top = '-10000px';
    div.style.left = '-10000px';
    div.style.fontFamily = fName;
    div.style.fontSize = fSize;
    document.body.appendChild(div);
    var textHeight = div.offsetHeight;
    document.body.removeChild(div);
    
    this.fillStyle = 'black';
    this.font = fSize + ' ' + fName;

    // Reverse letters inward
    if (inwardFacing) text = text.split("").reverse().join("");
    
    // Setup letters and positioning
    this.translate(x, y); // Move to center
    position += (Math.PI * !inwardFacing); // Rotate 180 if outward
    this.textBaseline = 'middle'; // Ensure we draw in exact center
    this.textAlign = 'center'; // Ensure we draw in exact center

    // calculate length of text
    var L = 0
    if (align == "center") {
        for (var j = 0; j < text.length; j++) {
            var charWid = this.measureText(text[j]).width;
            position += ((charWid + (j ==...