Last active
December 10, 2015 16:08
-
-
Save embr/4458705 to your computer and use it in GitHub Desktop.
Mobile Page View Fraction
This file contains hidden or 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> | |
| <html lang="en" dir="ltr"> | |
| <head> | |
| <meta http-equiv="content-type" content="text/html; charset=utf-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>Mobile Site Page View Fraction</title> | |
| <style type="text/css"> | |
| body, .ui-widget { | |
| font: 14px Helvetica Neue; | |
| } | |
| svg { | |
| width: 960px; | |
| height: 500px; | |
| border: solid 1px #ccc; | |
| background: #eee; | |
| } | |
| .frame { | |
| stroke: #000; | |
| fill: none; | |
| pointer-events: all; | |
| } | |
| line { | |
| stroke: brown; | |
| stroke-dasharray: 4,2; | |
| } | |
| path { | |
| fill: #ccc; | |
| stroke: #fff; | |
| } | |
| div { | |
| width: 960px; | |
| } | |
| </style> | |
| </head> | |
| <body> | |
| <script src="http://d3js.org/d3.v3.min.js"></script> | |
| <script src="https://raw.github.com/mbostock/d3/master/lib/colorbrewer/colorbrewer.js"></script> | |
| <script type="text/javascript"> | |
| var margin = {top: 0, right: 0, bottom: 0, left: 0}, | |
| width = 960 - margin.left - margin.right, | |
| height = 500 - margin.top - margin.bottom; | |
| // projection fns | |
| var projection = d3.geo.mercator() | |
| .scale(width) | |
| .translate([width / 2, height / 2]); | |
| function move() { | |
| projection.translate(d3.event.translate).scale(d3.event.scale); | |
| feature.attr("d", path); | |
| } | |
| var zoom = d3.behavior.zoom() | |
| .translate(projection.translate()) | |
| .scale(projection.scale()) | |
| .scaleExtent([height, 8 * height]) | |
| .on("zoom", move); | |
| var path = d3.geo.path() | |
| .projection(projection); | |
| var svg = d3.select("body").append("svg") | |
| .attr("width", width + margin.left + margin.right) | |
| .attr("height", height + margin.top + margin.bottom) | |
| .call(zoom); | |
| var g = svg.append("g"), | |
| feature = g.selectAll(".feature"); | |
| //var color = d3.scale.quantize().range([d3.rgb(247,251,255), d3.rgb(222,235,247), d3.rgb(198,219,239), d3.rgb(158,202,225), d3.rgb(107,174,214), d3.rgb(66,146,198), d3.rgb(33,113,181), d3.rgb(8,81,156), d3.rgb(8,48,107)]).domain([0,1]) | |
| var color = d3.scale.quantize().range(colorbrewer.Reds[7]).domain([0,1]) | |
| var formatter = d3.format(',.2%'); | |
| d3.json('world-countries.json', function(loadedFeatures) { | |
| feature = feature | |
| .data(loadedFeatures.features) | |
| .enter().append("path") | |
| .attr("class", "feature") | |
| .attr("d", path); | |
| d3.json('page-view-frac.json', function(loadedData) { | |
| console.log('loaded data: ' + JSON.stringify(loadedData)); | |
| data = loadedData; | |
| svg | |
| .selectAll(".feature") | |
| .style('fill', function(d) { | |
| console.log('data['+d.id+'] = ' + data[d.id]); | |
| return data[d.id] ? color(data[d.id]).toString() : '#000000'; }) | |
| .append("title") | |
| .text(function(d) { | |
| console.log('d.id: '+d.id+', d.properties.name: ' + d.properties.name); | |
| return d.properties.name + ' : ' + (data[d.id] ? formatter(data[d.id]) : 'No Data Available'); | |
| }); | |
| }); | |
| }); | |
| </script> | |
| </body> |
This file contains hidden or 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
| { | |
| "AGO": 0.31990371051912514, | |
| "DZA": 0.03534880765793669, | |
| "EGY": 0.07527709646081537, | |
| "BGD": 0.3616895265956838, | |
| "NER": 0.5777476842749038, | |
| "QAT": 0.1468911984666763, | |
| "SOM": 0.5042116004829608, | |
| "NAM": 0.22002654688107598, | |
| "BGR": 0.05164207233524729, | |
| "BOL": 0.0723637986463806, | |
| "GHA": 0.5673385332304617, | |
| "PAK": 0.18741814096505918, | |
| "CPV": 0.07945883625841939, | |
| "JOR": 0.15363816092682409, | |
| "LBR": 0.5914419423101417, | |
| "LBY": 0.22611545513483375, | |
| "MYS": 0.14153396495557616, | |
| "PRI": 0.21381071502649032, | |
| "MYT": 0.09783651608998377, | |
| "PRK": 0.014455000197216919, | |
| "TZA": 0.5166453015768303, | |
| "BWA": 0.21409653318259383, | |
| "KHM": 0.30699954080242564, | |
| "PRY": 0.16406931379876102, | |
| "HKG": 0.1497636501519115, | |
| "SAU": 0.2733068352389299, | |
| "LBN": 0.24026405160272957, | |
| "SVN": 0.05283132580198714, | |
| "BFA": 0.2729463422299037, | |
| "SVK": 0.05534826375334275, | |
| "MRT": 0.20882198935487417, | |
| "HRV": 0.09767551889376462, | |
| "CHL": 0.11576067845763777, | |
| "CHN": 0.05254941485877572, | |
| "KNA": 0.05337195422920724, | |
| "MAR": 0.10688059003887991, | |
| "GIB": 0.11631415382237022, | |
| "DJI": 0.1134905019051413, | |
| "GIN": 0.29504528102289607, | |
| "FIN": 0.11140259090517943, | |
| "URY": 0.04428688861557987, | |
| "THA": 0.1319738794871658, | |
| "SYC": 0.18003642969588066, | |
| "NPL": 0.2547399826042039, | |
| "LAO": 0.35629616311833723, | |
| "YEM": 0.1970995010943143, | |
| "PHL": 0.08967946340078385, | |
| "ZAF": 0.2657171248096303, | |
| "KIR": 0.1208601761439944, | |
| "MNE": 0.07667854497716682, | |
| "VIR": 0.2293332536276456, | |
| "SYR": 0.2338287929540173, | |
| "MAC": 0.13260045870693565, | |
| "LIE": 0.10759637543202193, | |
| "NIC": 0.08814374888672248, | |
| "KAZ": 0.17357097395545848, | |
| "COK": 0.1332696592264987, | |
| "MNG": 0.0869240453215074, | |
| "PYF": 0.06454719037935125, | |
| "NIU": 0.2272559433840968, | |
| "IRL": 0.241929094515458, | |
| "DMA": 0.034113222455343525, | |
| "BEN": 0.17336808679487184, | |
| "NGA": 0.8560505873529338, | |
| "BEL": 0.06720539701262007, | |
| "DEU": 0.10866669481884181, | |
| "GUM": 0.2298463873350421, | |
| "LKA": 0.19719375192687258, | |
| "FLK": 0.17877821969325686, | |
| "GBR": 0.2755001466747094, | |
| "MWI": 0.7460150256441834, | |
| "CRI": 0.24149809649400353, | |
| "CMR": 0.4854789874721806, | |
| "MNP": 0.0730031487447111, | |
| "LSO": 0.518999271925934, | |
| "UGA": 0.38988948953490377, | |
| "TKM": 0.7054885158157974, | |
| "TTO": 0.07016501515016837, | |
| "WLF": 0.05849203354621562, | |
| "BMU": 0.10201990873673732, | |
| "TCD": 0.9962723865260507, | |
| "GEO": 0.025874347141703606, | |
| "ROU": 0.0849116824393092, | |
| "TCA": 0.05242862783883706, | |
| "MHL": 0.14960394943309058, | |
| "MLI": 0.4837366430151487, | |
| "BLZ": 0.1139933094580864, | |
| "MMR": 0.2698286648874819, | |
| "AFG": 0.1460089530875667, | |
| "BDI": 0.27018966572269776, | |
| "VGB": 0.11721010333433304, | |
| "BLR": 0.13721632642735196, | |
| "GRD": 0.05202660684568408, | |
| "GRC": 0.07105178521028672, | |
| "GRL": 0.11172194687551931, | |
| "AND": 0.07842421430962415, | |
| "MOZ": 0.5381503977676534, | |
| "TJK": 0.4517101973981451, | |
| "HTI": 0.2333524823983355, | |
| "PSE": 0.051046910995861894, | |
| "LCA": 0.062465675189302024, | |
| "IND": 0.27633861696999484, | |
| "VCT": 0.0360156964227254, | |
| "BTN": 0.11876559896098514, | |
| "VNM": 0.15551768190669785, | |
| "NOR": 0.12319921000004394, | |
| "CZE": 0.05696326675382287, | |
| "ATG": 0.05551565157380319, | |
| "FJI": 0.0788646834178272, | |
| "HND": 0.11194007074961167, | |
| "MUS": 0.11250111851673864, | |
| "DOM": 0.08569118290234097, | |
| "LUX": 0.19811616802658563, | |
| "ISR": 0.21806697479882794, | |
| "SMR": 0.02483914099852203, | |
| "PER": 0.05572737825835482, | |
| "REU": 0.11557389710973012, | |
| "IDN": 0.2354415934297907, | |
| "VUT": 0.12346015438072479, | |
| "GNQ": 0.523057393340809, | |
| "SUR": 0.11590187114267661, | |
| "ISL": 0.04085886179406253, | |
| "GLP": 0.18679947208604386, | |
| "GAB": 0.17304095606428063, | |
| "ETH": 0.510255428491163, | |
| "COM": 0.03070661070145856, | |
| "COL": 0.056043774131996536, | |
| "PRT": 0.056742652436331004, | |
| "MDA": 0.060515025835310564, | |
| "GGY": 0.2480037105372919, | |
| "MDG": 0.08478566970689713, | |
| "ECU": 0.06368780974435855, | |
| "SEN": 0.11489203497815734, | |
| "MDV": 0.15595981308530465, | |
| "ASM": 0.24912283943352564, | |
| "SPM": 0.016759939057415785, | |
| "TLS": 0.11551130994992802, | |
| "FRA": 0.1324163391109602, | |
| "LTU": 0.059385378312204834, | |
| "RWA": 0.2644830414437473, | |
| "ZMB": 0.5511208495347993, | |
| "GMB": 0.3924229112027364, | |
| "JEY": 0.15927412216853176, | |
| "FRO": 0.10468323126851155, | |
| "GTM": 0.11962057304126004, | |
| "DNK": 0.1739870948009487, | |
| "ZWE": 0.6935046586202062, | |
| "NLD": 0.14686940183577418, | |
| "AUS": 0.23636636207546222, | |
| "AUT": 0.16785893553501358, | |
| "VEN": 0.07888277633522356, | |
| "KEN": 0.6671715015465352, | |
| "WSM": 0.051658877588872665, | |
| "TUR": 0.11472123853783067, | |
| "JPN": 0.3854969465352786, | |
| "ALB": 0.09940695759124897, | |
| "OMN": 0.2524737381923289, | |
| "ALA": 0.0917390991088347, | |
| "BRN": 0.3722466137943835, | |
| "TUN": 0.08376619282935975, | |
| "RUS": 0.11365766706102852, | |
| "MEX": 0.1359598893920845, | |
| "BRA": 0.07999835416738237, | |
| "CIV": 0.18633321958929047, | |
| "SRB": 0.05880364491879991, | |
| "MKD": 0.05156269280089382, | |
| "USA": 0.25246770531250023, | |
| "IRN": 0.11684563762158838, | |
| "SWE": 0.1766357027523776, | |
| "UKR": 0.10471640333341309, | |
| "SWZ": 0.20224561000699812, | |
| "TON": 0.02237352845100984, | |
| "CAN": 0.2063146068527355, | |
| "KOR": 0.25123629162584693, | |
| "AIA": 0.05374622423463555, | |
| "GUY": 0.023944657038829732, | |
| "CHE": 0.17181310485282728, | |
| "CYP": 0.09113013249478728, | |
| "BIH": 0.0392089015048571, | |
| "SGP": 0.2800653004441388, | |
| "TWN": 0.0687071737106828, | |
| "AZE": 0.14077497008575487, | |
| "UZB": 0.4469674353703475, | |
| "CAF": 0.020428926947114224, | |
| "POL": 0.0586846201397514, | |
| "KWT": 0.3920529664984092, | |
| "NCL": 0.0511846477775417, | |
| "TGO": 0.08671674766799636, | |
| "CYM": 0.07750665310762346, | |
| "EST": 0.058794872013663055, | |
| "ESP": 0.1671834190759781, | |
| "IRQ": 0.11737780720886695, | |
| "SLV": 0.08416435507449344, | |
| "MTQ": 0.10275260939129752, | |
| "LVA": 0.06460791011724411, | |
| "MLT": 0.08048317554531921, | |
| "ABW": 0.13547099531688517, | |
| "SLE": 0.8974245222951439, | |
| "IMN": 0.1798350477514305, | |
| "PAN": 0.12313188940741729, | |
| "SDN": 0.5847597359991742, | |
| "SLB": 0.42417032054381, | |
| "NZL": 0.14253741069604786, | |
| "MCO": 0.15363498930350056, | |
| "ITA": 0.16460998162115595, | |
| "COD": 0.2802749168125049, | |
| "BRB": 0.10468462005330453, | |
| "KGZ": 0.4901986074838058, | |
| "ARM": 0.05173018879970276, | |
| "JAM": 0.08189269507866274, | |
| "FSM": 0.049290331061124036, | |
| "ARE": 0.1405569677966266, | |
| "ARG": 0.06758094812579436, | |
| "BHS": 0.12363205381289022, | |
| "BHR": 0.22662291557782688, | |
| "HUN": 0.0743689397605422, | |
| "PNG": 0.6287070808701777, | |
| "CUB": 0.0 | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment