Skip to content

Instantly share code, notes, and snippets.

@Calvein
Created July 5, 2014 09:43
Show Gist options
  • Save Calvein/a760e0bc728b6f692542 to your computer and use it in GitHub Desktop.
Save Calvein/a760e0bc728b6f692542 to your computer and use it in GitHub Desktop.
D3 map animation

Map animation in D3.

Display the source blob
Display the rendered blob
Raw
{"type":"Topology","objects":{"states":{"type":"GeometryCollection","geometries":[{"type":"Polygon","properties":{"name":"New South Wales","code":"nsw"},"arcs":[[0,1,2,3],[4]]},{"type":"MultiPolygon","properties":{"name":"Victoria","code":"vic"},"arcs":[[[5]],[[6,-1,7]]]},{"type":"MultiPolygon","properties":{"name":"Queensland","code":"qld"},"arcs":[[[8]],[[9]],[[10]],[[11]],[[12]],[[13]],[[14]],[[15]],[[16]],[[17]],[[18]],[[-3,19,20,21]]]},{"type":"MultiPolygon","properties":{"name":"South Australia","code":"sa"},"arcs":[[[22]],[[23,24,-20,-2,-7,25]]]},{"type":"MultiPolygon","properties":{"name":"Western Australia","code":"wa"},"arcs":[[[26]],[[27]],[[28]],[[29]],[[30,-24,31]]]},{"type":"MultiPolygon","properties":{"name":"Tasmania","code":"tas"},"arcs":[[[32]],[[33]],[[34]],[[35]],[[36]],[[37]],[[38]],[[39]]]},{"type":"MultiPolygon","properties":{"name":"Northern Territory","code":"nt"},"arcs":[[[40]],[[41]],[[42]],[[43]],[[44]],[[45]],[[46]],[[47]],[[48]],[[49,-21,-25,-31]]]},{"type":"Polygon","properties":{"name":"Australian Capital Territory","code":"act"},"arcs":[[-5]]}]}},"arcs":[[[9102,1825],[-191,90],[-247,121],[-6,25],[12,33],[-23,15],[-1,26],[-21,28],[0,67],[-10,28],[-70,36],[-38,-22],[-15,18],[-22,0],[-13,-27],[-36,-5],[-19,9],[-45,-29],[-71,27],[-12,12],[-45,6],[-14,-25],[-21,8],[-25,-5],[-36,13],[-11,-5],[-20,18],[-28,-9],[-26,15],[-38,38],[-30,-13],[-31,-2],[-42,10],[-35,-12],[-11,-38],[-20,-33],[-29,-5],[-8,14],[-27,9],[-41,39],[-10,34],[-52,37],[-15,24],[-28,11],[-55,47],[-30,-2],[-19,25],[0,24],[-42,13],[-15,44],[-3,47],[9,21],[-62,37],[-16,-3],[-62,35],[-21,-8],[-1,-32],[-42,-12],[-17,54],[-22,15],[-4,40],[-25,32],[-2,21],[-19,19],[-45,12],[-34,-6],[-34,11],[-42,-34],[-32,25],[-22,1],[-13,13],[-40,2],[-23,15]],[[6898,2862],[-1,174],[0,280],[0,203],[0,315],[0,226],[0,298]],[[6897,4358],[132,0],[203,0],[162,0],[164,0],[163,0],[139,0],[183,0],[300,0],[260,0],[249,0],[17,13],[16,36],[8,0],[41,37],[22,6],[18,28],[35,5],[18,-15],[152,28],[19,-25],[23,-14],[42,-3],[29,13],[46,-29],[18,-3],[10,-32],[12,3],[44,-33],[0,-46],[8,-19],[20,-3],[27,33],[10,34],[45,25],[11,-21],[35,3],[30,19],[1,40],[-21,63],[15,-2],[13,17],[36,6],[23,25],[18,-1],[19,32],[19,-2],[54,-29],[30,16],[56,-14],[19,33],[38,-1],[36,28],[16,-2]],[[9980,4607],[8,-28],[-8,-81],[19,-36],[-8,-37],[2,-20],[-40,-67],[1,-25],[-23,-39],[6,-26],[-5,-48],[-16,-67],[-7,-55],[-16,-30],[1,-35],[-16,-47],[-26,-55],[-10,-59],[5,-47],[20,-20],[-13,-24],[6,-16],[-19,-29],[-3,-49],[-13,-21],[3,-26],[-20,-25],[-26,-85],[-27,-22],[-23,-35],[-7,-42],[14,-11],[-11,-19],[2,-49],[-51,-27],[-35,-44],[-28,-2],[-24,9],[8,-41],[-48,-24],[-20,-40],[-34,-17],[15,-10],[-7,-29],[-45,-33],[12,-25],[-16,-37],[-34,-16],[5,-19],[-4,-49],[-15,-18],[14,-9],[-9,-32],[-20,14],[1,-39],[-44,-43],[-16,-28],[-7,-39],[-16,-11],[13,-35],[-15,-50],[-15,-13],[-1,-52],[-20,-9],[5,-30],[-23,-9],[-31,-41],[0,-23],[-22,-30],[5,-18],[-21,-25],[-5,-20],[-38,-63],[3,-36],[-9,-43],[3,-44],[-17,-28],[0,-46],[-18,-36],[-22,-76],[9,-33],[-17,-13],[33,-17],[-14,-70],[7,-38]],[[8814,2358],[23,-24],[3,-18],[33,-20],[14,32],[2,35],[-8,33],[15,-1],[0,48],[27,29],[6,18],[-38,44],[-76,-55],[-11,-56],[10,-65]],[[7947,1561],[4,32],[40,-7],[-25,-34],[-19,9]],[[6888,1660],[2,177],[-1,200],[-1,311],[0,220],[-1,272],[11,22]],[[9102,1825],[-59,-25],[-16,-29],[-50,-25],[-162,-5],[-26,-5],[-83,-1],[-46,-8],[-91,-34],[-44,-30],[-40,-33],[-98,-94],[-33,-36],[-29,-5],[-30,-19],[-11,3],[-56,-12],[-17,10],[-29,-5],[-11,-13],[19,-22],[7,-29],[30,16],[18,-17],[-13,-22],[12,-24],[-16,-19],[-18,0],[-1,19],[-39,57],[-30,17],[-31,-25],[-16,35],[-26,34],[-28,-4],[-22,8],[-17,26],[-17,8],[3,32],[21,5],[8,17],[-25,41],[-49,-8],[-56,-71],[-34,2],[-12,32],[34,13],[36,57],[-7,36],[-15,6],[-15,40],[-18,5],[-24,-24],[-37,-24],[-14,0],[-26,-22],[-22,1],[-10,-19],[31,-8],[38,17],[20,-20],[-23,-24],[-46,-8],[-37,-25],[-61,-33],[-16,-27],[-32,-33],[-39,-17],[-31,-36],[-49,30],[-25,-4],[-60,43],[-34,4],[-76,56],[-47,22],[-56,-12],[-64,37],[-44,2],[-26,-19],[12,-20],[-59,6],[-12,28],[-32,31],[-65,34]],[[7175,9995],[12,4],[2,-26],[-14,-9],[-11,14],[11,17]],[[6511,7894],[-4,13],[23,29],[17,-32],[-36,-10]],[[9866,4968],[10,23],[17,-55],[-8,-12],[-19,44]],[[7224,9972],[-12,-32],[-24,20],[20,22],[16,-10]],[[9950,4944],[-1,-38],[-15,-13],[-1,42],[17,9]],[[7178,9794],[-8,26],[23,20],[18,-34],[-33,-12]],[[9977,4822],[-19,-64],[-10,4],[-2,38],[7,37],[24,-15]],[[8199,7487],[-20,5],[-5,28],[19,24],[19,-34],[-13,-23]],[[9425,5934],[2,-12],[-21,-14],[-23,40],[-19,12],[-3,15],[-13,24],[18,12],[26,-18],[19,5],[-3,-35],[17,-29]],[[6452,8031],[-7,17],[23,34],[15,11],[37,4],[20,16],[14,-4],[24,-25],[-26,-19],[-5,16],[-23,-7],[-8,-43],[-14,9],[-26,-29],[-14,1],[-10,19]],[[9856,5452],[-4,45],[32,28],[14,23],[1,28],[-25,31],[36,32],[-1,-53],[23,-40],[-53,-139],[-15,-56],[-1,-38],[-20,18],[-11,54],[24,67]],[[6897,4358],[-1,277],[0,233],[1,165],[0,219],[-309,0],[-165,0],[-263,0]],[[6160,5252],[0,173],[0,223],[0,174],[0,174],[-1,274],[0,220],[0,174],[0,298],[0,195],[0,218],[1,66],[0,246],[0,182],[0,199]],[[6160,8068],[29,-31],[50,-31],[26,-8],[50,3],[66,-35],[25,-2],[21,-32],[17,-9],[0,-40],[22,-49],[23,-14],[19,0],[28,-19],[29,-29],[42,-10],[28,-18],[12,-22],[27,-5],[70,12],[62,32],[20,19],[28,15],[17,33],[14,59],[5,54],[23,30],[4,20],[14,10],[20,33],[3,21],[18,38],[-5,10],[15,58],[21,46],[-14,48],[5,2],[7,54],[14,68],[37,100],[7,53],[-17,40],[-16,108],[19,77],[-1,36],[-32,56],[8,78],[12,45],[36,73],[-17,31],[-3,38],[-8,10],[12,25],[31,27],[17,52],[-1,14],[-30,24],[-3,-12],[-24,-1],[35,102],[29,71],[9,0],[11,-26],[19,9],[-17,19],[9,60],[5,5],[13,61],[11,32],[8,42],[-2,24],[9,31],[-8,42],[13,17],[26,1],[17,11],[21,52],[22,4],[19,-16],[-23,-33],[20,-3],[4,-19],[29,-12],[15,-30],[-1,-44],[21,-48],[-8,-13],[4,-48],[1,-77],[28,-25],[43,3],[10,-21],[-23,-50],[-3,-56],[22,0],[25,-17],[1,-31],[40,-35],[-9,-11],[-13,-67],[48,13],[-11,-33],[1,-46],[8,-72],[11,-7],[1,-51],[-6,-12],[-7,-51],[24,-67],[12,-9],[5,-50],[11,-46],[25,-38],[25,-10],[36,15],[25,32],[0,23],[32,-14],[26,14],[14,28],[26,-29],[-2,-27],[16,-1],[-8,-35],[16,-23],[22,1],[2,-13],[31,-6],[10,-34],[18,-20],[38,-15],[29,-35],[14,-6],[-19,-24],[-9,-40],[12,-34],[-12,-38],[19,-38],[-1,-23],[12,-23],[0,-60],[11,-5],[16,-41],[-7,-29],[8,-30],[-14,-21],[-1,-36],[14,-14],[27,-52],[22,-15],[26,-39],[1,-16],[42,10],[-12,-28],[-3,-24],[15,-21],[14,-56],[16,-22],[-2,-33],[20,-43],[-14,-46],[6,-15],[-5,-35],[-21,-44],[4,-42],[29,-30],[20,-40],[28,-9],[0,-25],[-12,-40],[-3,-32],[15,-31],[29,-35],[57,-35],[21,1],[3,-14],[24,-20],[18,1],[21,27],[6,-40],[17,-19],[27,-8],[14,8],[34,-4],[26,-32],[10,-59],[22,-31],[23,1],[-4,34],[23,-5],[3,-34],[19,-22],[35,11],[8,-18],[38,-15],[-10,-13],[28,-35],[29,3],[4,23],[22,-20],[5,-19],[18,-6],[38,-31],[6,-33],[-25,-15],[-18,-32],[17,-38],[25,-22],[20,-30],[25,-6],[-1,-24],[36,-3],[12,-22],[-2,-46],[23,-17],[6,-25],[-8,-35],[14,4],[8,-18],[27,-11],[-11,-20],[5,-26],[-6,-24],[9,-10],[-2,-26],[33,-105],[14,-22],[18,2],[30,-21],[15,22],[13,51],[17,13],[29,-39],[5,-28],[31,-15],[36,-35],[31,-16],[-10,38],[6,37],[28,-7],[6,-25],[13,-5],[-14,-31],[34,-39],[-19,-135],[10,-8],[8,-34],[-10,-10],[8,-31],[13,-19],[2,-22],[15,3],[22,-9],[4,-15],[19,-14],[12,-43],[35,-11],[10,-25],[38,-24],[5,-14],[20,6],[11,-13],[28,17],[4,-28],[39,-36],[23,-74],[29,-41],[35,-28],[19,-2],[23,-25],[5,-49],[17,-36],[18,-15],[9,-28],[58,-11],[1,-44],[-10,-5],[10,-24],[-9,-9],[16,-55],[56,-62],[-24,-94],[0,-29],[11,-10],[-5,-40],[4,-41],[7,-5],[-6,-55],[-17,-34],[25,-27],[-20,-12],[-8,-20],[14,-7],[-1,-38],[18,-9],[11,-35],[14,0],[16,-65],[16,-2],[9,-22],[-14,-6],[15,-40],[5,-44],[25,-24]],[[6144,2313],[-32,4],[-49,-20],[-5,-30],[-31,-15],[-22,21],[-46,5],[-13,-15],[-66,5],[-25,-10],[-55,49],[13,41],[48,14],[70,10],[60,26],[49,-5],[13,7],[3,-46],[50,1],[-9,-24],[13,-9],[27,35],[37,-10],[13,-29],[-17,-17],[-26,12]],[[3950,3557],[0,188],[0,183],[0,314],[0,198],[0,224],[0,149],[0,198],[0,241]],[[3950,5252],[199,0],[260,0],[154,0],[253,0],[114,0],[235,0],[143,0],[180,0],[151,0],[173,0],[143,0],[205,0]],[[6888,1660],[-30,5],[-44,-6],[-70,49],[-27,56],[-38,40],[2,13],[-27,11],[-30,35],[-32,54],[9,17],[-13,34],[-18,19],[44,41],[3,40],[-18,65],[-19,47],[-29,54],[-27,39],[-66,73],[-45,35],[-34,22],[-44,15],[-20,-9],[-27,-30],[-14,4],[-76,-8],[-15,16],[18,25],[30,14],[13,24],[24,12],[7,69],[12,28],[-10,50],[19,18],[-3,14],[-27,24],[-6,21],[-35,37],[-10,49],[-17,12],[1,18],[-22,21],[-17,-36],[2,-26],[-23,-25],[-9,-50],[-5,-52],[-32,-82],[8,-19],[-30,-16],[-20,15],[-32,5],[-23,-20],[-18,2],[-28,-25],[-35,6],[-28,-22],[-15,14],[33,48],[-6,17],[18,33],[64,8],[26,-18],[20,20],[12,91],[-9,55],[7,51],[-12,26],[16,1],[13,27],[-8,11],[23,27],[-7,12],[68,84],[21,6],[-23,53],[3,22],[-16,11],[5,24],[52,21],[-7,30],[-17,8],[-20,99],[-26,22],[-3,-35],[14,-9],[-5,-49],[-43,-18],[-4,-18],[-38,-35],[-16,-45],[2,-22],[-33,-69],[-20,-24],[-44,-11],[-47,-23],[-107,-79],[-10,-34],[-33,-45],[-14,-3],[-17,-40],[-30,-13],[-20,-34],[-3,-35],[28,-28],[10,-38],[-14,-8],[-24,36],[-23,7],[-33,-25],[-3,19],[-32,40],[-32,19],[-2,18],[-27,23],[22,6],[17,-36],[26,9],[-24,35],[-12,70],[-16,41],[-2,31],[-30,48],[-32,35],[-44,33],[5,37],[-15,52],[-30,29],[5,18],[-27,10],[-34,-2],[-33,-14],[-31,53],[-27,91],[27,-10],[24,13],[-9,44],[-32,29],[-32,-15],[-35,0],[24,28],[-11,27],[-23,26],[-30,12],[-3,25],[-18,7],[-16,-24],[-15,19],[-51,-30],[-31,7],[-22,22],[-67,43],[-60,8],[-48,-28],[-39,3],[-16,21],[-76,60],[-79,47],[-58,28],[-29,9],[-25,-22],[-58,-21],[-126,10],[-83,-4],[-26,-6],[-75,-4],[-129,-20]],[[2999,8637],[-8,22],[20,32],[9,-14],[-1,-32],[-20,-8]],[[2837,8416],[8,28],[16,-2],[13,-30],[-14,-17],[-9,23],[-14,-2]],[[589,6793],[29,47],[10,-21],[-15,-39],[-27,0],[3,13]],[[12,5333],[-12,41],[22,9],[28,-109],[19,-24],[8,-26],[-6,-13],[-36,57],[-24,49],[1,16]],[[3950,8564],[-1,-152],[0,-242],[0,-173],[0,-176],[0,-231],[0,-279],[1,-272],[0,-298],[0,-298],[0,-298],[0,-129],[0,-268],[0,-174],[0,-322]],[[3950,3557],[-49,-21],[-40,-27],[-88,-42],[-56,-22],[-86,-22],[-45,-23],[-75,-18],[-133,-10],[-67,9],[-49,14],[-62,-17],[-31,-20],[-65,-53],[-74,-29],[-38,-25],[-19,-4],[-31,-30],[-37,-20],[-71,-11],[-55,-26],[-33,-46],[-25,-74],[-5,-37],[-54,-52],[0,-23],[-41,-24],[-11,-16],[-46,11],[-18,-25],[-26,-9],[-10,30],[-18,14],[-58,-14],[-57,3],[-7,-14],[-52,10],[-40,-28],[-14,1],[-13,30],[-24,23],[-18,-3],[-32,-21],[-20,14],[-14,-8],[-23,17],[-47,4],[-23,-10],[-64,-6],[-34,4],[-15,-9],[-51,0],[-40,-25],[-51,12],[-27,-6],[-18,8],[-24,-15],[-24,1],[-29,-27],[-23,-10],[-31,-50],[-7,-33],[-17,0],[-3,-23],[-23,2],[-6,-20],[-74,18],[-20,-15],[-23,-3],[-17,-19],[9,-10],[-32,-24],[-31,-8],[-23,-18],[-6,-38],[-35,-1],[-38,-23],[-61,-21],[-52,-1],[-3,-21],[-58,29],[-47,5],[-17,-12],[-44,11],[-8,-13],[-36,14],[-35,-12],[-33,12],[-67,44],[-48,9],[-19,33],[-38,42],[-52,47],[-54,31],[-49,1],[-35,19],[-7,45],[-5,70],[6,23],[-7,27],[28,40],[9,-16],[46,-9],[32,17],[37,51],[22,41],[2,49],[-20,136],[41,9],[-14,21],[7,46],[-5,40],[12,28],[-7,36],[10,15],[-10,52],[-15,54],[-36,73],[-24,40],[-31,90],[-31,56],[-32,84],[-5,74],[-20,61],[6,39],[-5,74],[9,54],[-17,53],[-14,58],[-58,72],[-9,78],[-26,50],[-42,63],[-36,37],[-17,77],[11,35],[0,25],[-16,56],[-17,42],[-69,135],[-37,58],[-71,81],[1,17],[-14,31],[19,0],[30,22],[9,-43],[12,8],[8,-21],[4,-45],[-4,-21],[18,-11],[29,0],[33,33],[-1,48],[-20,25],[-25,10],[-21,37],[-8,0],[-5,45],[-10,8],[-10,41],[-16,17],[14,50],[29,-24],[2,-18],[41,-54],[-7,-40],[-9,-9],[7,-48],[15,-1],[23,41],[6,-12],[17,-70],[28,-36],[31,31],[5,24],[-11,34],[16,7],[-15,48],[15,-2],[-6,34],[-47,64],[-33,74],[-23,74],[-28,23],[-8,19],[5,28],[-17,22],[0,36],[-52,75],[-3,78],[12,12],[-6,27],[13,37],[0,20],[23,42],[12,38],[35,31],[6,17],[3,55],[-6,47],[15,29],[-3,36],[-11,37],[-15,21],[-14,39],[22,39],[22,53],[24,88],[16,31],[42,26],[-6,-46],[-15,-64],[25,-56],[-15,-20],[0,-19],[15,-14],[19,24],[26,-15],[10,48],[27,79],[24,27],[7,38],[31,16],[36,31],[34,3],[37,24],[25,2],[46,32],[51,61],[29,9],[15,38],[27,25],[36,13],[13,18],[3,28],[23,-11],[12,12],[29,5],[15,20],[66,28],[26,-19],[41,25],[78,-33],[41,13],[20,13],[16,-8],[40,25],[3,14],[74,62],[10,-8],[28,11],[38,-2],[21,16],[26,-12],[36,16],[19,33],[17,17],[7,23],[25,22],[17,-8],[13,10],[54,-18],[33,-18],[61,31],[37,11],[55,6],[107,43],[81,41],[61,49],[32,41],[42,70],[32,81],[7,31],[29,17],[-6,32],[13,31],[22,-3],[53,45],[23,31],[25,12],[16,28],[-3,23],[-40,18],[-2,74],[-13,37],[1,61],[6,27],[32,61],[29,30],[13,-5],[26,63],[10,-10],[28,7],[10,12],[-9,15],[10,31],[30,28],[22,9],[-9,-39],[39,-38],[9,-26],[-1,-32],[21,-18],[14,-41],[24,-42],[1,-20],[16,-11],[22,-35],[14,39],[5,43],[-10,48],[15,10],[45,-40],[-8,66],[-9,22],[-48,62],[13,23],[-31,2],[3,13],[35,-8],[-11,24],[18,4],[6,23],[-27,33],[-3,23],[39,5],[35,-60],[23,24],[38,-2],[13,-8],[11,-33],[29,-2],[11,24],[16,-19],[62,2],[5,9],[-34,13],[-41,-9],[-9,39],[21,37],[15,-18],[15,15],[5,66],[25,16],[-3,17],[-24,-12],[-23,-50],[-6,30],[-17,5],[-5,38],[13,23],[-4,32],[5,19],[16,8],[27,-13],[10,8],[10,37],[-9,25],[31,-6],[51,-43],[17,-5],[4,31],[-16,16],[-26,-17],[-11,16],[-6,46],[15,13],[17,-8],[24,23],[21,-28],[24,14],[13,-15],[17,3],[-3,44],[-17,-2],[-7,21],[11,11],[-31,17],[-12,25],[22,28],[8,21],[19,11],[17,-3],[21,15],[16,-15],[10,10],[4,37],[-8,10],[1,38],[9,3],[22,-23],[-13,-40],[6,-15],[26,9],[9,-33],[17,-17],[4,27],[19,-4],[13,22],[-9,26],[15,10],[-3,31],[17,7],[8,26],[-15,21],[-16,-6],[-14,17],[27,35],[24,-14],[8,-22],[-14,-5],[35,-51],[13,13],[-14,13],[12,28],[34,16],[-8,-30],[27,-22],[21,-1],[46,60],[-19,49],[14,11],[34,7],[36,-41],[30,-18],[10,13],[20,-2],[30,-29],[-5,-15],[27,-15],[28,-26],[22,-33],[14,-41],[77,-66],[13,-24],[-19,-61],[-8,-47],[51,-71],[5,7],[-20,35],[-7,32],[9,28],[30,9],[9,15],[22,3],[-10,30],[27,12],[35,-9],[24,-18],[53,-5]],[[7862,896],[21,-18],[-30,-17],[-5,18],[14,17]],[[8638,278],[-14,23],[22,11],[6,-25],[-14,-9]],[[8446,100],[18,25],[-23,20],[17,24],[19,-48],[-20,-13],[7,-28],[-19,-44],[-31,6],[-21,21],[30,11],[23,26]],[[8663,977],[35,16],[28,-42],[-25,-16],[-9,19],[-65,-6],[-14,17],[34,16],[16,-4]],[[8571,218],[41,2],[4,-21],[-18,-15],[16,-42],[-11,-12],[-20,7],[-21,-13],[-19,11],[-21,50],[22,1],[34,-15],[-7,47]],[[7662,1079],[-3,-11],[-45,-27],[-13,22],[6,20],[-13,17],[7,41],[-4,27],[19,14],[5,25],[39,-27],[2,-101]],[[8660,1096],[28,-4],[0,-44],[10,-29],[-30,0],[-24,-18],[-17,7],[-9,42],[-26,34],[-15,46],[25,35],[58,-69]],[[8543,226],[-22,2],[-4,17],[-27,2],[-2,-31],[-15,-1],[-22,-21],[2,-19],[-24,-33],[1,-34],[-35,-4],[-29,-56],[-22,-20],[7,-19],[-48,-9],[-42,35],[-37,-7],[-47,15],[-43,-19],[-1,24],[-15,19],[14,19],[-17,15],[-22,-9],[-19,38],[-50,65],[-22,-3],[-33,98],[-8,1],[-24,54],[-5,52],[23,-7],[50,-34],[8,15],[-19,11],[-26,34],[0,17],[-26,0],[-1,37],[-13,30],[-31,29],[-36,53],[-35,69],[-3,27],[-21,36],[-18,89],[25,24],[-5,57],[36,-22],[37,-4],[33,-25],[35,7],[18,-12],[36,-5],[18,-14],[42,-10],[17,-23],[40,-11],[50,-26],[55,-7],[38,14],[3,-12],[38,27],[23,4],[47,23],[37,-8],[25,17],[24,4],[12,-19],[23,8],[27,37],[15,9],[43,-19],[13,8],[21,36],[26,-9],[8,-18],[27,-5],[29,-44],[-17,-37],[10,-67],[-12,-35],[14,-48],[-13,-64],[14,-24],[-10,-25],[18,-57],[-11,-24],[-13,6],[8,39],[-32,13],[-22,-11],[-15,-37],[3,-30],[-11,-19],[7,-17],[-13,-26],[-2,-52],[-14,-10],[-15,-37],[-31,3]],[[5816,8351],[-2,-16],[-20,6],[0,25],[24,6],[-2,-21]],[[5844,9666],[-22,-45],[-9,15],[19,28],[12,2]],[[5715,8887],[-13,-13],[-6,28],[15,-2],[7,25],[13,-3],[0,-47],[-16,12]],[[5902,8310],[0,23],[12,10],[20,-11],[4,-46],[-14,-7],[-22,31]],[[5560,9410],[9,25],[21,6],[13,-20],[-43,-11]],[[4830,9676],[8,-42],[-7,-17],[-22,41],[1,44],[18,16],[2,-42]],[[4352,9495],[-8,-22],[-27,-1],[-45,17],[-48,-16],[-21,6],[13,41],[18,-11],[11,17],[-8,55],[19,32],[22,11],[15,-32],[-6,-24],[22,-21],[1,-26],[42,-26]],[[5772,8868],[50,20],[14,15],[12,-24],[26,-7],[5,-20],[-21,-12],[2,-22],[-19,-26],[6,-23],[42,-4],[15,-13],[-16,-18],[-39,14],[-21,-11],[-6,10],[-33,8],[-23,17],[11,19],[-8,42],[3,35]],[[4362,9587],[6,17],[34,8],[13,15],[33,-17],[3,14],[26,21],[34,16],[22,-21],[10,2],[14,-41],[16,-6],[-2,-17],[-17,-12],[2,-27],[-24,0],[-9,-22],[-38,-34],[-24,-13],[-34,-30],[-20,24],[-43,18],[-32,37],[-16,5],[0,27],[-15,18],[-6,61],[-11,14],[10,26],[27,-36],[10,6],[7,-41],[15,10],[9,-22]],[[3950,8564],[16,-4],[30,-28],[-5,-20],[17,-23],[-3,86],[22,-6],[39,-23],[32,-51],[9,9],[-12,56],[19,38],[-21,45],[-49,57],[-5,24],[11,31],[13,13],[13,36],[19,-6],[5,11],[28,14],[6,17],[-7,31],[17,20],[-1,34],[9,46],[19,4],[26,-11],[33,23],[23,35],[0,19],[-19,30],[-11,3],[7,69],[20,-5],[28,18],[3,65],[22,11],[20,-20],[16,6],[-7,17],[15,72],[33,-14],[4,-29],[28,-14],[3,32],[-17,5],[17,36],[29,2],[13,46],[25,-5],[14,-14],[16,55],[7,-13],[2,-33],[17,-19],[19,-5],[69,3],[29,17],[16,-17],[32,-9],[26,27],[21,11],[5,-15],[18,8],[9,-11],[13,27],[46,18],[-3,20],[9,38],[-8,39],[-30,23],[13,21],[-24,46],[-25,5],[-29,-5],[-39,-22],[-17,30],[-17,11],[9,14],[-28,16],[-5,20],[43,24],[12,-12],[20,-51],[11,19],[4,34],[24,2],[35,-13],[15,-17],[-2,-17],[30,-24],[11,-31],[16,-2],[13,22],[32,34],[23,-30],[37,-82],[37,-9],[3,-9],[34,-10],[35,-2],[6,-8],[51,34],[13,-27],[-16,-8],[13,-21],[31,13],[32,-11],[6,-27],[24,-12],[8,15],[15,-17],[33,-10],[30,7],[20,25],[21,3],[17,-47],[26,-9],[27,-35],[27,-1],[24,12],[10,30],[15,12],[24,-8],[14,15],[12,-12],[39,27],[11,-10],[-30,-37],[6,-22],[25,6],[33,21],[14,-36],[16,0],[-14,-37],[13,-23],[8,12],[42,-7],[18,17],[14,42],[-9,17],[-24,-3],[-8,15],[17,28],[19,3],[27,35],[10,-25],[9,10],[15,-31],[-3,-16],[17,-36],[24,1],[-11,23],[20,9],[36,-37],[-6,-32],[-43,-26],[1,-30],[-14,-38],[-11,2],[-10,-24],[-26,-6],[14,-33],[-8,-26],[7,-34],[-15,-17],[0,-19],[-22,1],[-8,24],[3,27],[-14,-4],[-3,-29],[-24,-23],[-37,2],[-11,8],[-21,-17],[-14,-49],[-6,-39],[19,-54],[29,9],[-5,-34],[-24,-44],[-8,-61],[-23,-15],[-33,-55],[-9,-3],[-20,-39],[-4,-28],[-14,-7],[-17,-28],[4,-28],[15,-32],[27,-22],[14,0],[21,-21],[32,-18],[17,-22],[59,-42],[19,-7],[12,-47],[30,-16],[36,-30],[21,16],[20,-7],[-14,-29],[15,-41],[10,13],[33,-12],[19,22],[25,-27],[41,-19],[14,-24],[25,-16],[47,-12],[32,-14],[32,-57],[34,-36]]],"transform":{"scale":[0.004071281124912491,0.0033574139878987893],"translate":[112.921124032,-43.630693473499996]},"bbox":[112.921124032,-43.630693473499996,153.629864,-10.0599110085]}
<!DOCTYPE html>
<meta charset="utf-8">
<style>
button {
padding: 5px 8px;
background: #eee;
border: 1px solid #909090;
border-radius: 4px;
cursor: pointer;
}
input {
width: 240px;
}
svg,
input {
display: block;
}
path {
fill: #4682b4;
stroke: #3c6e99;
transition: 0.2s;
}
.active {
background: #ffa500;
border-color: #d98c00;
color: #fff;
fill: #ffa500;
}
circle {
fill: #ffd700;
}
</style>
<body>
<button data-state="vic" data-coord="[144.96327999999994,-37.814107]">Go to Melbourne</button>
<button data-state="nt" data-coord="[133.88061140000002,-23.7002104]">Go to Alice springs</button>
<input type="range" min="1" max="100" value="50">
<script src="http://d3js.org/d3.v3.min.js"></script>
<script src="http://d3js.org/topojson.v1.min.js"></script>
<script>
// Size of the map
var size = 240
// Zoom level to see all Australia
var startScale = 330
// Zoom level when zoomed
var zoomedScale = 1330
// Transition duration
var duration = 400
var projection = d3.geo.mercator()
.translate([size / 2, size / 2])
.center([133, -27])
.scale(startScale)
var path = d3.geo.path()
.projection(projection)
var svg = d3.select('body').append('svg')
.attr('width', size)
.attr('height', size)
var rScale = d3.scale.linear()
.range([1, 0, 1])
.domain([0, .5, 1])
var states = null
var point = null
var range = 50
d3.json('australia-states.json', function(err, aus) {
states = svg.append('g')
.selectAll('path')
.data(topojson.feature(aus, aus.objects.states).features)
.enter().append('path')
.attr('data-state', function(d) {
return d.properties.code
})
.attr('d', path)
point = svg.append('circle')
.attr('r', 0)
projection.scale(zoomedScale)
// Go to a location
d3.selectAll('button').on('click', clickButton)
d3.select('input').on('input', inputRange)
})
function goTo(coord, state) {
projection.center(coord)
path.projection(projection)
states
.transition()
.duration(duration)
.attr('d', path)
states.classed('active', false)
.filter(function(d) {
return d.properties.code === state
})
.classed('active', true)
point.attr('transform', 'translate(' + projection(coord) + ')')
}
function changeRadius(changedCoord) {
// Scientifically calculated
r = range * zoomedScale / 5660.377358490566
// 2 is the minimum radius
r = d3.max([r, 2])
if (point.attr('r') === '0') {
point.transition()
.delay(duration)
.attr('r', r)
} else if (changedCoord) {
point
.transition()
.duration(duration)
.attrTween('r', function() {
return function(t) {
return rScale(t) * r
}
})
} else {
point.attr('r', r)
}
}
// Events
function clickButton() {
el = d3.select(this)
// D3 doesn't have event delegation
if (el.classed('active')) return
d3.selectAll('button').classed('active', false)
el.classed('active', true)
coord = JSON.parse(this.dataset.coord)
state = this.dataset.state
goTo(coord, state)
changeRadius(true)
}
function inputRange() {
range = this.value
changeRadius()
}
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment