I am using venn.js to try to visualize 5-way data. The data I am using is from R's VennDiagram Package. But it somehow can't show up. Most of the examples are using the even number of sets, is there anything special about the odd number?
My code is as below:
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>mds venn.js example</title>
<style>
body {
font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
font-size: 14px;
}
</style>
</head>
<body>
<div id="venn"></div>
</body>
<script src="http://www.numericjs.com/lib/numeric-1.2.6.min.js"></script>
<script src="http://d3js.org/d3.v3.min.js"></script>
<script src="venn.js"></script>
<script src="http://www.benfrederickson.com/images/mds.js"></script>
<script>
var sets = [{sets: ['A'], size: 301},
{sets: ['B'], size: 321},
{sets: ['C'], size: 311},
{sets: ['D'], size: 321},
{sets: ['E'], size: 301}
{sets: ['A','B'], size: 188},
{sets: ['A','C'], size: 191},
{sets: ['A','D'], size: 184},
{sets: ['A','E'], size: 177},
{sets: ['B','C'], size: 194},
{sets: ['B','D'], size: 197},
{sets: ['B','E'], size: 190},
{sets: ['C','D'], size: 190},
{sets: ['C','E'], size: 173},
{sets: ['D','E'], size: 186}];
var chart = venn.VennDiagram()
.width(600)
.height(400)
.layoutFunction(
function(d) { return venn.venn(d, { initialLayout: venn.classicMDSLayout });}
);
d3.select("#venn").datum(sets).call(chart);
</script>
</html>
The original data come from
venn.plot <- draw.quintuple.venn(
area1 = 301,
area2 = 321,
area3 = 311,
area4 = 321,
area5 = 301,
n12 = 188,
n13 = 191,
n14 = 184,
n15 = 177,
n23 = 194,
n24 = 197,
n25 = 190,
n34 = 190,
n35 = 173,
n45 = 186,
n123 = 112,
n124 = 108,
n125 = 108,
n134 = 111,
n135 = 104,
n145 = 104,
n234 = 111,
n235 = 107,
n245 = 110,
n345 = 100,
n1234 = 61,
n1235 = 60,
n1245 = 59,
n1345 = 58,
n2345 = 57,
n12345 = 31,
category = c("A", "B", "C", "D", "E"),
fill = c("dodgerblue", "goldenrod1", "darkorange1", "seagreen3", "orchid3"),
cat.col = c("dodgerblue", "goldenrod1", "darkorange1", "seagreen3", "orchid3"),
cat.cex = 2,
margin = 0.05,
cex = c(1.5, 1.5, 1.5, 1.5, 1.5, 1, 0.8, 1, 0.8, 1, 0.8, 1, 0.8, 1, 0.8,
1, 0.55, 1, 0.55, 1, 0.55, 1, 0.55, 1, 0.55, 1, 1, 1, 1, 1, 1.5),
ind = TRUE
);
You have a syntax error in your javascript, this line "{sets: ['E'], size: 301}" should have a comma after it - adding the comma and it produces output like: