Animation synchronisation

[robinhouston]

Can the synchronisation of the animation be improved, so countries move more in lockstep?

[robinhouston]

I should add that I did experiment with using the SMIL syncbase feature, which in principle ought to be an even better way to tackle this, but that my efforts came to naught for reasons I do not yet understand. Here is what I tried (which does not work in either Safari or Firefox – the animations simply fail to start):

diff --git a/site/carbonmap.js b/site/carbonmap.js
index 7664272..b71a4f1 100644
--- a/site/carbonmap.js
+++ b/site/carbonmap.js
@@ -209,6 +209,7 @@ function carbonmapDataLoaded() {

             // Animate the map to the chosen configuration
             if (Modernizr.smil) {
+                var trigger_element = null;
                 for (var k in data) {
                     if (!data.hasOwnProperty(k)) continue;

@@ -220,14 +221,23 @@ function carbonmapDataLoaded() {
                         animate_element.setAttribute("dur", "1s");
                         animate_element.setAttribute("attributeName", "d");
                         animate_element.setAttribute("to", new_path);
-                        animate_element.setAttribute("begin", "indefinite");
                         animate_element.setAttribute("fill", "freeze");

+                        if (trigger_element == null) {
+                            animate_element.setAttribute("begin", "indefinite");
+                            animate_element.id = "animation-trigger";
+                            trigger_element = animate_element;
+                            console.log("Trigger element is on %s", k);
+                        }
+                        else {
+                            animate_element.setAttribute("begin", "animation-trigger.begin");
+                        }
+
                         $(country_path).find("animate").not(":last").remove();
                         country_path.appendChild(animate_element);
-                        animate_element.beginElement();
                     }
                 }
+                trigger_element.beginElement();
             }
             else {
                 // Fake the animation for browsers that don’t support SMIL