如何翻转Y venn diagramm? (venn.js)

时间:2015-05-16 16:22:05

标签: javascript d3.js svg venn-diagram venn.js

我用d3.js和venn.js构建简单的venn diagramm:https://jsfiddle.net/rvuf1z5o/

var sets = [
    {sets: ['F'], size: 3},
    {sets: ['G'], size: 3},
    {sets: ['C'], size: 3},
    {sets: ['F','G'], size: 1},
    {sets: ['F','C'], size: 1},
    {sets: ['G','C'], size: 1},
    {sets: ['F','G','C']}
];

var chart = venn.VennDiagram();
var div = d3.select("#venn").datum(sets).call(chart);

我需要按Y翻转此图表,如图所示: enter image description here

如何使用sets / chart object / svg attrs / css?

来完成

感谢您的建议。

1 个答案:

答案 0 :(得分:4)

看起来你可以通过切换你宣布套装的顺序来重新安排他们的位置。工作jsfiddle

var sets = [
{sets: ['F'], size: 3},
{sets: ['G'], size: 3},
{sets: ['C'], size: 3},

{sets: ['G','C'], size: 1},
{sets: ['F','C'], size: 1},
{sets: ['F','G'], size: 1},

{sets: ['F','G','C']}
];

var chart = venn.VennDiagram();
var div = d3.select("#venn").datum(sets).call(chart);

修改后的代码位于底部,因为我必须粘贴在venn.js