d3.js compute path booleans between ellipses and circles

Question

I need to split multiple overlapping ellipses in an SVG by all path intersections. The purpose of this is for a venn diagram. Ben Fredrickson's venn diagram gets you part of the way there by computing intersections, but does not compute all possible intersections between an arbitrary number of ellipses. His methods do not compute convex (difference) areas, only intersections, and do not handle ellipses.

I've created a non-proportional, symmetric venn diagram layout in d3 and would like to generate paths for all the possible regions, not just intersections.

If there is not a javascript method available, if someone could help clarify the math that would also be acceptable.

My approach so far looks like this:

1. find intersection points of ellipse circumfrence paths (how?)
2. generate arc segments between those points using ellipse radii
3. join arc segments to new paths

So in the following fiddle, I would need to split these ellipses by every path intersection, generating 18 separate paths.

fiddle here

var width = 450,
   height = 400

var svg = d3.select("body").append("svg")
    .attr("width", width)
    .attr("height", height);


svg.append("svg:ellipse")
.attr("cx", 100)
.attr("cy", 100)
.attr("rx", 50)
.attr("ry",100)
.style("fill", 'rgba(128,255,128,0.4)')
.style("stroke", "#777")
.style("stroke-width", '1px');


svg.append("svg:ellipse")
.attr("cx", 150)
.attr("cy", 100)
.attr("rx", 50)
.attr("ry",100)
.style("fill", 'rgba(255,128,128,0.4)')
.style("stroke", "#777")
.style("stroke-width", '1px');


svg.append("svg:ellipse")
.attr("cx", 150)
.attr("cy", 100)
.attr("rx", 100)
.attr("ry",50)
.style("fill", 'rgba(128,128,255,0.4)')
.style("stroke", "#777")
.style("stroke-width", '1px');

svg.append("svg:ellipse")
.attr("cx", 190)
.attr("cy", 130)
.attr("rx", 100)
.attr("ry",50)
.style("fill", 'rgba(255,128,255,0.4)')
.style("stroke", "#777")
.style("stroke-width", '1px');