SQL Join

<!DOCTYPE html>
<head> 
  <meta charset="utf-8">
  <script src="https://d3js.org/d3.v4.min.js"></script>
  <style>
    .vennCircle {
      stroke: black;
      stroke-width:1;
      fill:gray;
      fill-opacity:.4;  
    }
    #middleCircle {
      clip-path: url(#svgPath);
      fill-opacity:0;
    }    
    body {margin:100;}
  </style>
</head>

</svg>
  <script>
   
    
	var width = 600,
		height = 600;
	
	var records = ['A','B','C','D','E','F','G','H']
	var matched = ['A','B','E','H']
	
	var tabWidth = 150;
	var tabHeight = 200;
	var tabOffsetX = (width-tabWidth*2)/3
	var tabOffsetY = 50
	
    var svg = d3.selectAll('#sqlSVG');

var data = [];
	
	var numRows = 7;
	var numCols = 6;
	
	for (var k = 0; k < numRows; k += 1) {
		data.push(d3.range(numCols));
	}

sql1.append('text')
		.text(function(d,i){return records[i];})
		.style("fill","white")
		.attr("transform","translate("+ (tabWidth/numCols/2)+','+ (tabHeight/numCols/2)+')')
		.attr("text-anchor","middle")
			;
    
  </script>
</body>

https://d3js.org/d3.v4.min.js