Drawing Venn Diagrams | Hacker News Reader

Drawing Venn Diagrams

yuri.is

56 pointsluu22 comments

Correction to title: Drawing Proportional-Intersection Venn Diagrams

This seems to be only for two circles.

I was hoping for an algorithm for drawing any Venn Diagram. Here's n=7 https://78.media.tumblr.com/tumblr_m74i4eR9Ym1qa0uujo1_1280....

Might not be the most efficient way to get proportionality, but it would seem that making the set boundaries elastic and putting a proportional amount of non-overlapping particles within the corresponding regions may draw a 'good enough' picture.

Sort of like in the type of graph layout algorithm https://youtu.be/_Oidv5M-fuw

I find this kind of physical approach to 'optimization' entertaining. With quotes because it need not converge/terminate.

In the book "The Mathematical Mechanic" by Levi, there's even more examples like a physical model for solving an optimal location problem in 2D (minimize sum of distance from a source to fixed locations, choosing where to place the source) by setting up weights connected by strings to a ring denoting the optimal location of the source. It also claims to prove the Pythagorean theorem by a prism-shaped water tank construction.

Neat demonstration!

A while back I wrote a small package in Javascript for computing area proportional Venn and Euler diagrams: https://github.com/benfred/venn.js . The 2 circle case here is relatively easy, but the problem gets tricky when you have 3+ sets. I wrote up my approach here https://www.benfrederickson.com/venn-diagrams-with-d3.js/ and https://www.benfrederickson.com/better-venn-diagrams/

I really like this project. I have some high-dimension data (object deduplication) that would really benefit from a visualization like this.

In the music example, it has to give up on rendering all intersections since the layout isn't feasible with area-proportional circles - is there anything else that could be done? Is it possible to use ellipses or curved-shapes instead?

But then I guess searching for a solution could become too computationally expensive for client-side JS.

You could give up on trying to represent the sets with overlapping circles, and use a different approach, such as UpSet: http://caleydo.org/tools/upset/

There is a pretty good breakdown of a bunch of different options for visualizing sets here: http://www.cvast.tuwien.ac.at/SetViz

Venn/Euler diagrams don't work all that well past 3 sets, not all areas will be shown if using circles - so unless some of the sets are disjoint it will be a misleading diagram (like in the music example). However, I think it works well for 3 set diagams, I have an interactive example on last.fm data here https://www.benfrederickson.com/distance-metrics/ in the context of explaining some simple distance metrics.

I wanted to do this for three circles a while ago and found this aS well. http://www.eulerdiagrams.com/Euler3.html

I thought it was pretty neat

I find it interesting that the function doesn't have a closed form solution, given how easy it is to compute it. I wouldn't have thought, at first glance, that the function wasn't invertible.

I used "Area Proportional Ellipses" several years back which allowed up to three quantities to be represented.

http://www.eulerdiagrams.org/eulerAPE/

I made multiple highly precise comparison figures...

In the end someone (else) went into a paint program slapped a few ovals together as a cartoon of my precision which went into the final product because it did made a better illustration and conveyed to point of my figures without any accuracy beyond that of the mark-1 eyeball

You don't need 100 iterations of binary search. Double-precision floating-point numbers only have 52 bits of precision.

Hey, thank you -- this is a good point. I'll update the code to 52 iterations in the upcoming iteration to the site.

Non-programmer here. Isn't numerically inverting an analytic function something that should be done with a math library rather than coded from scratch? (Or is the point of this demonstration how to do that inversion rather than anything about Venn diagrams?)

The code is neat, but given how terrible humans are at comparing areas[1] (particularly odd shapes like this), is there any point to making Venn diagrams proportional (other than filling your own deep OCD desires)?

1: See also: Pie charts

If humans are bad at comparing areas, more the reason to have an algorithm for drawing equal sizes.

But if most people don't perceive the actually equal sizes as equal, then what's the point?

A pie chart may be a bad design choice, but at least I'd expect it to be accurate.

When I wrote the comment, my thinking was that maybe color would be a better choice than area then, in which case unequal areas may confound that approach further.

See also: Matplotlib Venn [1, 2] which draws area-accurate Venn diagrams.

[1] https://pypi.python.org/pypi/matplotlib-venn

[2] https://python-graph-gallery.com/venn-diagram/

In the extremes (0% and 100% overlap), don't these cease to be Venn diagrams? I thought a Venn diagram had to show every possible intersection and non-intersection, even if some of these were empty.

In answer to a code-review critique I once posted a Venn diagram of two completely non-overlapping circles labeled "What you're asking about" and "Scope of this feature". It got the point across, albeit with a little snark.

Off topic a bit... what about those pie charts that are missing the middle. Are they proportional? Edit: seem to be called donut charts.

With both pie charts and donut charts, the size of a segment is based on its arc length. With a pie, that's the same thing as area, but for donuts it's not. So I guess that's one argument against donut charts. Neither chart is great for comparing sizes imo.

Check out https://github.com/ft-interactive/chart-doctor/tree/master/v...

A donut chart is also area<->arc length proportional. Intuition: a donut chart is what remains of a pie chart when a smaller version of the same pie chart is removed from the center. If the two pie charts are proportionally correct, their difference must be proportionally correct.

You are right

Reply on news.ycombinator.com