Question

我正在使用venn.js来尝试可视化5向数据。我使用的数据来自R VennDiagram Package。但它不知何故不能出现。大多数例子都是使用偶数集，奇数有什么特别之处吗？

我的代码如下：

 <!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>

原始数据来自

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
);

Answer 1

您的javascript中存在语法错误，此行“{sets：['E']，size：301}”之后应该有逗号 - 添加逗号并生成输出，如：

enter image description here

使用d3.js绘制5路图

1 个答案: