Is there a sample on how to do Venn diagram using d3.js? I know about the two samples:
that are provided on D3 website. However they force me to calculate by myself the x.y position of the circles. I am hoping to feed just the data (circle sizes and overlap size) to a function/chart and it should do the layout for me.
Is there a sample on how to do Venn diagram using d3.js? I know about the two samples:
that are provided on D3 website. However they force me to calculate by myself the x.y position of the circles. I am hoping to feed just the data (circle sizes and overlap size) to a function/chart and it should do the layout for me.
Share Improve this question edited Jan 19, 2014 at 15:12 VividD 10.5k8 gold badges66 silver badges112 bronze badges asked Sep 22, 2012 at 15:18 Yaron NavehYaron Naveh 24.4k33 gold badges105 silver badges164 bronze badges 2- I don't think anybody has built a reusable venn diagram chart yet. Are you going to be putting data in the chart (labels or other information), or you literally are just looking for a bunch of overlapping circles? – Bill Commented Sep 22, 2012 at 17:05
- I can do without putting data – Yaron Naveh Commented Sep 22, 2012 at 17:47
2 Answers
Reset to default 12Venn Diagrams with D3.js
It is working fine.
To get an understanding of the required algorithm, read Leland Wilkinson's paper, Exact and Approximate Area-proportional Circular Venn and Euler Diagrams, published in IEEE TVCG February 2012. To the best of my knowledge no one has yet implemented a venneuler layout in D3, but that would make a fantastic D3 plugin.