29:null 2a:["$","title",null,{"children":"RIPE Atlas min RTT: Root Servers | Agustín | Observable"}] 2f:Tdfa,map = { const circle = d3.geoCircle(), svg = d3 .create("svg") .attr("width", width) .attr("height", Math.ceil((width * screen.height) / screen.width)); var center = projection([0, 0]); const path = d3.geoPath().projection(projection); const topg = svg.append("g").attr("class", "topg"); // water topg .append('rect') .attr('width', width) .attr('height', Math.ceil((width * screen.height) / screen.width)) .attr('fill', '#CFDCDE'); // landmass topg .selectAll("path") .data(land.features) .enter() .append("path") .attr("d", path) .attr("fill", "white") .attr("stroke", "#999") .attr("stroke-width", "0.5px"); // .on("click", d => console.log(d)); // country borders topg .selectAll("path") .data(borders.features) .enter() .append("path") .attr("d", path) .attr("fill", "none") .attr("stroke", "#B8B8B8") .attr("stroke-width", "0.5px"); let hexes; let first_pass = true; const zoom = d3 .zoom() .scaleExtent([1, 32]) .on('zoom', () => { // called on onzoom event const { transform } = d3.event; let bounds = topg.node().getBoundingClientRect(); // console.log(bounds); first_pass = false; // map lines also get thinner as we zoom in topg.selectAll("path").attr("stroke-width", .5 / transform.k); topg.attr('transform', transform); let hexbin = d3 .hexbin() .extent([[0, 0], [width, height]]) .radius(2 / transform.k) .x(d => d.latlon[0]) .y(d => d.latlon[1]); let min_rtts_with_geo_hex = Object.assign( hexbin(min_rtts_with_geo) .map(d => ((d.min_rtt = d3.median(d, d => d.min_rtt)), d)) .sort((a, b) => b.prb_id - a.prb_id), { title: "Median RTT" } ); let p95 = d3.quantile(min_rtts_with_geo_hex.map(hex => hex.length), .98); hexes.selectAll("path").remove(); hexes .selectAll("path") .data( min_rtts_with_geo_hex.filter(hex => { let [x, y] = projection([hex.y, hex.x]); return true; //x > (-bounds.left + bounds.width / 2) / transform.k; }) ) .join("path") .attr("transform", d => { let [x, y] = projection([d.y, d.x]); return `translate(${x},${y})`; }) .attr("d", d => hexbin.hexagon( (d.length <= p95 ? probeScale(p95)(d.length) : probeScale(p95)(p95)) / transform.k ) ) // 5 .attr("fill", d => color(d.min_rtt)) .attr("stroke", d => d3.lab(color(d.min_rtt)).darker()) .attr("stroke-width", 1.2 / transform.k) .on("mouseover", d => { mutable current_hexbin = d; mutable hover = d.min_rtt; }) .on("mouseout", () => { mutable hover = null; }) .append("title") .text(d => `${d.length.toLocaleString()} probes`); }); hexes = topg.append("g"); svg.call(zoom); // by this point we've got all of our drawing // definitions inside the 'zoom' callback, so // we need to fake a 0-factor zoom event to // get things painted for the first time svg.transition().call(zoom.scaleBy, document.fullscreenElement ? 2 : 0); // return svg.node(); return Object.assign(svg.node(), { zoomIn: () => svg.transition().call(zoom.scaleBy, 2), zoomOut: () => svg.transition().call(zoom.scaleBy, 0.5) // zoomRandom: random, // zoomReset: reset }); }30:[{"id":"1a8bde0512edac0aa5cde4f5c6f78a385bfda9a806bef75dc34b1b485ce1bcaeda01651c5588a109d381892b0e098ec2e13ac5f74b6582d48f419b9d7f3da2dc","href":"https://static.observableusercontent.com/files/1a8bde0512edac0aa5cde4f5c6f78a385bfda9a806bef75dc34b1b485ce1bcaeda01651c5588a109d381892b0e098ec2e13ac5f74b6582d48f419b9d7f3da2dc","name":"20210518.json","type":"application/json","lastModified":1626447541125.45,"size":19441264}] 2d:{"id":"6d20b78669c348aa","slug":"ripe-atlas-min-rtt-root-servers","title":"RIPE Atlas min RTT: Root Servers","thumbnail":"d6f25667d066169039dfa1054494f53a488399fa0afd40b85def575745e2105c","access_level":"public","create_time":"$D2021-07-16T14:59:01.125Z","update_time":"$D2022-06-17T13:00:58.419Z","view_time":null,"first_public_time":"$D2021-07-16T19:05:48.640Z","has_unpublished_edits":null,"fork":{"id":"dbc3e84b546e60f5","slug":"ripe-atlas-min-rtt-hexbin","title":"Atlas Latency World Map","owner":{"id":"010c865511f6456b","login":"aguformoso","name":"Agustín"}},"stars":0,"starred":false,"owner":{"type":"team","id":"010c865511f6456b","login":"aguformoso","name":"Agustín","avatar_url":"https://avatars-next.observableusercontent.com/53cf33361eaefc9362737a393fb7bd266ef237b7ea7a4e377a830bb5f0c263ca","tier":"starter_2024"},"version":3386,"publish_version":3386,"role":null,"authored":false,"authors":[{"type":"individual","id":"de0d99ff05bbda21","login":"aguformoso","name":"Agustín","avatar_url":"https://avatars-next.observableusercontent.com/53cf33361eaefc9362737a393fb7bd266ef237b7ea7a4e377a830bb5f0c263ca","tier":null}],"members":[{"type":"individual","id":"de0d99ff05bbda21","login":"aguformoso","name":"Agustín","avatar_url":"https://avatars-next.observableusercontent.com/53cf33361eaefc9362737a393fb7bd266ef237b7ea7a4e377a830bb5f0c263ca","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":{"id":"c4ac57fca16f9eea","slug":"ripe-atlas","title":"RIPE Atlas","owner":{"id":"010c865511f6456b","login":"aguformoso","name":"Agustín"}},"type":"notebook","body":{"title":"RIPE Atlas min RTT: Root Servers","cells":[{"id":0,"value":"md`# RIPE Atlas min RTT: Root Servers`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3196,"value":"viewof asn = Inputs.text({\n label: \"Root Servers\",\n placeholder: \"comma-separated list of root servers\",\n submit: true,\n type: 'text',\n value: 'a,b,c,d,e,f,g,h,i,j,k,l,m',\n width: `35em`\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3230,"value":"viewof idServer = Inputs.text({\n label: \"id.server to look for\",\n placeholder: \"e.g.: ns2.de-fra.k.ripe.net, k.ripe.net, de-fra\",\n submit: true,\n type: 'text',\n value: '',\n width: `35em`\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2101,"value":"viewof max_rtt = Inputs.text({\n label: 'Max RTT to show',\n submit: true,\n type: 'number',\n step: 10,\n value: 200\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2290,"value":"viewof min_rtt = Inputs.text({\n label: 'Min RTT to show',\n submit: true,\n type: 'number',\n step: 10,\n value: 0\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3285,"value":"viewof date = Inputs.text({\n type: 'date',\n label: 'Choose a date',\n value: yesterday\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3255,"value":"viewof af = Inputs.select(['IPv4', 'IPv6', 'Both'], {\n label: 'Address family to show',\n value: 'Both'\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1745,"value":"output = md`${\n hover\n ? 'Latency on this hexbin: ' +\n current_hexbin.min_rtt.toFixed(2) +\n ' ms (min.)'\n : 'Try hovering over the map...'\n}\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3136,"value":"md`## World map\nThis map bins probe data (${\n min_rtts_with_geo.length\n} results) into hexbins, and computes the minimum for the ${\n asn.split(',').length\n} Root Servers you have chosen.\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2908,"value":"fullscreen = {\n const button = html`\n// \n// \n// `;\n// form.in.onclick = () => map.zoomIn();\n// form.out.onclick = () => map.zoomOut();\n// // form.random.onclick = () => map.zoomRandom();\n// // form.reset.onclick = () => map.zoomReset();\n// return form;\n// }","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3286,"value":"yesterday = {\n let a = new Date();\n a.setDate(a.getDate() - 1);\n return a.toISOString().split(\"T\")[0];\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1386,"value":"all_probes = FileAttachment(\"20210518.json\").json()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1376,"value":"probe_to_latlon = Object.fromEntries(\n all_probes.objects.map(p => [p.id, [p.latitude, p.longitude]])\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3063,"value":"_min_rtts_with_geo = [\n ...(await Promise.all(\n asn.split(\",\").map((asn) => {\n let [yyyy, m, d] = date.split(\"-\");\n let urlLocator = date === \"\" ? \"latest\" : `${yyyy}/${m}/${d}`;\n return fetch(\n `https://storage.googleapis.com/ripencc_public/rd/min-rtt-by-root-server/${urlLocator}/${asn}.json`\n // `https://rd-gcp-cdn.ripe.net/rd/min-rtt-by-root-server/${urlLocator}/${asn}.json`\n ).then((r) => (r.status === 200 ? r.json() : []));\n })\n ))\n].reduce((acc, curr) => acc.concat(curr))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2107,"value":"min_rtts_with_geo = _min_rtts_with_geo\n .filter(o => (max_rtt > 0 ? o.min_rtt < max_rtt : true))\n .filter(o => (min_rtt > 0 ? o.min_rtt > min_rtt : true))\n .filter(o => o.id_server.includes(idServer))\n .filter(\n o =>\n af.includes('Both') ||\n (af.includes('4') && o.dst_addr.includes('.')) ||\n (af.includes('6') && o.dst_addr.includes(':'))\n )\n .map(o => {\n o.latlon = probe_to_latlon[o.prb_id];\n return o;\n })\n .filter(o => o.latlon !== undefined && o.latlon[0] !== null)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2155,"value":"color = d3.scaleSequential(\n d3.extent(min_rtts_with_geo, d => d.min_rtt),\n d3.interpolateYlOrBr\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":695,"value":"md`\n\nend of notebook\n\n---\n\n## Aux. functions supporting this notebook:\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1741,"value":"mutable hover = 0","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2982,"value":"mutable current_hexbin = []","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1326,"value":"height = Math.ceil((width * screen.height) / screen.width) // screen.height //width * (9 / 16)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":394,"value":"// colorScale = d3\n// .scaleOrdinal()\n// .domain(a.density_thresholds)\n// // .range(a.quantz.slice(-23))\n// .range(a.quantz)\ncolorScale = a.colorScale","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3340,"value":"probeScale = (maxProbes = 100) =>\n d3\n .scaleLinear()\n .domain([0, maxProbes])\n .range([2, 5.0])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":81,"value":"a = {\n let colors = [\"#ffffd4\", \"#fe9929\", \"#8c2d04\"];\n\n let density_thresholds = d3.range(0, 1, .1);\n let linearColorScale = d3\n .scaleLinear()\n .domain(d3.range(0, 1, 1 / colors.length))\n .range(colors);\n\n let quantz = d3.quantize(linearColorScale, density_thresholds.length + 1);\n return {\n quantz: quantz,\n density_thresholds: density_thresholds,\n colorScale: linearColorScale\n // contours: contours,\n // contour_data: contour_data,\n // gridPoints: gridPoints\n };\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":6,"value":"projection = {\n return (\n d3\n // .geoOrthographic()\n // .geoMercator()\n .geoEqualEarth()\n .scale(200)\n .translate([width / 2, height / 2]) // w, h\n // .precision(20)\n );\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2,"value":"d3 = require(\"d3@5\", \"d3-geo-projection@2\", \"d3-geo-polygon@1\", \"d3-array@^2.1\", \"d3-geo\", \"d3-hexbin@0.2\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":20,"value":"topojson = require(\"topojson@3\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":15,"value":"land = topojson.feature(world, world.objects.land)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":17,"value":"world = fetch(\n `https://cdn.jsdelivr.net/npm/world-atlas@2/countries-110m.json`\n).then(response => response.json())","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3350,"value":"borders = topojson.feature(world, world.objects.countries)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1717,"value":"import { ramp, swatches } from \"@d3/working-with-color\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":152,"value":"import {\n sum_array,\n miliseconds_to_radius\n} from \"@aguformoso/multilateration-from-your-browser\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W30","stdlib":"1","titling":"auto"}} 2e:"$2d:body"