2

I have simple venn diagramm built with d3.js and venn.js: 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);

I need to flip this chart by Y as shown in the picture: enter image description here

How can I do it using sets / chart object / svg attrs / css?

Thank you for advice.

John Slegers
  • 45,213
  • 22
  • 199
  • 169
Mariya Steksova
  • 850
  • 9
  • 14

1 Answers1

4

It looks as though you can rearrange their positions by switching around what order you declare the sets. Working 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);

The modified code is at the bottom as I had to paste in venn.js

Josh
  • 334
  • 1
  • 17