There's a risk of turning it into too much of a gimmick, but I'd love if travel sites started doing things like this. Showing you a flythrough of where you'll be going as they pull up trip prices, for example
Unrelated, but does anyone have an idea why all of the countries appear in alphabetical order but then suddenly Spain jumps up in the middle of all the E-s? The UK follows soon after. All I could think of was Spain=Espana, but England definitely isn't the same as the UK..
This is the order they are defined in the source data (Natural Earth - Admin 0 countries), and it appears to be sorted by ISO 3166-1 alpha-3 code. Spain is ESP, United Kingdom is GB1.
Jason didn't change the projection; Jason used a better interpolator (following great arcs rather than linear interpolation of angles as I was doing). The projection looks flat because it's an orthographic projection rather than a perspective projection.
This is a classic example of where Flash excels over the over-hyped HTML 5. The demo is very very sluggish and laggy on my Laptop (Chrome, WIN 8, C2D 2.2GHZ, 4mb Cache, 4Gigs RAM). If the author had designed the same thing in Flash,
1) He could have done it with less lines of code.
2) He could have done it with smoother animations and could have added more interactivity.
I'm not bashing the author, just suggesting a viable alternative.
Unfortunately, the unwanted HTML5 hype is just killing the platform. And the platform (I personally believe) is in the wrong hands, because they haven't marketed it well (IMO).
Runs quickly here, doesn't need to be compiled, source can easily be viewed and edited (while it's running, depending on your browser), and style-able with CSS.
Flash does one of those, and for the same reasons as HTML5 solutions, its speed depends heavily on the code backing the drawing and how much data is displayed. Why do I want Flash again?
To make animations like these on Flash, it's just a breeze, period. I own an Adobe creative suite in which Flash is available. The bundled Flash IDE (which was originally popularly called as Flash) is a lot lot better than say, writing hundreds of complex lines of mathematical lines to create just a 3d rotation or tween.
If you consider 73 to be short, then I wonder what you would think of 10-15 lines of code. Not to exaggerate, but you can actually achieve this with 0 lines of code in Flash using just Movie clips.
No, wrong. I assume you haven't used the Flash platform. A movie clip is like a library that can be replicated and instances of which, as many as you want can be created. Similar to creating a variable and calling it how many ever times you want it. So, in an interactive mesh-up movie clips will help you stay well organized with fewer lines of code, comparatively.
Nope, I programmed in AS for awhile though I left before Flex became well implemented.
I know about the movie clip system and don't deny what you claim. But now you're moving the goalposts as decoupling the elements from the Flash environment requires you to do more, well, hand coding. To do what you claim -- implement the same features with less code -- would require more handiwork inside the Flash authoring tool, which was never really a fun workflow even when Flash was more ubiquitous.
In any case, lowering the code count by relying on MovieClips, which as you say are basically libraries, hardly seems fair. I'm sure all the code in the OP could be reduced to about five lines, three of them being calls to external code and CSS files.
Flex and Flash are two different things. Flash is a designer-friendly tool, while flex is more programmer-oriented. From what you describe, it looks like you've been doing more coding with the platform than designing.
Dude, you serious? I can build you something similar in just 5 mins with 0 lines of code with easier maintainability and no calls to external CSS or Code.
>which was never really a fun workflow
I am surprised, because it was one of the most powerful features of flash, just like layers were for Photoshop. Maybe it's a personal opinion, but I loved this workflow personally.
So I think you and I are more or less in agreement: to make an animated globe, Flash may require less lines of code for the average developer.
But what I argue is that this D3 implementation, because of its code structure, is easier to build upon with even more data and interactivity. I would bet that whatever it takes you to build in 5 minutes with 0 lines of code, will take up many, many multiple times of work to do even trivial changes. Sure, you'd win in the scenario in which only a simple animated globe is called for, but I don't think that's what most of the OP's audience cars about.
And I wonder if you can even claim to do what you want in such a short time...for the simple matter that doing is in the Flash designer environment requires a lot of point and click (for 180+ MovieClips).
Ok, for 180+ Movie clips, I agree with you :D Btw, you are the author of the bastards book for photography? Wow. I loved your work :) I'll shoot you an email sometime :)
Maybe since you're such an advocate for Flash you could post your Flash version of the same widget, and show us all how much better/cleaner/faster/easier-to-code your version is?
HTML 5 has a long way to go, not all features are supported across all platforms and even the single-most simplest animation or interactivity will require a lot of lines of code to function properly, let alone the extra lines of code you would end up coding to make it work across all browsers.
Actually, the "single-most simplest animation or interactivity" (plus things far more advanced that that) can be achieved with like 1-2 lines of javascript, and sometimes not even one line, using declarative css transitions and such.
Running fine on my 5 year old laptop.. Taking about 10-30% cpu.
The implementation is short enough to paste in this comment. I find d3.js almost magical. About the closest actionscript toolset would be prefuse flare. D3 was designed as a direct descendant and improvement to that generation of toolkits.
D3 uses a combination of HTML, SVG and CSS. HTML5 is a broader standard than SVG, so the answer is D3 uses both. HTML5 added SVG as a new feature (replacing generic <object> tags).
It owns French Guiana, so that's why that part of South America's highlighted. Also some of the country names are based on what the country actually calls itself, which is why Spain (Espana) shows up in the E section. Why the alphabetical name and the displayed name are different? That's weird.