7 ms·
Show HN: Funnel Visualization in HTML/CSS/D3.js
- aaimnr 13y agoThe 3d effect doesn't really make sense in this case, since it suggests that all the segments have actually equal width.
- benbjohnson 13y agoI'm not sure if the 3D effect is intentional but I definitely agree. It makes it confusing as to what I'm looking at. I feel like it's a Wolfenstein 3D level. Kudos on working on a better visualization of funnel analysis. The traditional bar chart that tools like MixPanel use is also confusing. It explicitly convey that you're looking at the flow of actions. I wrote an open source behavioral analytics database and I opted for separating the action visualization and the flow between actions in my D3.js funnel analysis visualization. Animation also helps to show the flow. http://demo.skydb.io/gharchive/explore http://demo.skydb.io/gharchive/explore (For context, that's GitHub Archive data so it's showing the next immediate action after a given action -- e.g. pushes, repo creation, GitHub follows, etc)
- danlebo 13y agoVery interesting how it's only using one div and border hacks per segment. So I guess in theory this would work on older browsers, other than just content clipping in IE8, IE7, etc.
- eekfuh 13y agoInitially I wrote it using 2 div's (one for the segment and one for the gap) so it would work in ie8, but I opted to go with one div, since its cleaner DOM-wise.
- viggity 13y agoCool work, I like the transitions, but I'd caution people on actually using a funnel chart as it has a tendency to be easily mis-interpreted. http://blog.spark59.com/2012/why-not-the-funnel-chart/ http://blog.spark59.com/2012/why-not-the-funnel-chart/
- rjurney 13y agoGreat job. Lose the 3D.
- DelvarWorld 13y agoWhy does it default to dong colored?