See also the linear path tweening example.
Last active
September 13, 2019 10:42
-
-
Save mbostock/3081153 to your computer and use it in GitHub Desktop.
Shape Tweening
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
license: gpl-3.0 |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
{"type":"Polygon","coordinates":[[[-120,40.9],[-120,40.72],[-120,40.53],[-120,40.35],[-120,40.17],[-120,39.98],[-120,39.8],[-120,39.62],[-120,39.44],[-120,39.25],[-120,39.07],[-120,39.01],[-120,39],[-119.77,38.84],[-119.53,38.67],[-119.3,38.51],[-119.06,38.35],[-118.83,38.18],[-118.59,38.02],[-118.36,37.85],[-118.13,37.69],[-117.94,37.55],[-117.76,37.42],[-117.58,37.28],[-117.39,37.14],[-117.21,37],[-117.03,36.86],[-116.84,36.73],[-116.66,36.59],[-116.5,36.46],[-116.34,36.34],[-116.18,36.21],[-116.02,36.08],[-115.86,35.96],[-115.7,35.83],[-115.53,35.71],[-115.37,35.58],[-115.19,35.44],[-115,35.29],[-114.81,35.15],[-114.63,35],[-114.63,35],[-114.63,35],[-114.62,34.88],[-114.61,34.87],[-114.59,34.86],[-114.58,34.86],[-114.57,34.84],[-114.56,34.83],[-114.56,34.82],[-114.56,34.79],[-114.54,34.77],[-114.52,34.76],[-114.49,34.75],[-114.43,34.64],[-114.42,34.64],[-114.42,34.63],[-114.42,34.63],[-114.42,34.6],[-114.42,34.6],[-114.41,34.58],[-114.39,34.57],[-114.38,34.56],[-114.38,34.54],[-114.38,34.54],[-114.37,34.53],[-114.37,34.52],[-114.38,34.5],[-114.38,34.5],[-114.38,34.49],[-114.37,34.48],[-114.37,34.47],[-114.36,34.47],[-114.36,34.47],[-114.34,34.47],[-114.34,34.46],[-114.34,34.46],[-114.33,34.46],[-114.32,34.45],[-114.32,34.45],[-114.3,34.44],[-114.29,34.44],[-114.28,34.42],[-114.2,34.37],[-114.18,34.36],[-114.17,34.36],[-114.16,34.35],[-114.13,34.33],[-114.12,34.31],[-114.12,34.29],[-114.13,34.28],[-114.16,34.26],[-114.19,34.23],[-114.22,34.2],[-114.24,34.19],[-114.35,34.13],[-114.38,34.12],[-114.4,34.11],[-114.41,34.09],[-114.42,34.05],[-114.43,34.03],[-114.44,34.01],[-114.46,34],[-114.5,33.98],[-114.52,33.96],[-114.52,33.94],[-114.52,33.93],[-114.51,33.92],[-114.49,33.9],[-114.49,33.89],[-114.5,33.88],[-114.52,33.87],[-114.51,33.85],[-114.51,33.83],[-114.51,33.8],[-114.5,33.79],[-114.49,33.79],[-114.49,33.78],[-114.49,33.76],[-114.5,33.76],[-114.5,33.75],[-114.5,33.74],[-114.49,33.73],[-114.49,33.71],[-114.51,33.7],[-114.52,33.68],[-114.52,33.66],[-114.52,33.64],[-114.52,33.63],[-114.53,33.62],[-114.53,33.62],[-114.53,33.6],[-114.53,33.58],[-114.53,33.57],[-114.54,33.56],[-114.55,33.55],[-114.57,33.53],[-114.58,33.52],[-114.59,33.5],[-114.63,33.44],[-114.64,33.43],[-114.67,33.42],[-114.72,33.42],[-114.73,33.41],[-114.72,33.4],[-114.71,33.39],[-114.7,33.38],[-114.7,33.37],[-114.7,33.36],[-114.71,33.35],[-114.72,33.32],[-114.72,33.31],[-114.69,33.28],[-114.68,33.26],[-114.67,33.2],[-114.68,33.16],[-114.69,33.12],[-114.7,33.09],[-114.67,33.05],[-114.63,33.04],[-114.54,33.04],[-114.5,33.02],[-114.47,32.99],[-114.47,32.97],[-114.47,32.96],[-114.47,32.95],[-114.47,32.94],[-114.46,32.88],[-114.46,32.85],[-114.47,32.84],[-114.51,32.82],[-114.52,32.81],[-114.53,32.79],[-114.53,32.77],[-114.53,32.75],[-114.54,32.74],[-114.58,32.73],[-114.68,32.75],[-114.72,32.72],[-114.72,32.71],[-114.73,32.71],[-114.77,32.71],[-114.84,32.7],[-114.91,32.7],[-114.99,32.69],[-115.06,32.69],[-115.13,32.68],[-115.21,32.68],[-115.28,32.67],[-115.35,32.67],[-115.43,32.66],[-115.5,32.65],[-115.57,32.65],[-115.65,32.64],[-115.72,32.64],[-115.79,32.63],[-115.87,32.63],[-115.94,32.62],[-116.02,32.62],[-116.09,32.61],[-116.16,32.6],[-116.24,32.6],[-116.31,32.59],[-116.38,32.59],[-116.46,32.58],[-116.53,32.58],[-116.6,32.57],[-116.68,32.57],[-116.75,32.56],[-116.82,32.55],[-116.9,32.55],[-116.97,32.54],[-117.05,32.54],[-117.12,32.53],[-117.12,32.53],[-117.13,32.54],[-117.13,32.57],[-117.13,32.59],[-117.13,32.62],[-117.15,32.65],[-117.17,32.67],[-117.19,32.68],[-117.22,32.68],[-117.21,32.69],[-117.2,32.7],[-117.19,32.7],[-117.17,32.7],[-117.16,32.68],[-117.15,32.67],[-117.14,32.66],[-117.13,32.64],[-117.12,32.62],[-117.11,32.62],[-117.1,32.63],[-117.1,32.65],[-117.12,32.67],[-117.13,32.69],[-117.14,32.7],[-117.17,32.71],[-117.18,32.71],[-117.2,32.72],[-117.21,32.72],[-117.22,32.71],[-117.23,32.7],[-117.24,32.67],[-117.24,32.66],[-117.25,32.67],[-117.26,32.69],[-117.26,32.7],[-117.25,32.75],[-117.25,32.77],[-117.25,32.78],[-117.28,32.81],[-117.28,32.83],[-117.27,32.85],[-117.26,32.86],[-117.25,32.88],[-117.25,32.89],[-117.27,32.99],[-117.28,33.01],[-117.29,33.02],[-117.31,33.08],[-117.36,33.17],[-117.5,33.34],[-117.6,33.39],[-117.65,33.44],[-117.67,33.45],[-117.72,33.47],[-117.74,33.48],[-117.78,33.53],[-117.82,33.56],[-117.94,33.61],[-117.98,33.64],[-118.11,33.75],[-118.13,33.76],[-118.16,33.76],[-118.18,33.76],[-118.2,33.76],[-118.22,33.77],[-118.23,33.77],[-118.24,33.76],[-118.25,33.76],[-118.26,33.76],[-118.27,33.75],[-118.27,33.72],[-118.27,33.72],[-118.27,33.71],[-118.28,33.7],[-118.29,33.7],[-118.3,33.7],[-118.31,33.71],[-118.32,33.71],[-118.33,33.71],[-118.34,33.73],[-118.35,33.73],[-118.36,33.73],[-118.37,33.73],[-118.38,33.73],[-118.39,33.73],[-118.4,33.73],[-118.42,33.76],[-118.42,33.77],[-118.4,33.79],[-118.39,33.8],[-118.39,33.83],[-118.39,33.85],[-118.4,33.87],[-118.42,33.9],[-118.44,33.95],[-118.48,34],[-118.51,34.02],[-118.54,34.04],[-118.57,34.04],[-118.58,34.04],[-118.6,34.03],[-118.6,34.03],[-118.61,34.04],[-118.63,34.04],[-118.77,34.02],[-118.79,34.02],[-118.81,34.01],[-118.83,34.02],[-118.87,34.04],[-118.92,34.04],[-119.02,34.06],[-119.1,34.11],[-119.13,34.11],[-119.13,34.1],[-119.12,34.1],[-119.11,34.1],[-119.1,34.1],[-119.13,34.1],[-119.16,34.11],[-119.2,34.15],[-119.21,34.15],[-119.22,34.15],[-119.22,34.15],[-119.23,34.16],[-119.23,34.17],[-119.23,34.18],[-119.24,34.19],[-119.25,34.2],[-119.26,34.22],[-119.25,34.23],[-119.26,34.24],[-119.27,34.24],[-119.27,34.25],[-119.27,34.26],[-119.28,34.27],[-119.29,34.27],[-119.32,34.27],[-119.33,34.28],[-119.45,34.36],[-119.49,34.37],[-119.55,34.4],[-119.57,34.41],[-119.58,34.42],[-119.6,34.42],[-119.62,34.42],[-119.64,34.42],[-119.69,34.41],[-119.7,34.41],[-119.71,34.4],[-119.72,34.39],[-119.74,34.39],[-119.76,34.4],[-119.79,34.41],[-119.8,34.42],[-119.82,34.43],[-119.84,34.42],[-119.86,34.41],[-119.88,34.41],[-119.98,34.45],[-120.04,34.47],[-120.09,34.46],[-120.13,34.47],[-120.18,34.48],[-120.33,34.47],[-120.43,34.45],[-120.47,34.45],[-120.49,34.49],[-120.52,34.52],[-120.56,34.55],[-120.58,34.55],[-120.61,34.56],[-120.64,34.56],[-120.65,34.57],[-120.66,34.58],[-120.65,34.6],[-120.64,34.63],[-120.63,34.65],[-120.62,34.66],[-120.61,34.68],[-120.61,34.71],[-120.62,34.73],[-120.63,34.74],[-120.64,34.76],[-120.64,34.78],[-120.62,34.82],[-120.62,34.84],[-120.62,34.85],[-120.63,34.86],[-120.63,34.87],[-120.64,34.88],[-120.67,34.9],[-120.67,34.91],[-120.67,34.93],[-120.64,35],[-120.63,35.04],[-120.63,35.07],[-120.64,35.11],[-120.64,35.14],[-120.65,35.14],[-120.67,35.15],[-120.68,35.15],[-120.7,35.17],[-120.71,35.17],[-120.72,35.18],[-120.74,35.17],[-120.76,35.17],[-120.76,35.16],[-120.79,35.18],[-120.85,35.2],[-120.88,35.22],[-120.89,35.23],[-120.89,35.25],[-120.89,35.29],[-120.86,35.35],[-120.85,35.34],[-120.86,35.33],[-120.86,35.32],[-120.84,35.32],[-120.83,35.33],[-120.83,35.35],[-120.85,35.37],[-120.86,35.38],[-120.87,35.41],[-120.88,35.42],[-120.89,35.43],[-120.91,35.44],[-120.98,35.45],[-121.01,35.47],[-121.04,35.49],[-121.07,35.52],[-121.1,35.55],[-121.13,35.6],[-121.16,35.63],[-121.2,35.63],[-121.25,35.66],[-121.27,35.66],[-121.31,35.72],[-121.32,35.76],[-121.33,35.79],[-121.37,35.8],[-121.38,35.82],[-121.41,35.84],[-121.44,35.87],[-121.46,35.88],[-121.46,35.9],[-121.47,35.93],[-121.47,35.95],[-121.48,35.97],[-121.49,35.98],[-121.5,36],[-121.52,36.01],[-121.54,36.01],[-121.56,36.02],[-121.58,36.02],[-121.59,36.04],[-121.61,36.08],[-121.66,36.15],[-121.69,36.17],[-121.78,36.22],[-121.81,36.23],[-121.82,36.24],[-121.84,36.25],[-121.84,36.26],[-121.84,36.27],[-121.85,36.28],[-121.86,36.28],[-121.87,36.29],[-121.88,36.3],[-121.88,36.31],[-121.88,36.31],[-121.89,36.32],[-121.9,36.35],[-121.9,36.36],[-121.9,36.41],[-121.91,36.45],[-121.94,36.5],[-121.94,36.51],[-121.94,36.52],[-121.92,36.52],[-121.91,36.53],[-121.92,36.55],[-121.93,36.55],[-121.94,36.56],[-121.95,36.57],[-121.97,36.57],[-121.95,36.61],[-121.94,36.63],[-121.92,36.63],[-121.9,36.63],[-121.89,36.61],[-121.87,36.61],[-121.85,36.62],[-121.84,36.63],[-121.82,36.65],[-121.82,36.67],[-121.81,36.72],[-121.8,36.73],[-121.79,36.73],[-121.76,36.72],[-121.76,36.73],[-121.76,36.74],[-121.76,36.74],[-121.76,36.75],[-121.77,36.75],[-121.78,36.74],[-121.79,36.75],[-121.8,36.75],[-121.78,36.81],[-121.8,36.84],[-121.86,36.93],[-121.89,36.95],[-121.91,36.97],[-121.94,36.96],[-121.98,36.95],[-121.99,36.96],[-122.01,36.96],[-122.04,36.95],[-122.06,36.95],[-122.08,36.95],[-122.1,36.96],[-122.18,36.99],[-122.21,37.02],[-122.26,37.08],[-122.33,37.12],[-122.34,37.13],[-122.34,37.15],[-122.36,37.16],[-122.39,37.18],[-122.41,37.22],[-122.41,37.26],[-122.4,37.3],[-122.39,37.34],[-122.4,37.36],[-122.4,37.38],[-122.41,37.4],[-122.43,37.42],[-122.44,37.44],[-122.45,37.48],[-122.46,37.5],[-122.47,37.5],[-122.49,37.5],[-122.5,37.5],[-122.51,37.51],[-122.52,37.55],[-122.51,37.58],[-122.5,37.61],[-122.49,37.63],[-122.49,37.67],[-122.51,37.71],[-122.51,37.75],[-122.5,37.79],[-122.48,37.8],[-122.46,37.8],[-122.42,37.8],[-122.4,37.8],[-122.39,37.79],[-122.37,37.75],[-122.37,37.74],[-122.37,37.73],[-122.37,37.73],[-122.35,37.73],[-122.37,37.72],[-122.38,37.72],[-122.38,37.71],[-122.39,37.65],[-122.38,37.64],[-122.38,37.62],[-122.38,37.62],[-122.37,37.61],[-122.36,37.6],[-122.35,37.6],[-122.33,37.6],[-122.33,37.59],[-122.32,37.59],[-122.3,37.57],[-122.29,37.57],[-122.26,37.57],[-122.25,37.57],[-122.25,37.55],[-122.24,37.55],[-122.23,37.54],[-122.22,37.54],[-122.21,37.53],[-122.21,37.52],[-122.2,37.51],[-122.18,37.52],[-122.17,37.51],[-122.16,37.5],[-122.15,37.5],[-122.13,37.5],[-122.12,37.48],[-122.11,37.47],[-122.1,37.46],[-122.08,37.45],[-122.06,37.45],[-122.04,37.45],[-122.02,37.46],[-122.04,37.47],[-122.05,37.47],[-122.05,37.47],[-122.05,37.48],[-122.05,37.48],[-122.05,37.49],[-122.06,37.5],[-122.06,37.5],[-122.07,37.5],[-122.09,37.5],[-122.11,37.52],[-122.12,37.54],[-122.16,37.66],[-122.18,37.69],[-122.19,37.7],[-122.2,37.71],[-122.23,37.7],[-122.24,37.71],[-122.23,37.72],[-122.25,37.73],[-122.25,37.73],[-122.21,37.74],[-122.23,37.75],[-122.28,37.77],[-122.3,37.77],[-122.32,37.78],[-122.32,37.8],[-122.31,37.84],[-122.31,37.89],[-122.35,37.91],[-122.39,37.92],[-122.42,37.96],[-122.4,37.96],[-122.38,37.97],[-122.37,37.99],[-122.36,38.01],[-122.36,38.01],[-122.35,38.01],[-122.34,38],[-122.32,38.01],[-122.31,38.01],[-122.26,38.05],[-122.25,38.06],[-122.23,38.06],[-122.21,38.05],[-122.17,38.03],[-122.15,38.02],[-122.12,38.03],[-122.08,38.05],[-122.06,38.06],[-121.93,38.05],[-121.89,38.03],[-121.76,38.02],[-121.72,38.01],[-121.7,38.01],[-121.68,38.02],[-121.71,38.03],[-121.72,38.03],[-121.71,38.03],[-121.71,38.04],[-121.69,38.04],[-121.69,38.04],[-121.68,38.05],[-121.68,38.06],[-121.68,38.07],[-121.68,38.08],[-121.67,38.08],[-121.66,38.09],[-121.64,38.09],[-121.63,38.09],[-121.63,38.09],[-121.62,38.1],[-121.61,38.1],[-121.6,38.09],[-121.59,38.09],[-121.59,38.08],[-121.59,38.07],[-121.55,38.05],[-121.53,38.04],[-121.51,38.04],[-121.5,38.03],[-121.48,38.02],[-121.46,38],[-121.45,38],[-121.45,38],[-121.46,38.02],[-121.48,38.04],[-121.49,38.04],[-121.5,38.05],[-121.57,38.1],[-121.59,38.1],[-121.6,38.11],[-121.63,38.11],[-121.63,38.1],[-121.64,38.09],[-121.64,38.09],[-121.65,38.09],[-121.66,38.1],[-121.66,38.1],[-121.67,38.1],[-121.69,38.08],[-121.69,38.08],[-121.69,38.06],[-121.7,38.05],[-121.72,38.04],[-121.77,38.04],[-121.78,38.04],[-121.78,38.05],[-121.78,38.06],[-121.78,38.06],[-121.77,38.07],[-121.76,38.07],[-121.75,38.08],[-121.74,38.08],[-121.72,38.09],[-121.7,38.11],[-121.69,38.12],[-121.69,38.15],[-121.7,38.15],[-121.73,38.11],[-121.75,38.09],[-121.77,38.08],[-121.81,38.07],[-121.82,38.07],[-121.85,38.08],[-121.87,38.08],[-121.87,38.06],[-121.88,38.06],[-121.9,38.06],[-121.92,38.05],[-121.93,38.06],[-121.92,38.06],[-121.92,38.07],[-121.91,38.08],[-121.96,38.08],[-122,38.09],[-121.99,38.12],[-121.99,38.14],[-122,38.15],[-122.02,38.15],[-122.04,38.14],[-122.06,38.13],[-122.07,38.13],[-122.07,38.12],[-122.08,38.1],[-122.08,38.09],[-122.09,38.09],[-122.12,38.06],[-122.13,38.05],[-122.15,38.05],[-122.17,38.05],[-122.22,38.07],[-122.25,38.07],[-122.26,38.08],[-122.27,38.09],[-122.28,38.1],[-122.3,38.11],[-122.4,38.16],[-122.42,38.13],[-122.44,38.12],[-122.47,38.11],[-122.5,38.11],[-122.5,38.09],[-122.5,38.03],[-122.49,38.01],[-122.46,38],[-122.45,37.99],[-122.48,37.98],[-122.49,37.97],[-122.49,37.96],[-122.48,37.95],[-122.49,37.94],[-122.5,37.94],[-122.5,37.93],[-122.49,37.92],[-122.46,37.9],[-122.45,37.89],[-122.45,37.87],[-122.46,37.87],[-122.47,37.87],[-122.48,37.89],[-122.49,37.88],[-122.48,37.86],[-122.47,37.85],[-122.47,37.83],[-122.48,37.82],[-122.51,37.82],[-122.53,37.82],[-122.55,37.84],[-122.56,37.85],[-122.6,37.87],[-122.63,37.89],[-122.68,37.93],[-122.68,37.91],[-122.68,37.9],[-122.69,37.89],[-122.71,37.9],[-122.73,37.93],[-122.74,37.93],[-122.77,37.94],[-122.78,37.95],[-122.79,37.98],[-122.8,37.99],[-122.81,38],[-122.82,38],[-122.88,38.03],[-122.91,38.05],[-122.93,38.08],[-122.94,38.07],[-122.94,38.06],[-122.95,38.06],[-122.96,38.06],[-122.95,38.05],[-122.94,38.04],[-122.94,38.04],[-122.95,38.03],[-122.96,38.02],[-122.96,38.01],[-122.97,38],[-122.97,38],[-122.98,37.99],[-122.98,37.99],[-122.99,37.99],[-123.02,37.99],[-123.01,38.01],[-122.98,38.04],[-122.95,38.14],[-122.95,38.17],[-122.98,38.23],[-122.96,38.22],[-122.91,38.17],[-122.9,38.16],[-122.89,38.13],[-122.87,38.11],[-122.84,38.09],[-122.83,38.07],[-122.83,38.1],[-122.85,38.12],[-122.89,38.15],[-122.94,38.22],[-122.96,38.24],[-122.97,38.25],[-122.97,38.27],[-122.98,38.28],[-122.99,38.29],[-123.05,38.33],[-123.05,38.3],[-123.05,38.3],[-123.06,38.31],[-123.06,38.36],[-123.09,38.38],[-123.11,38.44],[-123.14,38.47],[-123.26,38.52],[-123.3,38.54],[-123.47,38.72],[-123.5,38.74],[-123.54,38.76],[-123.56,38.78],[-123.57,38.8],[-123.58,38.81],[-123.63,38.84],[-123.7,38.9],[-123.73,38.93],[-123.73,38.96],[-123.72,38.98],[-123.7,38.99],[-123.69,39],[-123.69,39.03],[-123.69,39.04],[-123.7,39.06],[-123.7,39.07],[-123.7,39.1],[-123.7,39.11],[-123.74,39.18],[-123.76,39.19],[-123.77,39.21],[-123.78,39.26],[-123.79,39.28],[-123.8,39.3],[-123.81,39.3],[-123.81,39.32],[-123.82,39.36],[-123.81,39.39],[-123.8,39.46],[-123.79,39.51],[-123.78,39.53],[-123.76,39.54],[-123.76,39.55],[-123.79,39.61],[-123.78,39.68],[-123.79,39.69],[-123.8,39.7],[-123.8,39.71],[-123.81,39.72],[-123.82,39.72],[-123.82,39.73],[-123.83,39.74],[-123.84,39.76],[-123.85,39.81],[-123.85,39.83],[-123.99,39.99],[-124.03,40.01],[-124.04,40.01],[-124.06,40.02],[-124.07,40.02],[-124.07,40.03],[-124.07,40.06],[-124.08,40.06],[-124.12,40.11],[-124.13,40.12],[-124.19,40.15],[-124.32,40.24],[-124.34,40.24],[-124.35,40.25],[-124.36,40.28],[-124.34,40.32],[-124.35,40.35],[-124.38,40.41],[-124.4,40.43],[-124.4,40.44],[-124.39,40.46],[-124.38,40.48],[-124.38,40.49],[-124.38,40.51],[-124.37,40.54],[-124.36,40.56],[-124.35,40.58],[-124.32,40.62],[-124.32,40.63],[-124.32,40.63],[-124.31,40.63],[-124.31,40.64],[-124.31,40.64],[-124.31,40.64],[-124.31,40.65],[-124.31,40.65],[-124.3,40.68],[-124.28,40.7],[-124.25,40.73],[-124.26,40.73],[-124.26,40.71],[-124.26,40.7],[-124.25,40.69],[-124.23,40.68],[-124.22,40.7],[-124.21,40.74],[-124.2,40.75],[-124.18,40.79],[-124.16,40.81],[-124.14,40.81],[-124.11,40.82],[-124.1,40.82],[-124.08,40.85],[-124.08,40.85],[-124.09,40.85],[-124.1,40.85],[-124.15,40.85],[-124.15,40.85],[-124.2,40.79],[-124.21,40.77],[-124.23,40.76],[-124.22,40.79],[-124.18,40.84],[-124.12,40.99],[-124.11,41.01],[-124.12,41.03],[-124.16,41.07],[-124.16,41.09],[-124.16,41.1],[-124.16,41.12],[-124.16,41.13],[-124.14,41.15],[-124.13,41.19],[-124.11,41.22],[-124.09,41.29],[-124.08,41.34],[-124.06,41.4],[-124.06,41.43],[-124.08,41.49],[-124.08,41.52],[-124.07,41.54],[-124.08,41.54],[-124.09,41.55],[-124.1,41.56],[-124.1,41.57],[-124.1,41.58],[-124.1,41.6],[-124.11,41.61],[-124.12,41.62],[-124.13,41.64],[-124.14,41.66],[-124.14,41.68],[-124.14,41.71],[-124.18,41.74],[-124.23,41.77],[-124.27,41.78],[-124.27,41.79],[-124.24,41.81],[-124.21,41.85],[-124.21,41.87],[-124.2,41.96],[-124.2,41.97],[-124.21,41.98],[-124.22,42],[-124.19,42],[-124.19,42],[-123.92,42],[-123.66,42],[-123.4,42],[-123.14,42],[-122.88,42],[-122.62,42],[-122.35,42],[-122.09,42],[-121.83,42],[-121.57,42],[-121.31,42],[-121.05,42],[-120.79,42],[-120.52,42],[-120.26,42],[-120,42],[-120,41.82],[-120,41.63],[-120,41.45],[-120,41.27],[-120,41.08],[-120,40.9]]]} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<meta charset="utf-8"> | |
<style> | |
path { | |
fill: #ccc; | |
stroke: #000; | |
} | |
</style> | |
<body> | |
<script src="//d3js.org/d3.v3.min.js"></script> | |
<script> | |
var width = 960, | |
height = 500; | |
var projection = d3.geo.albers() | |
.rotate([120, 0]) | |
.center([0, 37.7]) | |
.scale(2700); | |
var svg = d3.select("body").append("svg") | |
.attr("width", width) | |
.attr("height", height); | |
d3.json("california.json", function(polygon) { | |
var coordinates0 = polygon.coordinates[0].map(projection), | |
coordinates1 = circle(coordinates0), | |
path = svg.append("path"), | |
d0 = "M" + coordinates0.join("L") + "Z", | |
d1 = "M" + coordinates1.join("L") + "Z"; | |
loop(); | |
function loop() { | |
path | |
.attr("d", d0) | |
.transition() | |
.duration(5000) | |
.attr("d", d1) | |
.transition() | |
.delay(5000) | |
.attr("d", d0) | |
.each("end", loop); | |
} | |
}); | |
function circle(coordinates) { | |
var circle = [], | |
length = 0, | |
lengths = [length], | |
polygon = d3.geom.polygon(coordinates), | |
p0 = coordinates[0], | |
p1, | |
x, | |
y, | |
i = 0, | |
n = coordinates.length; | |
// Compute the distances of each coordinate. | |
while (++i < n) { | |
p1 = coordinates[i]; | |
x = p1[0] - p0[0]; | |
y = p1[1] - p0[1]; | |
lengths.push(length += Math.sqrt(x * x + y * y)); | |
p0 = p1; | |
} | |
var area = polygon.area(), | |
radius = Math.sqrt(Math.abs(area) / Math.PI), | |
centroid = polygon.centroid(-1 / (6 * area)), | |
angleOffset = -Math.PI / 2, // TODO compute automatically | |
angle, | |
i = -1, | |
k = 2 * Math.PI / lengths[lengths.length - 1]; | |
// Compute points along the circle’s circumference at equivalent distances. | |
while (++i < n) { | |
angle = angleOffset + lengths[i] * k; | |
circle.push([ | |
centroid[0] + radius * Math.cos(angle), | |
centroid[1] + radius * Math.sin(angle) | |
]); | |
} | |
return circle; | |
} | |
</script> |
I'm guessing you are using Chrome. The file protocol has more restricted origin rules (at least by default). Try viewing the demo from an apache server running on localhost.
See: http://stackoverflow.com/questions/6060786/file-url-cross-domain-issue-in-chrome-unexpected
@mbostock fixed the TODO in line 73. You may merge with https://gist.github.com/ge045/2e7de433f1d1d5948bbd/revisions
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Hi! I'm new to javascript and I was curious why this, and often many examples I try, do not seem to work when trying it out. The html page is identical code and I have california.json in the same folder. Any thoughts? Thanks.