Skip to content

Instantly share code, notes, and snippets.

@ffflabs
Last active August 29, 2015 14:03
Show Gist options
  • Save ffflabs/c27eefe6c52ae92a2ea4 to your computer and use it in GitHub Desktop.
Save ffflabs/c27eefe6c52ae92a2ea4 to your computer and use it in GitHub Desktop.
D3 vs Google Data Projection

This example shows the county boundaries for Illinois. In red we see the google.maps.Data() layer in blue a D3.geo.path() with mercator projection.

The google data layer is an object which displays in the same canvas as any google overlay (polygons, markers, polylines, etc) while the D3.geo.path() shows up in an SVG container I overlap on top of the google container.

Display the source blob
Display the rendered blob
Raw
{"type":"FeatureCollection","commonproperties":{"weight":1,"icon":"AA88CC","character":"f007","clickable":true,"editable":false},"features":[{"type":"Feature","id":"17185","properties":{"count":1,"id":17185,"name":"Wabash County, IL","area_land":578224657,"area_water":11012015,"state":"IL","lon_google":-87.8392,"lat_google":38.4458,"population":11658},"geometry":{"type":"Polygon","coordinates":[[[-87.958156,38.562535],[-87.956553,38.564091],[-87.957284,38.567051],[-87.953334,38.568432],[-87.953203,38.570194],[-87.651529,38.568166],[-87.652745,38.564459],[-87.650214,38.558421],[-87.650704,38.55624],[-87.665435,38.549946],[-87.670084,38.544133],[-87.660978,38.532145],[-87.656144,38.521668],[-87.646226,38.51509],[-87.645118,38.511109],[-87.650092,38.504606],[-87.656741,38.501757],[-87.663701,38.502931],[-87.671898,38.507611],[-87.682324,38.494618],[-87.693188,38.488038],[-87.714047,38.47988],[-87.740024,38.479223],[-87.744644,38.477266],[-87.750028,38.471427],[-87.756179,38.462538],[-87.755931,38.455876],[-87.751477,38.454213],[-87.740525,38.454716],[-87.735729,38.452986],[-87.731974,38.45078],[-87.730134,38.446518],[-87.730699,38.442908],[-87.738812,38.438929],[-87.74104,38.435576],[-87.745254,38.408996],[-87.779996,38.370842],[-87.786093,38.367649],[-87.806075,38.363143],[-87.813791,38.353792],[-87.822721,38.346912],[-87.832723,38.324853],[-87.833344,38.315649],[-87.830714,38.303073],[-87.831523,38.296727],[-87.836495,38.285486],[-87.840984,38.280105],[-87.85113,38.27512],[-87.856605,38.275522],[-87.861774,38.278637],[-87.866248,38.28998],[-87.860453,38.305372],[-87.86311,38.309823],[-87.868886,38.312277],[-87.875664,38.309931],[-87.879389,38.306507],[-87.887849,38.285299],[-87.897067,38.280134],[-87.906841,38.269634],[-87.91012,38.268108],[-87.917092,38.269701],[-87.91947,38.274547],[-87.917711,38.279351],[-87.908529,38.290957],[-87.907866,38.293176],[-87.909536,38.296061],[-87.916489,38.299372],[-87.931873,38.296498],[-87.937329,38.292431],[-87.940285,38.281064],[-87.950298,38.276792],[-87.952125,38.273763],[-87.950651,38.266819],[-87.948903,38.264116],[-87.942067,38.260301],[-87.94303,38.25779],[-87.956145,38.251652],[-87.958883,38.246666],[-87.95826,38.239022],[-87.964279,38.236297],[-87.9702,38.238623],[-87.970466,38.244568],[-87.981868,38.256444],[-87.990383,38.257998],[-87.992226,38.26281],[-87.991679,38.269815],[-87.988979,38.269015],[-87.990287,38.271166],[-87.988459,38.273731],[-87.984482,38.274328],[-87.979515,38.270965],[-87.978442,38.273895],[-87.9731,38.2744],[-87.97795,38.276733],[-87.975657,38.277879],[-87.977837,38.282456],[-87.97531,38.281427],[-87.974528,38.283945],[-87.970724,38.284839],[-87.968516,38.282848],[-87.966223,38.286236],[-87.961607,38.288641],[-87.960998,38.290999],[-87.958325,38.290358],[-87.955914,38.29187],[-87.951325,38.290291],[-87.95397,38.296745],[-87.957259,38.299672],[-87.952955,38.30304],[-87.957255,38.305649],[-87.954264,38.308328],[-87.948134,38.307436],[-87.94613,38.31016],[-87.948512,38.312517],[-87.946072,38.314738],[-87.949094,38.316889],[-87.946828,38.317187],[-87.947409,38.319362],[-87.949036,38.3184],[-87.950692,38.320162],[-87.949995,38.31872],[-87.954934,38.316866],[-87.958218,38.319452],[-87.955547,38.325472],[-87.957089,38.332522],[-87.954125,38.336208],[-87.954445,38.339733],[-87.95811,38.344448],[-87.958169,38.348133],[-87.967298,38.353556],[-87.968347,38.359186],[-87.973379,38.365458],[-87.973672,38.370539],[-87.977221,38.377839],[-87.976759,38.384271],[-87.973069,38.389353],[-87.964956,38.391072],[-87.965859,38.39533],[-87.972112,38.395008],[-87.976012,38.400614],[-87.970428,38.402218],[-87.970228,38.410641],[-87.965924,38.411237],[-87.959786,38.420073],[-87.955246,38.419865],[-87.95382,38.417667],[-87.952016,38.418423],[-87.950796,38.423278],[-87.955599,38.425248],[-87.951003,38.425913],[-87.947512,38.429438],[-87.951935,38.430033],[-87.952634,38.432047],[-87.950916,38.436752],[-87.947559,38.438261],[-87.949023,38.442098],[-87.946938,38.441101],[-87.944528,38.442955],[-87.944798,38.444609],[-87.948979,38.445555],[-87.944604,38.445805],[-87.94382,38.447041],[-87.946758,38.449124],[-87.942888,38.449629],[-87.944606,38.452534],[-87.948477,38.45393],[-87.943383,38.456197],[-87.947313,38.458531],[-87.94283,38.460019],[-87.941812,38.46224],[-87.94382,38.461324],[-87.945392,38.463933],[-87.948216,38.463521],[-87.944083,38.46739],[-87.947547,38.468352],[-87.945073,38.470481],[-87.945015,38.472564],[-87.948567,38.471396],[-87.948516,38.474915],[-87.950523,38.476319],[-87.947475,38.476306],[-87.94889,38.477914],[-87.948102,38.479087],[-87.953198,38.480254],[-87.951568,38.480803],[-87.953461,38.483824],[-87.949006,38.486274],[-87.951918,38.485358],[-87.9509,38.488586],[-87.955676,38.489661],[-87.955822,38.491561],[-87.953318,38.49314],[-87.956815,38.4971],[-87.954717,38.497878],[-87.955387,38.500496],[-87.952997,38.500764],[-87.953814,38.503945],[-87.947581,38.505891],[-87.948659,38.508592],[-87.949561,38.506418],[-87.952358,38.507631],[-87.950814,38.508638],[-87.953175,38.511247],[-87.948165,38.514244],[-87.955044,38.514723],[-87.953558,38.515569],[-87.95452,38.516507],[-87.953005,38.519619],[-87.949189,38.520283],[-87.949481,38.522137],[-87.947034,38.521747],[-87.941849,38.528248],[-87.937098,38.52818],[-87.938438,38.533537],[-87.941556,38.534019],[-87.939312,38.536355],[-87.941526,38.536195],[-87.941292,38.538622],[-87.944876,38.539607],[-87.943564,38.541416],[-87.952191,38.542926],[-87.950589,38.547527],[-87.952104,38.548442],[-87.952805,38.552837],[-87.954408,38.553294],[-87.952426,38.55691],[-87.954379,38.556956],[-87.953884,38.558741],[-87.958156,38.562535]]]}},{"type":"Feature","id":"17135","properties":{"count":1,"id":17135,"name":"Montgomery County, IL","area_land":1822539574,"area_water":15512965,"state":"IL","lon_google":-89.478,"lat_google":39.2281,"population":30241},"geometry":{"type":"Polygon","coordinates":[[[-89.699258,39.069851],[-89.703692,39.34803],[-89.699094,39.348049],[-89.701645,39.523369],[-89.533655,39.524592],[-89.530836,39.348864],[-89.139807,39.348888],[-89.140076,39.217907],[-89.250513,39.217512],[-89.250447,39.028145],[-89.586088,39.028246],[-89.586148,38.999449],[-89.698555,38.998979],[-89.699258,39.069851]]]}},{"type":"Feature","id":"17067","properties":{"count":1,"id":17067,"name":"Hancock County, IL","area_land":2055740577,"area_water":53535828,"state":"IL","lon_google":-91.168,"lat_google":40.4058,"population":19061},"geometry":{"type":"Polygon","coordinates":[[[-91.136591,40.63745],[-91.02263,40.634946],[-90.915013,40.637687],[-90.904216,40.639201],[-90.911969,40.193088],[-91.505346,40.200486],[-91.507269,40.209338],[-91.504282,40.224299],[-91.505828,40.238839],[-91.502551,40.244379],[-91.497496,40.248236],[-91.490524,40.259498],[-91.493061,40.275262],[-91.490971,40.283364],[-91.48245,40.300583],[-91.471826,40.31734],[-91.466603,40.334461],[-91.46214,40.342414],[-91.446308,40.361823],[-91.441586,40.365372],[-91.426632,40.371988],[-91.415051,40.381747],[-91.396996,40.383127],[-91.384201,40.38643],[-91.375712,40.391925],[-91.372921,40.399108],[-91.372826,40.414279],[-91.380965,40.435395],[-91.381769,40.442555],[-91.378144,40.456394],[-91.366463,40.478869],[-91.36391,40.490122],[-91.364211,40.500043],[-91.369059,40.512532],[-91.384531,40.530948],[-91.404125,40.539127],[-91.406202,40.542698],[-91.406373,40.551831],[-91.401482,40.559458],[-91.379752,40.57445],[-91.359873,40.601805],[-91.353989,40.606553],[-91.306568,40.626219],[-91.247851,40.63839],[-91.218437,40.638437],[-91.197906,40.636107],[-91.185295,40.637803],[-91.136591,40.63745]]]}},{"type":"Feature","id":"17025","properties":{"count":1,"id":17025,"name":"Clay County, IL","area_land":1212958836,"area_water":3278251,"state":"IL","lon_google":-88.4823,"lat_google":38.7468,"population":13926},"geometry":{"type":"Polygon","coordinates":[[[-88.698087,38.649585],[-88.693531,38.914617],[-88.559457,38.915063],[-88.361745,38.910847],[-88.36176,38.851949],[-88.258608,38.847521],[-88.257774,38.730977],[-88.283589,38.731801],[-88.282216,38.731252],[-88.284117,38.727636],[-88.286951,38.728003],[-88.28254,38.725759],[-88.285814,38.720221],[-88.28149,38.720563],[-88.28672,38.716903],[-88.285436,38.715712],[-88.282193,38.716604],[-88.284589,38.713698],[-88.283655,38.711478],[-88.285817,38.711364],[-88.282138,38.707838],[-88.285906,38.707565],[-88.284096,38.705459],[-88.286199,38.704269],[-88.284067,38.702666],[-88.286287,38.701591],[-88.281296,38.695961],[-88.28518,38.694291],[-88.28159,38.690216],[-88.285182,38.689187],[-88.283313,38.688271],[-88.283869,38.686395],[-88.281417,38.683556],[-88.284338,38.681543],[-88.277888,38.675339],[-88.279321,38.669663],[-88.276256,38.669433],[-88.272053,38.663599],[-88.275467,38.661815],[-88.274356,38.660144],[-88.276488,38.659642],[-88.273035,38.658048],[-88.27395,38.656164],[-88.276579,38.655545],[-88.275148,38.654422],[-88.284467,38.649888],[-88.284089,38.648514],[-88.290686,38.643756],[-88.286716,38.64284],[-88.293195,38.641904],[-88.297397,38.634568],[-88.28871,38.629731],[-88.288702,38.628376],[-88.292323,38.627324],[-88.29174,38.625905],[-88.286551,38.624625],[-88.284038,38.62643],[-88.280803,38.624567],[-88.286406,38.62049],[-88.285969,38.619117],[-88.282265,38.616896],[-88.278852,38.61701],[-88.278646,38.620672],[-88.276401,38.61884],[-88.278094,38.616712],[-88.277277,38.615522],[-88.273075,38.619366],[-88.269312,38.618449],[-88.271794,38.614376],[-88.271066,38.611721],[-88.26669,38.612474],[-88.262783,38.610276],[-88.263163,38.60833],[-88.259138,38.608878],[-88.260102,38.606475],[-88.252256,38.605442],[-88.25182,38.603519],[-88.248732,38.601823],[-88.250395,38.600062],[-88.271227,38.599416],[-88.584533,38.607427],[-88.698457,38.606304],[-88.698087,38.649585]]]}},{"type":"Feature","id":"17165","properties":{"count":1,"id":17165,"name":"Saline County, IL","area_land":983746300,"area_water":18008552,"state":"IL","lon_google":-88.545,"lat_google":37.7517,"population":25037},"geometry":{"type":"Polygon","coordinates":[[[-88.707213,37.753854],[-88.706622,37.906797],[-88.37453,37.907678],[-88.373782,37.729762],[-88.375332,37.599563],[-88.708546,37.599277],[-88.707213,37.753854]]]}},{"type":"Feature","id":"17183","properties":{"count":1,"id":17183,"name":"Vermilion County, IL","area_land":2326763518,"area_water":7534496,"state":"IL","lon_google":-87.7268,"lat_google":40.1868,"population":81968},"geometry":{"type":"Polygon","coordinates":[[[-87.52801,40.388508],[-87.531759,40.144273],[-87.533228,39.883],[-87.581553,39.88229],[-87.557513,39.868719],[-87.617424,39.868489],[-87.615182,39.88163],[-87.937645,39.879803],[-87.942103,40.225482],[-87.92876,40.225619],[-87.932858,40.399401],[-87.93168,40.3994],[-87.935309,40.485923],[-87.652132,40.488212],[-87.526366,40.491237],[-87.52801,40.388508]]]}},{"type":"Feature","id":"17029","properties":{"count":1,"id":17029,"name":"Coles County, IL","area_land":1316459195,"area_water":4631834,"state":"IL","lon_google":-88.2208,"lat_google":39.5137,"population":53976},"geometry":{"type":"Polygon","coordinates":[[[-88.472073,39.651588],[-88.063437,39.652555],[-88.063467,39.681313],[-88.026208,39.681665],[-88.026224,39.684867],[-87.9666,39.685928],[-87.960179,39.481309],[-88.014205,39.480762],[-88.012066,39.378971],[-88.026526,39.378707],[-88.026521,39.377627],[-88.203341,39.374765],[-88.47083,39.374515],[-88.472073,39.651588]]]}},{"type":"Feature","id":"17115","properties":{"count":1,"id":17115,"name":"Macon County, IL","area_land":1503973612,"area_water":13409460,"state":"IL","lon_google":-88.9615,"lat_google":39.8602,"population":110936},"geometry":{"type":"Polygon","coordinates":[[[-88.921087,39.652682],[-89.139125,39.655131],[-89.141817,39.80091],[-89.157625,39.803532],[-89.18797,39.817815],[-89.196821,39.815165],[-89.20818,39.815019],[-89.208245,39.812526],[-89.210517,39.810916],[-89.217523,39.813224],[-89.217846,39.91699],[-89.143457,39.91792],[-89.144764,40.048853],[-89.028993,40.04984],[-88.803035,40.055341],[-88.745164,40.055191],[-88.745671,39.792146],[-88.75866,39.792067],[-88.75784,39.739907],[-88.812709,39.740486],[-88.810575,39.653222],[-88.921087,39.652682]]]}},{"type":"Feature","id":"17055","properties":{"count":1,"id":17055,"name":"Franklin County, IL","area_land":1059021059,"area_water":58413412,"state":"IL","lon_google":-88.9262,"lat_google":37.9918,"population":39709},"geometry":{"type":"Polygon","coordinates":[[[-89.139797,38.043746],[-89.138134,38.044323],[-89.138474,38.047263],[-89.134943,38.044815],[-89.133262,38.04728],[-89.130701,38.047334],[-89.134127,38.048806],[-89.132635,38.054604],[-89.131106,38.054943],[-89.13155,38.052176],[-89.126924,38.053011],[-89.127388,38.05537],[-89.12508,38.054871],[-89.122675,38.056458],[-89.123315,38.058889],[-89.121181,38.057626],[-89.118396,38.059422],[-89.121928,38.061317],[-89.11897,38.061438],[-89.117138,38.063264],[-89.118617,38.065011],[-89.118488,38.062835],[-89.123557,38.063677],[-89.118875,38.067041],[-89.122507,38.068912],[-89.122903,38.070783],[-89.118404,38.070011],[-89.120326,38.071322],[-89.118725,38.072497],[-89.120809,38.073356],[-89.119025,38.074318],[-89.119404,38.07731],[-89.12272,38.082294],[-89.122055,38.083261],[-89.119439,38.081831],[-89.120819,38.084946],[-89.115469,38.085679],[-89.119232,38.090291],[-89.115371,38.094098],[-89.11793,38.09631],[-89.12667,38.098146],[-89.128662,38.100889],[-89.135023,38.101789],[-89.137616,38.104847],[-89.133897,38.105822],[-89.131289,38.103582],[-89.132072,38.10654],[-89.129194,38.109423],[-89.129837,38.112045],[-89.131836,38.112897],[-89.129253,38.116812],[-89.130648,38.115963],[-89.132138,38.118667],[-89.129228,38.122773],[-89.129637,38.124747],[-88.851704,38.126617],[-88.704606,38.125195],[-88.70676,37.863338],[-89.151176,37.861999],[-89.150834,37.950196],[-89.177597,37.950311],[-89.178343,37.95225],[-89.16521,37.954887],[-89.16189,37.957356],[-89.160714,37.961914],[-89.155147,37.967469],[-89.153739,37.977983],[-89.149474,37.979776],[-89.149827,37.98225],[-89.145778,37.985725],[-89.146626,37.988839],[-89.143513,37.990096],[-89.142992,37.994049],[-89.140162,37.995454],[-89.141599,37.997129],[-89.140199,37.999371],[-89.143012,38.001538],[-89.14238,38.004114],[-89.145244,38.009229],[-89.144582,38.011124],[-89.140146,38.012867],[-89.140499,38.01597],[-89.136072,38.01803],[-89.13684,38.021557],[-89.138468,38.022172],[-89.138252,38.025349],[-89.143018,38.025983],[-89.142422,38.02913],[-89.144397,38.028667],[-89.146861,38.031137],[-89.139054,38.033834],[-89.140476,38.035998],[-89.13638,38.039944],[-89.139797,38.043746]]]}},{"type":"Feature","id":"17147","properties":{"count":1,"id":17147,"name":"Piatt County, IL","area_land":1137477981,"area_water":723468,"state":"IL","lon_google":-88.5923,"lat_google":40.0091,"population":16892},"geometry":{"type":"Polygon","coordinates":[[[-88.463345,40.171072],[-88.462328,39.79182],[-88.745671,39.792146],[-88.745344,40.098813],[-88.688122,40.098583],[-88.687993,40.142269],[-88.574885,40.281501],[-88.460418,40.281935],[-88.46072,40.223322],[-88.46366,40.223352],[-88.463345,40.171072]]]}},{"type":"Feature","id":"17153","properties":{"count":1,"id":17153,"name":"Pulaski County, IL","area_land":515887805,"area_water":10473599,"state":"IL","lon_google":-89.1278,"lat_google":37.2156,"population":6148},"geometry":{"type":"Polygon","coordinates":[[[-89.021611,37.306661],[-89.018265,37.309146],[-89.009336,37.310718],[-89.002739,37.311148],[-88.998034,37.307859],[-88.992108,37.309899],[-88.973702,37.303618],[-88.968813,37.303278],[-88.964363,37.300517],[-88.963578,37.29738],[-88.962343,37.299093],[-88.961248,37.297624],[-88.959571,37.298834],[-88.954814,37.297702],[-88.951081,37.300885],[-88.942478,37.303953],[-88.929789,37.303323],[-88.928004,37.226376],[-88.942018,37.228874],[-88.932754,37.225299],[-88.952791,37.224783],[-88.973,37.228531],[-88.966634,37.230153],[-88.976262,37.229553],[-88.979792,37.226113],[-88.988155,37.223732],[-88.979728,37.226616],[-88.976969,37.229503],[-88.980367,37.22905],[-89.000185,37.224764],[-89.013154,37.216478],[-89.029866,37.211065],[-89.086712,37.165451],[-89.09368,37.155074],[-89.099011,37.140406],[-89.111409,37.118988],[-89.115678,37.115674],[-89.109613,37.12292],[-89.125628,37.10863],[-89.135404,37.103092],[-89.137582,37.09815],[-89.14206,37.093806],[-89.146495,37.090819],[-89.154346,37.08896],[-89.172081,37.06831],[-89.174338,37.070254],[-89.179637,37.06909],[-89.184635,37.079056],[-89.193534,37.085005],[-89.19721,37.085808],[-89.195219,37.08741],[-89.196038,37.088847],[-89.201416,37.08848],[-89.202797,37.085723],[-89.225332,37.091824],[-89.232873,37.090061],[-89.235626,37.093036],[-89.239688,37.092481],[-89.237708,37.094768],[-89.240673,37.096983],[-89.242161,37.09492],[-89.244137,37.100738],[-89.24882,37.098765],[-89.253973,37.099393],[-89.252994,37.101725],[-89.254084,37.103464],[-89.258477,37.102697],[-89.261779,37.105742],[-89.261153,37.10807],[-89.265853,37.111274],[-89.265396,37.113394],[-89.262843,37.112587],[-89.262606,37.114562],[-89.266992,37.115716],[-89.265318,37.117368],[-89.269463,37.118627],[-89.267948,37.120401],[-89.272739,37.124216],[-89.273631,37.126968],[-89.268562,37.133275],[-89.26723,37.139329],[-89.25788,37.14527],[-89.260033,37.152015],[-89.256793,37.161144],[-89.261523,37.158943],[-89.268372,37.158917],[-89.269454,37.16089],[-89.267296,37.161398],[-89.266673,37.16352],[-89.262897,37.163708],[-89.261211,37.167304],[-89.262478,37.170751],[-89.26675,37.171074],[-89.263452,37.175209],[-89.265874,37.175969],[-89.26465,37.178718],[-89.26731,37.180525],[-89.26529,37.18429],[-89.261049,37.18301],[-89.257911,37.184203],[-89.258392,37.185482],[-89.255923,37.188113],[-89.252273,37.188597],[-89.251919,37.190892],[-89.255905,37.193041],[-89.253335,37.193567],[-89.252329,37.196127],[-89.257724,37.198922],[-89.258135,37.195731],[-89.260386,37.197415],[-89.260235,37.200069],[-89.262765,37.201536],[-89.259272,37.202335],[-89.263896,37.203947],[-89.259947,37.206242],[-89.261295,37.208132],[-89.259092,37.210314],[-89.260264,37.211222],[-89.261071,37.209748],[-89.264571,37.212361],[-89.262209,37.213924],[-89.261279,37.220051],[-89.264591,37.222608],[-89.266158,37.222034],[-89.265202,37.223759],[-89.267811,37.225999],[-89.263782,37.226577],[-89.261321,37.231147],[-89.259548,37.229852],[-89.261502,37.227169],[-89.25639,37.2277],[-89.257809,37.229023],[-89.255039,37.232136],[-89.250367,37.243318],[-89.250005,37.247717],[-89.251543,37.249658],[-89.249675,37.248793],[-89.248364,37.251164],[-89.251706,37.25232],[-89.24828,37.254494],[-89.250683,37.25655],[-89.247464,37.258549],[-89.248501,37.260086],[-89.245884,37.264004],[-89.241619,37.264931],[-89.242283,37.266522],[-89.237889,37.270874],[-89.227912,37.273329],[-89.227238,37.275537],[-89.221906,37.277435],[-89.220702,37.27933],[-89.210601,37.280268],[-89.202578,37.290066],[-89.203356,37.306757],[-89.205882,37.317242],[-89.208873,37.318909],[-89.207012,37.321988],[-89.215618,37.324463],[-89.217129,37.327137],[-89.222218,37.329461],[-89.222867,37.332184],[-89.243803,37.331669],[-89.248439,37.335109],[-89.099277,37.333556],[-89.044787,37.329846],[-89.044588,37.294163],[-89.031646,37.298565],[-89.021611,37.306661]]]}},{"type":"Feature","id":"17179","properties":{"count":1,"id":17179,"name":"Tazewell County, IL","area_land":1681105109,"area_water":22941950,"state":"IL","lon_google":-89.5163,"lat_google":40.5081,"population":136313},"geometry":{"type":"Polygon","coordinates":[[[-89.678856,40.552838],[-89.675404,40.553938],[-89.655602,40.570438],[-89.654002,40.578238],[-89.65879,40.589174],[-89.66007,40.596454],[-89.658502,40.601558],[-89.636401,40.623238],[-89.622148,40.634897],[-89.611459,40.64791],[-89.610339,40.65199],[-89.616035,40.657571],[-89.615399,40.664437],[-89.5923,40.684936],[-89.555295,40.702737],[-89.546488,40.720205],[-89.550594,40.738737],[-89.554994,40.747637],[-89.330167,40.748257],[-89.329614,40.660774],[-89.327343,40.615566],[-89.269831,40.616097],[-89.26374,40.325344],[-89.714927,40.319218],[-89.717104,40.435655],[-89.828484,40.43438],[-89.92468,40.435921],[-89.914278,40.440345],[-89.906449,40.447759],[-89.903269,40.459205],[-89.898815,40.462574],[-89.89687,40.467161],[-89.88793,40.474656],[-89.884358,40.500039],[-89.882194,40.505402],[-89.875111,40.511743],[-89.867037,40.51598],[-89.812459,40.541104],[-89.774495,40.552911],[-89.741322,40.550806],[-89.707817,40.557238],[-89.699,40.561606],[-89.691848,40.560518],[-89.683656,40.553046],[-89.678856,40.552838]]]}},{"type":"Feature","id":"17073","properties":{"count":1,"id":17073,"name":"Henry County, IL","area_land":2131552409,"area_water":6861752,"state":"IL","lon_google":-90.1308,"lat_google":41.35,"population":50607},"geometry":{"type":"Polygon","coordinates":[[[-89.984559,41.149366],[-90.208888,41.152156],[-90.437657,41.151252],[-90.43193,41.456834],[-90.421129,41.457634],[-90.404229,41.464834],[-90.387328,41.476434],[-90.380382,41.476675],[-90.376528,41.478734],[-90.373028,41.484634],[-90.369427,41.496734],[-90.364227,41.502834],[-90.352231,41.508832],[-90.333889,41.514085],[-90.318733,41.508898],[-90.315059,41.509204],[-90.304716,41.517791],[-90.289224,41.520334],[-90.250123,41.522755],[-90.225842,41.529917],[-90.222459,41.53557],[-90.219018,41.5372],[-90.195324,41.540686],[-90.184991,41.555457],[-90.179328,41.572367],[-90.180052,41.578716],[-90.185609,41.584653],[-89.862351,41.584005],[-89.859197,41.518725],[-89.857406,41.518189],[-89.857567,41.234907],[-89.867738,41.23443],[-89.868384,41.148955],[-89.984559,41.149366]]]}},{"type":"Feature","id":"17113","properties":{"count":1,"id":17113,"name":"McLean County, IL","area_land":3064861297,"area_water":7562638,"state":"IL","lon_google":-88.8445,"lat_google":40.4946,"population":172359},"geometry":{"type":"Polygon","coordinates":[[[-89.265024,40.398465],[-89.269371,40.594368],[-89.133752,40.596734],[-89.134217,40.61149],[-89.101134,40.612326],[-89.101569,40.625036],[-89.044368,40.627428],[-89.04532,40.663939],[-88.9847,40.664954],[-88.986896,40.752297],[-88.584272,40.757608],[-88.582355,40.670792],[-88.575216,40.670616],[-88.574502,40.61655],[-88.459475,40.617345],[-88.460418,40.281935],[-89.052067,40.283159],[-89.26265,40.280919],[-89.265024,40.398465]]]}},{"type":"Feature","id":"17009","properties":{"count":1,"id":17009,"name":"Brown County, IL","area_land":791518279,"area_water":4139308,"state":"IL","lon_google":-90.7503,"lat_google":39.9621,"population":6943},"geometry":{"type":"Polygon","coordinates":[[[-90.683193,39.840051],[-90.893651,39.84092],[-90.916609,39.845075],[-90.91681,39.909606],[-90.914289,39.934335],[-90.913616,40.104452],[-90.796246,40.105768],[-90.695884,40.103794],[-90.699928,40.09445],[-90.708594,40.093077],[-90.70916,40.090423],[-90.704513,40.087816],[-90.705525,40.084591],[-90.695637,40.079583],[-90.671995,40.08013],[-90.67152,40.077362],[-90.676762,40.065994],[-90.674798,40.062151],[-90.677567,40.059887],[-90.675484,40.057073],[-90.678045,40.051904],[-90.67507,40.045979],[-90.669446,40.043783],[-90.667243,40.04655],[-90.661022,40.046388],[-90.659535,40.044833],[-90.659745,40.041402],[-90.652127,40.04005],[-90.653887,40.033441],[-90.645646,40.030327],[-90.633952,40.029222],[-90.630387,40.023664],[-90.625127,40.025997],[-90.616688,40.027008],[-90.611664,40.032912],[-90.606782,40.028865],[-90.605679,40.025114],[-90.607282,40.020836],[-90.611296,40.017564],[-90.614035,40.020353],[-90.616921,40.020512],[-90.619029,40.015159],[-90.618015,40.012392],[-90.615814,40.012759],[-90.601947,40.003317],[-90.60758,39.98191],[-90.585534,39.97883],[-90.568214,39.983815],[-90.561553,39.982625],[-90.550344,39.983448],[-90.543596,39.980359],[-90.541455,39.980724],[-90.539313,39.98372],[-90.53414,39.98246],[-90.529947,39.985112],[-90.527956,39.982458],[-90.524864,39.982709],[-90.523614,39.984218],[-90.527478,39.986644],[-90.526585,39.98765],[-90.520727,39.988311],[-90.519926,39.98568],[-90.515705,39.984352],[-90.513747,39.987891],[-90.510442,39.971987],[-90.511115,39.967605],[-90.52063,39.959527],[-90.525596,39.9517],[-90.532113,39.946012],[-90.536591,39.932898],[-90.53686,39.921881],[-90.538637,39.917479],[-90.55428,39.901364],[-90.57179,39.89427],[-90.575581,39.891261],[-90.5849,39.875047],[-90.586091,39.871413],[-90.582435,39.854574],[-90.579426,39.848489],[-90.571754,39.839326],[-90.683193,39.840051]]]}},{"type":"Feature","id":"17057","properties":{"count":1,"id":17057,"name":"Fulton County, IL","area_land":2241881220,"area_water":43973316,"state":"IL","lon_google":-90.2023,"lat_google":40.4652,"population":37054},"geometry":{"type":"Polygon","coordinates":[[[-90.447745,40.457112],[-90.444343,40.714667],[-89.986068,40.712257],[-89.989018,40.625835],[-89.873506,40.624588],[-89.874444,40.581587],[-89.872018,40.580559],[-89.872463,40.513127],[-89.882194,40.505402],[-89.884358,40.500039],[-89.88793,40.474656],[-89.89687,40.467161],[-89.898815,40.462574],[-89.903269,40.459205],[-89.906449,40.447759],[-89.916814,40.438716],[-89.939375,40.430152],[-89.955176,40.420184],[-89.975352,40.404473],[-89.983758,40.392636],[-89.994911,40.390669],[-90.006442,40.385213],[-90.033026,40.377806],[-90.03795,40.375041],[-90.044791,40.36743],[-90.051649,40.352177],[-90.052796,40.347476],[-90.049853,40.337406],[-90.053106,40.327925],[-90.065122,40.319194],[-90.06871,40.313888],[-90.06874,40.2961],[-90.094072,40.268895],[-90.107293,40.2609],[-90.120734,40.233],[-90.127482,40.22697],[-90.136,40.223197],[-90.157961,40.219655],[-90.168589,40.21345],[-90.176293,40.199921],[-90.183633,40.194496],[-90.193528,40.192075],[-90.199556,40.183945],[-90.335663,40.187723],[-90.451502,40.188892],[-90.447745,40.457112]]]}},{"type":"Feature","id":"17053","properties":{"count":1,"id":17053,"name":"Ford County, IL","area_land":1257719883,"area_water":1640286,"state":"IL","lon_google":-88.2246,"lat_google":40.5965,"population":14116},"geometry":{"type":"Polygon","coordinates":[[[-88.236292,40.67502],[-88.2473,40.99456],[-88.131938,40.997839],[-88.125611,40.763403],[-88.122983,40.691153],[-88.121233,40.676697],[-88.118317,40.575168],[-88.117905,40.488086],[-88.004076,40.488672],[-87.9926,40.485568],[-87.935309,40.485923],[-87.93168,40.3994],[-88.116616,40.400612],[-88.459957,40.39885],[-88.459475,40.617345],[-88.234949,40.618166],[-88.236292,40.67502]]]}},{"type":"Feature","id":"17151","properties":{"count":1,"id":17151,"name":"Pope County, IL","area_land":955110213,"area_water":14328502,"state":"IL","lon_google":-88.5424,"lat_google":37.4172,"population":4445},"geometry":{"type":"Polygon","coordinates":[[[-88.709456,37.516338],[-88.708546,37.599277],[-88.412112,37.599912],[-88.415081,37.424105],[-88.435439,37.418356],[-88.452786,37.41112],[-88.466709,37.40045],[-88.47409,37.391863],[-88.482726,37.363896],[-88.48472,37.345135],[-88.512263,37.297096],[-88.515745,37.284604],[-88.514137,37.279498],[-88.510009,37.27559],[-88.506797,37.265018],[-88.50394,37.264621],[-88.509295,37.262067],[-88.512154,37.263789],[-88.511313,37.261336],[-88.507062,37.259689],[-88.487794,37.244507],[-88.479442,37.228795],[-88.472536,37.220503],[-88.457752,37.21277],[-88.448016,37.203403],[-88.437983,37.180086],[-88.433374,37.16314],[-88.424841,37.15267],[-88.429877,37.137503],[-88.44325,37.111363],[-88.443471,37.108729],[-88.440674,37.108993],[-88.445776,37.099683],[-88.444583,37.096419],[-88.445614,37.093332],[-88.460119,37.074576],[-88.482624,37.067257],[-88.490411,37.068579],[-88.490336,37.159358],[-88.563451,37.216412],[-88.71065,37.33709],[-88.709456,37.516338]]]}},{"type":"Feature","id":"17005","properties":{"count":1,"id":17005,"name":"Bond County, IL","area_land":984918708,"area_water":6426353,"state":"IL","lon_google":-89.4366,"lat_google":38.8859,"population":17662},"geometry":{"type":"Polygon","coordinates":[[[-89.639265,38.999129],[-89.586148,38.999449],[-89.586088,39.028246],[-89.250447,39.028145],[-89.250364,38.999031],[-89.2574,38.999151],[-89.254237,38.742019],[-89.481857,38.740531],[-89.597321,38.743236],[-89.599593,38.87453],[-89.636874,38.874278],[-89.639265,38.999129]]]}},{"type":"Feature","id":"17083","properties":{"count":1,"id":17083,"name":"Jersey County, IL","area_land":956433045,"area_water":20324176,"state":"IL","lon_google":-90.3614,"lat_google":39.0802,"population":23229},"geometry":{"type":"Polygon","coordinates":[[[-90.592165,39.086765],[-90.603261,39.110695],[-90.603569,39.117592],[-90.597072,39.127327],[-90.599044,39.133274],[-90.597959,39.136752],[-90.591526,39.138332],[-90.589382,39.141169],[-90.584654,39.142165],[-90.582803,39.144327],[-90.583187,39.149154],[-90.587213,39.154873],[-90.585364,39.161553],[-90.581753,39.164845],[-90.576524,39.164708],[-90.575199,39.167836],[-90.575904,39.173084],[-90.582106,39.176927],[-90.578699,39.179897],[-90.580587,39.184895],[-90.57334,39.184097],[-90.574699,39.179075],[-90.573452,39.177489],[-90.566406,39.180031],[-90.566396,39.181521],[-90.570421,39.182625],[-90.567272,39.183395],[-90.567823,39.191636],[-90.565678,39.193741],[-90.561892,39.190653],[-90.565377,39.187435],[-90.56409,39.184293],[-90.557767,39.188482],[-90.545806,39.19017],[-90.546248,39.184242],[-90.543389,39.183297],[-90.540927,39.189529],[-90.536991,39.193002],[-90.532737,39.187489],[-90.528473,39.188366],[-90.529221,39.191626],[-90.526816,39.192449],[-90.52301,39.187053],[-90.520365,39.188024],[-90.507508,39.185193],[-90.50286,39.180941],[-90.505821,39.172916],[-90.503963,39.170907],[-90.502799,39.164259],[-90.495793,39.160235],[-90.487879,39.164074],[-90.48634,39.170056],[-90.48749,39.175133],[-90.313531,39.17428],[-90.314071,39.225053],[-90.201769,39.225497],[-90.203608,39.25842],[-90.194655,39.258402],[-90.194701,39.261966],[-90.148069,39.261947],[-90.146299,39.174289],[-90.145991,39.000046],[-90.273686,38.999347],[-90.275812,38.923548],[-90.309454,38.92412],[-90.333533,38.933489],[-90.346442,38.94079],[-90.392721,38.959071],[-90.407537,38.962706],[-90.42978,38.963778],[-90.439203,38.967287],[-90.467766,38.969208],[-90.487225,38.967729],[-90.500117,38.963064],[-90.515163,38.954615],[-90.519644,38.953943],[-90.534657,38.958499],[-90.543172,38.964698],[-90.564634,38.986513],[-90.571561,38.996096],[-90.576101,39.009383],[-90.575916,39.017616],[-90.573724,39.02344],[-90.575404,39.033032],[-90.578977,39.038918],[-90.588094,39.045747],[-90.589849,39.049501],[-90.58923,39.054337],[-90.584068,39.058712],[-90.581194,39.064414],[-90.58927,39.076036],[-90.592165,39.086765]]]}},{"type":"Feature","id":"17023","properties":{"count":1,"id":17023,"name":"Clark County, IL","area_land":1298666557,"area_water":8806917,"state":"IL","lon_google":-87.7917,"lat_google":39.3324,"population":16189},"geometry":{"type":"Polygon","coordinates":[[[-87.903872,39.482225],[-87.688972,39.487392],[-87.687437,39.48734],[-87.689166,39.476758],[-87.53164,39.477105],[-87.531646,39.347888],[-87.537271,39.352089],[-87.544013,39.352907],[-87.548157,39.34988],[-87.550832,39.342378],[-87.5544,39.340488],[-87.560692,39.338851],[-87.572132,39.341444],[-87.578331,39.340343],[-87.589084,39.333831],[-87.60592,39.311076],[-87.620589,39.307046],[-87.620939,39.303407],[-87.617786,39.301257],[-87.605348,39.303217],[-87.597946,39.299479],[-87.597545,39.296388],[-87.609767,39.284714],[-87.608543,39.277187],[-87.601393,39.27439],[-87.605574,39.262398],[-87.604947,39.260212],[-87.592394,39.247146],[-87.588339,39.248703],[-87.584177,39.254004],[-87.580652,39.255237],[-87.573439,39.254582],[-87.571321,39.25082],[-87.573074,39.246693],[-87.579319,39.243552],[-87.574615,39.223931],[-87.574558,39.218404],[-87.577029,39.211123],[-87.584977,39.205276],[-87.585725,39.200396],[-87.588614,39.197824],[-87.603045,39.191304],[-87.606293,39.18513],[-87.613064,39.18418],[-87.619603,39.186032],[-87.621436,39.181943],[-87.619404,39.172066],[-87.620521,39.17033],[-87.63649,39.168833],[-87.640434,39.166727],[-87.642065,39.162477],[-87.640856,39.159867],[-87.628727,39.157427],[-87.657032,39.157594],[-87.656794,39.172177],[-87.747113,39.172296],[-87.746174,39.17922],[-88.007766,39.173925],[-88.014205,39.480762],[-87.903872,39.482225]]]}},{"type":"Feature","id":"17011","properties":{"count":1,"id":17011,"name":"Bureau County, IL","area_land":2250785701,"area_water":11578410,"state":"IL","lon_google":-89.5284,"lat_google":41.4013,"population":35183},"geometry":{"type":"Polygon","coordinates":[[[-89.741359,41.23393],[-89.857798,41.234483],[-89.856613,41.317295],[-89.857406,41.518189],[-89.859197,41.518725],[-89.862351,41.584005],[-89.166561,41.585289],[-89.163705,41.310187],[-89.172539,41.30846],[-89.200556,41.312072],[-89.224854,41.3131],[-89.256436,41.322182],[-89.268851,41.32182],[-89.283466,41.312385],[-89.334901,41.300877],[-89.339754,41.298275],[-89.342397,41.292761],[-89.337083,41.281667],[-89.348372,41.258936],[-89.356671,41.233235],[-89.466534,41.233873],[-89.466421,41.148558],[-89.638429,41.148591],[-89.638864,41.233862],[-89.741359,41.23393]]]}},{"type":"Feature","id":"17035","properties":{"count":1,"id":17035,"name":"Cumberland County, IL","area_land":896203131,"area_water":2531272,"state":"IL","lon_google":-88.2406,"lat_google":39.2731,"population":11171},"geometry":{"type":"Polygon","coordinates":[[[-88.471139,39.272968],[-88.47083,39.374515],[-88.203341,39.374765],[-88.026521,39.377627],[-88.026526,39.378707],[-88.012121,39.378968],[-88.007766,39.173925],[-88.260512,39.170921],[-88.470865,39.171463],[-88.471139,39.272968]]]}},{"type":"Feature","id":"17037","properties":{"count":1,"id":17037,"name":"DeKalb County, IL","area_land":1635095920,"area_water":8665640,"state":"IL","lon_google":-88.769,"lat_google":41.8946,"population":105856},"geometry":{"type":"Polygon","coordinates":[[[-88.60362,41.719546],[-88.60224,41.631389],[-88.706158,41.630189],[-88.818462,41.631352],[-88.938618,41.628319],[-88.940317,41.716772],[-88.94166,41.717503],[-88.942292,42.000028],[-88.942146,42.06505],[-88.938935,42.065097],[-88.939732,42.15232],[-88.588657,42.15359],[-88.58833,42.066462],[-88.601958,42.066469],[-88.601933,41.719563],[-88.60362,41.719546]]]}},{"type":"Feature","id":"17159","properties":{"count":1,"id":17159,"name":"Richland County, IL","area_land":932423038,"area_water":4884901,"state":"IL","lon_google":-88.0857,"lat_google":38.7116,"population":16166},"geometry":{"type":"Polygon","coordinates":[[[-88.023341,38.849726],[-87.908113,38.850107],[-87.909847,38.589995],[-87.910258,38.575074],[-87.912351,38.569909],[-88.02397,38.570552],[-88.147773,38.569039],[-88.148044,38.597988],[-88.253851,38.599502],[-88.248732,38.601503],[-88.25217,38.603885],[-88.251935,38.605213],[-88.260102,38.606475],[-88.259138,38.608878],[-88.263163,38.60833],[-88.262783,38.610276],[-88.26669,38.612474],[-88.271416,38.612087],[-88.271326,38.615932],[-88.269312,38.618449],[-88.273075,38.619366],[-88.277277,38.615522],[-88.278094,38.616712],[-88.276401,38.61884],[-88.278646,38.620672],[-88.278414,38.617216],[-88.282265,38.616896],[-88.286611,38.620056],[-88.280803,38.624567],[-88.284038,38.62643],[-88.286551,38.624625],[-88.29247,38.626546],[-88.288702,38.628376],[-88.28871,38.629731],[-88.297369,38.63447],[-88.295239,38.636709],[-88.295822,38.638265],[-88.293312,38.639867],[-88.293195,38.641904],[-88.286804,38.642748],[-88.290686,38.643756],[-88.284089,38.648514],[-88.284467,38.649888],[-88.275148,38.654422],[-88.276579,38.655545],[-88.27395,38.656164],[-88.273035,38.658048],[-88.276488,38.659642],[-88.274356,38.660144],[-88.275467,38.661815],[-88.272053,38.663599],[-88.276256,38.669433],[-88.279321,38.669663],[-88.277888,38.675339],[-88.284338,38.681543],[-88.281417,38.683556],[-88.283869,38.686395],[-88.283313,38.688271],[-88.285182,38.689187],[-88.28159,38.690216],[-88.28518,38.694291],[-88.281296,38.695961],[-88.286287,38.701591],[-88.284067,38.702666],[-88.286199,38.704269],[-88.284096,38.705459],[-88.2859
<!DOCTYPE html>
<html>
<meta charset="utf-8">
<head>
<style>
.counties {
fill: none;
stroke: #00c;
}
.states {
fill: none;
stroke: #fff;
stroke-linejoin: round;
}
#thissvg {
position:absolute;
left:0;
top:0;
z-index: 50;
}
#map-canvas {
position:absolute;
left:0;
top:0;
z-index: 30;
}
.q0-9 { fill:rgb(247,251,255); }
.q1-9 { fill:rgb(222,235,247); }
.q2-9 { fill:rgb(198,219,239); }
.q3-9 { fill:rgb(158,202,225); }
.q4-9 { fill:rgb(107,174,214); }
.q5-9 { fill:rgb(66,146,198); }
.q6-9 { fill:rgb(33,113,181); }
.q7-9 { fill:rgb(8,81,156); }
.q8-9 { fill:rgb(8,48,107); }
</style>
<body>
<script src="http://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
<script src="http://d3js.org/d3.v3.min.js"></script>
<script src="http://d3js.org/queue.v1.min.js"></script>
<script>
var width = 900,
height = 600,
globalOverlay = null,
map = null;
var url = 'illinois.json';
jQuery(document).ready(function() {
jQuery('#map-canvas').width(width);
jQuery('#map-canvas').height(height);
});
function initialize() {
map = new google.maps.Map(document.getElementById('map-canvas'), {
zoom: 9,
maxZoom:9,
minZoom:9,
center: {lat: 41, lng: -89.5}
});
map.data.loadGeoJson(url);
var featureStyle = {
fillColor: 'transparent',
strokeWeight: 2,
strokeColor: 'red'
};
map.data.setStyle(featureStyle);
var projection=projection=d3.geo.mercator()
.scale(40.5 * Math.pow(2, map.getZoom()))
.translate([0,0]);
var path = d3.geo.path().projection(projection);
var g_= d3.select('#thissvg')
.attr("width", 900)
.attr("height", 600)
.append("g")
.attr("class", "counties")
.attr("id","pathgroup");
function ready(error, us) {
console.log(us);
g_.selectAll("path")
.data(us.features)
.enter().append("path")
.attr("d", path);
var centerPixel = projection([map.getCenter().lng(), map.getCenter().lat()]);
var translate = [(width / 2 - centerPixel[0]), (height / 2 - centerPixel[1])];
d3.select("#pathgroup").attr("transform", "translate(" + translate + ")scale(1)");
}
queue()
.defer(d3.json, url)
.await(ready);
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
</head>
<body>
<svg id="thissvg"/>
<div id="map-canvas"></div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment