2a:null 2b:["$","title",null,{"children":"Internet outages as seen by RIPE Atlas | Internet Data Junkie | Observable"}] 30:T552,viewof object = multi_form(html`

Select probes through one of the following:

The latest input you "focus" on is the one that gets submitted.

Location and radius around	${query.radius \|\| defaults.radius} km
ASN
Country code(s)

`)31:T66c,addTooltips( Plot.plot({ height: 200, width, marginLeft: margin.left, marginRight: 50, // ?? x: { label: "Date/Time (UTC)", grid: true}, y: { grid: true, label: "Connected RIPE Atlas probes" }, color: { range: selected_tags.length ? [hi_color, lo_color] : ["steelblue"] }, marks: [ Plot.ruleY([0]), Plot.dot( selected_tags.length ? timeline.filter( (tl) => tl.tags === "tagged" || tl.tags === "untagged" ) : timeline.filter((tl) => tl.tags === ""), { x: (d) => new Date(d.date * 1000), y: (d) => d.value, strokeOpacity: 0, title: (d) => "Date: " + new Date(d.date * 1000 ).toISOString() + "\nCount: " + d.value } ), Plot.line( selected_tags.length ? timeline.filter( (tl) => tl.tags === "tagged" || tl.tags === "untagged" ) : timeline.filter((tl) => tl.tags === ""), { x: (d) => new Date(d.date * 1000), y: (d) => d.value, // z: (d) => (d.tags === "untagged" ? 0 : 1), stroke: "tags", } ), Plot.areaY( selected_tags.length ? [] /* timeline.filter( (tl) => tl.tags === "tagged" || tl.tags === "untagged" // coloring/stacking doesn't work intuitively. probably because it is not intuitive anymore to fill the area (confusion between stacked and unstacked ) */ : timeline.filter((tl) => tl.tags === ""), { x: (d) => new Date(d.date * 1000), y: (d) => d.value, fill: "tags", opacity: 0.3 } ) ] }) )32:T55e,chart = { const svg = d3.select(DOM.svg(size.width, size.height)); // hook on the mutable object // this way we're able to paint on every change on _ // using statuses alone is not enough _; svg .append("g") .attr("stroke-width", 10) .attr("pointer-events", "all") .selectAll("rect") .data( statuses .flat() .filter(s => s.status === state_to_show) .sort(sortBy.function) ) .join("rect") .attr("fill", d => { if (selected_tags.length && d.tags) { if ( d.tags.find(t => selected_tags.find(selected_t => selected_t === t)) ) { return hi_color; } else if (lowlight) { return lo_color; } } return interpolator(parseInt(d.asn_v4)); }) .attr("x", d => xScale(d.start)) .attr("y", d => yScale(d.prb_id) + 2) .attr("width", d => { return xScale(d.end) - xScale(d.start); }) .attr("height", 6); // x-axis is defined in timeline chart (right below) // svg // .append('g') // .attr('transform', `translate(0, ${size.height - margin.bottom})`) // .call(xAxis) // .selectAll("text") // .attr("transform", t => "rotate(-45)") // .attr("dx", "-3.5em"); svg .append('g') .attr('transform', `translate(${margin.left}, 0)`) .call(yAxis); return svg.node(); }33:T576,// The different options for sorting that'll be available for the user sorts = { let sorts = [ { name: "Probe ID", ids: ["probeid", "probe", "id"], function: (s1, s2) => parseInt(s1.prb_id) - parseInt(s2.prb_id) }, { name: "ASN (v4)", ids: ["asn4"], function: (s1, s2) => s1.asn_v4 - s2.asn_v4 }, { name: "ASN (v4 preferred)", ids: ["asn46"], function: (s1, s2) => (s1.asn_v4 ? s1.asn_v4 : s1.asn_v6) - (s2.asn_v4 ? s2.asn_v4 : s2.asn_v6) }, { name: "ASN (v6 preferred)", ids: ["asn64"], function: (s1, s2) => (s1.asn_v6 ? s1.asn_v6 : s1.asn_v4) - (s2.asn_v6 ? s2.asn_v6 : s2.asn_v4) }, { name: "ASN (v6)", ids: ["asn6"], function: (s1, s2) => s1.asn_v6 - s2.asn_v6 }, { name: "Country code", ids: ["country", "countrycode", "cc"], function: (s1, s2) => s1.country_code !== undefined && s2.country_code !== undefined ? s1.country_code.localeCompare(s2.country_code) : 0 }, { name: "Prefix size", ids: ["pfx_size"], function: (s1, s2) => s1.prefix_v4_size - s2.prefix_v4_size } ]; //link asn --> asn46 sorts.push({ name: "ASN", ids: ["asn"], function: sorts.filter(s => s.ids.indexOf('asn46') >= 0)[0].function }); return sorts; }34:T62f,probe_objects = { let probes, url; let chosen_input = object['last-used']; if (chosen_input === 'location' || chosen_input === 'radius') { mutable description = `Fetching probes in ${object.radius} km around ${object.location}`; url = `https://atlas.ripe.net:443/api/v2/probes/?radius=${coordinates[1]},${coordinates[0]}:${object.radius}`; } else if (chosen_input == 'asn_v4') { mutable description = `Fetching probes in AS${object.asn_v4}`; url = `https://atlas.ripe.net:443/api/v2/probes/?asn=${object.asn_v4}`; } else if (chosen_input == 'country') { mutable description = `Fetching probes in ${object.country}`; url = `https://atlas.ripe.net:443/api/v2/probes/?country_code__in=${object.country}`; } probes = await paginated_fetch(url); let abandoned = []; for (let chunk of chunks(probes, 5)) { let probes_info = await Promise.all( chunk.map(p => fetch(`https://atlas.ripe.net:443/api/v2/probes/${p.id}`).then(r => r.json() ) ) ); // .concat fails :( abandoned.push(...probes_info); } // we drop probes that don't apply for this time window return abandoned.filter( status => !( // abandoned before time window ( (status.status.name === "Abandoned" && new Date(status.status.since) < new Date(start)) || // never connected status.status.name === "Never Connected" || // first connected after time window new Date(status.first_connected * 1000) > new Date(stop) ) ) ); }35:T45d,// the blue timeline timeline = range( _start.getTime() / 1000, d3.min([_stop, nowFixed]).getTime() / 1000 - 10, // $until -10 seconds, otherwise there's always a drop to 0 on $now - ε resolution ) .map(ts => { // we trigger this with the _ mutable counter; _; // we simply... count! let filtered = statuses .flat() .filter( status => status.start <= ts && ts <= status.end && status.status === state_to_show ); let tagged = filtered.filter(status => status.tags.find(tag => selected_tags.find(selected_tag => selected_tag === tag) ) ); let untagged = filtered.filter( status => !status.tags.find(tag => selected_tags.find(selected_tag => selected_tag === tag) ) ); return [ { date: ts, value: filtered.length, tags: "" }, { date: ts, value: tagged.length, tags: "tagged" }, { date: ts, value: untagged.length, tags: "untagged" } ]; }) .flat()36:T905,mutable statuses = Object.entries(groupBy(connections, 'prb_id')).map( ([prb_id, conn_result]) => { mutable description = `Recreating connection states for ${prb_id}`; let probe = probe_objects.filter(p => p.id === parseInt(prb_id))[0]; let conns_sorted = conn_result.sort(sortByTimestamp); // sequential pass over timestamps // and interpolating connection state let state = (event1, event2) => event1 === "connect" && event2 === "disconnect" ? "up" : "down"; let flip = event => (event === "connect" ? "disconnect" : "connect"); let prefix_v4_size = probe.prefix_v4 ? 2 ** (32 - parseInt(probe.prefix_v4.split('/')[1])) : 0; let res = []; // let's fake the first status let r = { start: _start.getTime() / 1000, //Math.min(...timestamps), end: conns_sorted[0].timestamp, status: state(flip(conns_sorted[0].event), conns_sorted[0].event), prb_id: prb_id, asn_v4: probe.asn_v4, prefix_v4: probe.prefix_v4, prefix_v4_size: prefix_v4_size, country_code: probe.country_code, tags: probe.tags.map(t => t.slug) }; res.push(r); for (let i = 0; i < conns_sorted.length; i++) { let start = conns_sorted[i]; let end = conns_sorted[i + 1]; if (!start || !end) continue; let status = { start: start.timestamp, end: end.timestamp, status: state(start.event, end.event), prb_id: prb_id, asn_v4: probe.asn_v4, prefix_v4: probe.prefix_v4, prefix_v4_size: prefix_v4_size, country_code: probe.country_code, tags: probe.tags.map(t => t.slug) }; res.push(status); } // let's fake the last status until $stop or until $now, whichever happens first let fakeStop = d3.min([new Date(_stop.getTime()), nowFixed]).getTime() / 1000; const last = conns_sorted[conns_sorted.length - 1]; let s = { start: last.timestamp, end: fakeStop, status: state(last.event, flip(last.event)), prb_id: prb_id, asn_v4: probe.asn_v4, prefix_v4: probe.prefix_v4, prefix_v4_size: prefix_v4_size, country_code: probe.country_code, tags: probe.tags.map(t => t.slug) }; res.push(s); mutable _ += 1; return res; } )37:T857,// for those probes having 100% uptime (no connection change) // in the selected time period, we'll need to fake the status // same for 100% downtime { let out_of_scope = probe_objects.filter( p => !statuses .flat() .map(s => parseInt(s.prb_id)) .includes(p.id) ); console.log('out_of_scope', out_of_scope); // look for connection logs up to 10 weeks back in time let current_batch = out_of_scope; // let next_batch = []; let t1 = new Date(start).getTime(); let t2 = new Date(stop).getTime(); let dt = t2 - t1; for (let num_weeks = 1; num_weeks <= periods; num_weeks++) { mutable description = `Calculating connection state for ${current_batch.length} probes (looking ${num_weeks} periods back)`; let next_batch = []; // chunks(current_batch,5) let promises = current_batch.map(async p => { let t0 = new Date(t1 - num_weeks * dt); let url = `https://atlas.ripe.net:443/api/v2/measurements/7000/results/?start=${ t0.toISOString().split("T")[0] }T00:00&stop=${ new Date(t2).toISOString().split("T")[0] }T00:00&probe_ids=${p.id}`; let conns = await cached_fetch(url); console.log(url); conns = conns.sort(sortByTimestamp); let s; if (conns.length > 0) { let c = conns[conns.length - 1]; let prefix_v4_size = p.prefix_v4 ? 2 ** (32 - parseInt(p.prefix_v4.split('/')[1])) : 0; let s = { start: _start.getTime() / 1000, //Math.min(...timestamps), end: d3.min([nowFixed, _stop]).getTime() / 1000, //Math.max(...timestamps), status: event2state(c.event), prb_id: p.id, asn_v4: p.asn_v4, prefix_v4: p.prefix_v4, prefix_v4_size: prefix_v4_size, country_code: p.country_code, tags: p.tags.map(t => t.slug) }; mutable statuses.push([s]); mutable _ += 1; } else { next_batch.push(p); } return s; }); await Promise.all(promises); current_batch = [...next_batch]; } mutable description = `Done.`; }38:T677,// This is a soft fork from // @forresto/form-input-with-submit and // @mbostock/form-input function multi_form(form) { const container = html`

${form}`; form.addEventListener("submit", (event) => { event.preventDefault(); container.value = formValue(form); container.dispatchEvent(new CustomEvent("input")); }); form.addEventListener("input", (event) => { /// // console.log(event, event.srcElement); let name = event.srcElement.name; let value = event.srcElement.value; // fix here let label = event.path[1].getElementsByTagName("label")[0]; // we store in a hidden input element // the name of the last used input // let last_used = Object.values(form) // .filter((element) => element.tagName === "INPUT") // .filter((input) => input.name === "last-used")[0]; // last_used.value = name; if (name === "radius") { label.innerHTML = `${value} km`; } else if (name === "asn_v4") { } event.preventDefault(); // Need this, because otherwise the viewof Generator catches bubbling input events event.stopPropagation(); }); Object.values(form) .filter((element) => element.tagName === "INPUT") .filter((input) => input.name != "last-used" && input.name != "") .map((e) => { e.addEventListener("focus", (event) => { let name = event.srcElement.name; let last_used = Object.values(form) .filter((element) => element.tagName === "INPUT") .filter((input) => input.name === "last-used")[0]; last_used.value = name; console.log(last_used); }); }); return container; }39:[] 2e:{"id":"600eef1570a76a39","slug":"internet-outages-as-seen-by-ripe-atlas","title":"Internet outages as seen by RIPE Atlas","thumbnail":"541f1a2265ce4ae3c4fa77f60201bbea8e6fc63a359b32455adbe16e1708c63f","access_level":"unlisted","create_time":"$D2022-01-10T05:32:52.258Z","update_time":"$D2022-02-18T15:38:56.680Z","view_time":null,"first_public_time":null,"fork":{"id":"e72076c2aa1d73fa","slug":"internet-outages-as-seen-by-ripe-atlas","title":"Internet outages as seen by RIPE Atlas","owner":{"id":"010c865511f6456b","login":"aguformoso","name":"Agustín"}},"stars":0,"starred":false,"owner":{"type":"team","id":"23328ee42edf752e","login":"emileaben","name":"Internet Data Junkie","avatar_url":"https://avatars-next.observableusercontent.com/91b8e6deef097a85b812418ddf7e25b26a4ecd12a94c994e793b4864077027a4","tier":"starter_2024"},"version":5685,"publish_version":5685,"role":null,"authored":false,"authors":[{"type":"individual","id":"aa2453518a8bf7d2","login":"emileaben","name":"Internet Data Junkie","avatar_url":"https://avatars-next.observableusercontent.com/91b8e6deef097a85b812418ddf7e25b26a4ecd12a94c994e793b4864077027a4","tier":null}],"members":[{"type":"individual","id":"aa2453518a8bf7d2","login":"emileaben","name":"Internet Data Junkie","avatar_url":"https://avatars-next.observableusercontent.com/91b8e6deef097a85b812418ddf7e25b26a4ecd12a94c994e793b4864077027a4","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"subscribed":null,"forks":2,"collection":null,"type":"notebook","body":{"title":"Internet outages as seen by RIPE Atlas","cells":[{"id":0,"value":"md`# Internet outages as seen by RIPE Atlas\nThis is a work in progress, inspired by the [Probe Connects](https://github.com/emileaben/resource-gnuplotter) tool.\n[RIPE Atlas](https://atlas.ripe.net/) has many measurement nodes worldwide that are connected to the Internet, and submit measurement results to our back-end servers. In this visualisation we show what the connectivity between these measurement nodes (RIPE Atlas probes) and our back-end servers can tell us about the connectivity of parts of the Internet to the rest of the Internet.\n\nSee [here](https://observablehq.com/@emileaben/ripe-atlas-controllers-status) to try to figure out if any signal you see might have been caused by maintenance/outages on the RIPE Atlas controller infrastructure.\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":3846,"value":"html`

Start and stop date:

\n${bind(html``, viewof _start)}\n${bind(html``, viewof _stop)}`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":4268,"value":"$30","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":4686,"value":"description","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1887,"value":"viewof selected_tags = Checkbox(\n tags.sort((t1, t2) => (t1.startsWith('system-') ? -1 : 1)),\n {\n label:\n \"Probes to highlight (highlighted probes have at least 1 of the selected tags)\",\n value: (query['tags'] && query['tags'].split(',')) || []\n }\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1932,"value":"viewof lowlight = Radio([true, false], {\n label: \"dim other probes\",\n value: query['dim'] ? query['dim'] === 'true' : true\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1682,"value":"viewof sortBy = Radio(sorts, {\n label: \"Sort by\",\n format: x => x.name,\n value: query['sort']\n ? sorts.filter(s => s.ids.indexOf(query['sort']) >= 0)[0]\n : sorts[0]\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":2464,"value":"viewof state_to_show = Radio([\"up\", \"down\"], {\n label: \"State to display\",\n value: query['state'] ? query['state'] : defaults.state\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1367,"value":"md`\nYou can share your search using [this link ${await icon(\n 'share-alt'\n)}](${choices})`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":2105,"value":"`${description}`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":5369,"value":"$31","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":971,"value":"$32","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":2587,"value":"viewof resolution = Range([1, 86400], {\n label: \"Sampling resolution (in seconds)\",\n step: 30,\n value:\n query['resolution'] || (d3.max(timestamps) - d3.min(timestamps)) / 10000\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":5552,"value":"import {addTooltips} from \"@mkfreeman/plot-tooltip\"\n","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":2100,"value":"md`## TODOs\n\nmore probe selectors (country, bounding box, network-related)
\n\n color by country (deterministic in a range of 1-?)
\n\n aggregate on ASN / country / pfx
\n\n toggle bewteen state (up/down) and event (connected/disconnected)
`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1419,"value":"viewof periods = Range([0, 50], {\n title: \"Periods\",\n step: 1,\n value: 50\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":5583,"value":"These 2 color pickers are for highlight and background color for specific probe selections","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined"},{"id":1881,"value":"viewof hi_color = colorPicker(\"purple\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":5581,"value":"viewof lo_color = colorPicker(\"orange\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1683,"value":"$33","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1022,"value":"query = {\n let params = new URLSearchParams(window.location.search);\n let queryObject = {};\n for (let p of params) {\n queryObject[p[0]] = p[1];\n }\n\n return queryObject;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":519,"value":"// Fetch the coordinates from OpenStreetMap Nominatim service\n// if that's not possible, get them from the map\ncoordinates = {\n mutable description = \"Looking the coordinates for your location\";\n return await fetch(\n `https://nominatim.openstreetmap.org/search.php?q=${location_nominatim.replace(\n ' ',\n '+'\n )}&format=json`\n )\n .then(response => response.json())\n .then(json => json[0])\n .then(j => [j.lon, j.lat])\n .catch(error => {\n // Nominatim might be down\n // flalback to pin-on-the-map selection\n // mutable nominatim_down = true;\n // return _coordinates;\n });\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":29,"value":"size = ({\n width: Math.min(window.innerWidth, 1900),\n height: margin.bottom + probe_objects.length * 10 + 10\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":37,"value":"margin = ({ top: 12, right: 80, bottom: 80, left: 6 * longest_label })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":134,"value":"dataLength = connections.length","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":260,"value":"function paginated_fetch(url = \"\", previousResponse = []) {\n return fetch(url)\n .then(response => response.json())\n .then(newResponse => {\n const response = [...previousResponse, ...newResponse['results']]; // Combine the two arrays\n if (newResponse['next']) {\n url = newResponse['next'];\n mutable description = `Fetching page ${new URLSearchParams(\n url.split('?')[1]\n ).get('page')}`;\n return paginated_fetch(url, response);\n }\n return response;\n });\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":272,"value":"$34","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":227,"value":"probes = probe_objects.filter(p => p.status.name !== \"Abandoned\").map(p => p.id)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":328,"value":"connections = {\n let connections = [];\n const page_size = 50;\n let ended = false;\n let i = 0;\n let chunk;\n let chunks = [];\n while (!ended) {\n chunk = probes.slice(i, i + page_size);\n chunks.push(chunk);\n\n i += page_size;\n ended = i >= probes.length;\n }\n\n let promises = chunks.map(chunk =>\n fetch(\n `https://atlas.ripe.net:443/api/v2/measurements/7000/results/?start=${start}T00:00&stop=${stop}T00:00&probe_ids=${chunk.join(\n ','\n )}`\n ).then(r => r.json())\n );\n\n let conns = await Promise.all(promises);\n\n return conns.flat();\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":574,"value":"groupBy = (items, key) =>\n items.reduce(\n (result, item) => ({\n ...result,\n [item[key]]: [...(result[item[key]] || []), item]\n }),\n {}\n )","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":597,"value":"sortByTimestamp = (a, b) => {\n if (a.timestamp < b.timestamp) {\n return -1;\n }\n if (a.timestamp > b.timestamp) {\n return 1;\n }\n return 0;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":2224,"value":"$35","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":581,"value":"$36","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1328,"value":"mutable _ = 0","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1316,"value":"// assuming we're walking backwards in time\nevent2state = event => (event === \"connect\" ? \"up\" : \"down\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1262,"value":"$37","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":191,"value":"data = connections.map((c, i) => {\n return { x: c.timestamp, y: probes.indexOf(c.prb_id) + 1, event: c.event };\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":218,"value":"timestamps = connections.map(c => c.timestamp)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":27,"value":"xScale = d3\n .scaleLinear()\n .domain([_start.getTime() / 1000, d3.min([_stop, nowFixed]).getTime() / 1000]) // we paint the timelines until _stop\n .range([margin.left, size.width - margin.right])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":34,"value":"yScale = d3\n .scaleBand()\n .domain(probe_objects.sort(sortBy.function).map(p => p.id))\n .range([size.height - margin.bottom, margin.top])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":54,"value":"xAxis = d3.axisBottom(xScale).tickFormat(x => {\n let t0 = new Date(start);\n let t1 = new Date(stop);\n let d = 86400 * 1000;\n let w = 7 * d;\n\n let value = new Date(x * 1000);\n if (t1 - t0 > d) return value.toLocaleDateString();\n return `${\n value\n .toISOString()\n .split('T')[1]\n .split('.')[0]\n } UTC`;\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":56,"value":"yAxis = d3.axisLeft(yScale).tickFormat(i => {\n let probe = probe_objects.filter(p => p.id === i)[0];\n\n let labels = [];\n\n labels.push(`#${probe.id}`);\n\n if (probe.asn_v4) labels.push(`AS${probe.asn_v4}`);\n if (probe.asn_v6 && probe.asn_v6 !== probe.asn_v4)\n labels.push(`AS${probe.asn_v6} (v6)`);\n\n labels.push(`${probe.country_code}`);\n\n // let's keep track of the longest label\n // so we can set the appropiate plot margin\n\n let label = labels.join(' | ');\n if (label.length > longest_label) mutable longest_label = label.length;\n return label;\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1981,"value":"mutable longest_label = 0","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":76,"value":"function formatValue(value) {\n return value;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1237,"value":"palette = d3.interpolateSinebow","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1192,"value":"interpolator = d3.scaleSequential(palette).domain([1, 64 * 1024])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1829,"value":"tags = new Array(\n ...new Set(probe_objects.map(p => p.tags.map(t => t.slug)).flat())\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1084,"value":"mutable nominatim_down = false","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1364,"value":"mutable description = ''","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1508,"value":"cached_fetch = async url => {\n let cached = sessionStorage.getItem(url);\n if (cached) return JSON.parse(cached);\n let r = await fetch(url).then(r => r.json());\n sessionStorage.setItem(url, JSON.stringify(r));\n return r;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":2222,"value":"range = (start, stop, step = 1) =>\n Array(Math.ceil((stop - start) / step))\n .fill(start)\n .map((x, y) => x + y * step)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":3796,"value":"// used for the timeseries tooltip\n\nbisect = {\n const bisect = d3.bisector(d => d.date).left;\n return (x, mx) => {\n const date = x.invert(mx);\n const index = bisect(timeline, date, 1);\n const a = timeline[index - 1];\n const b = timeline[index];\n return b && date - a.date > b.date - date ? b : a;\n };\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1442,"value":"chunks = (arr, chunk_size = 2) => {\n let ended = false;\n let i = 0;\n let chunk;\n let chunks = [];\n while (!ended) {\n chunk = arr.slice(i, i + chunk_size);\n chunks.push(chunk);\n\n i += chunk_size;\n ended = i >= arr.length;\n }\n return chunks;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":3811,"value":"md`### User input machinery`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":5177,"value":"// a simple Date generated onload\nnowFixed = new Date()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":4575,"value":"$38","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":4968,"value":"defaults = {\n return {\n asn: 3333,\n country: 'NL,BE',\n location: 'Amsterdam, The Netherlands',\n radius: 50, // km\n dim: false,\n state: 'up'\n };\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":2071,"value":"// These are the choices the user has clicked in the notebook\n\nmutable choices = {\n let _object = {\n start: start,\n stop: stop,\n sort: sortBy.ids[0],\n dim: lowlight\n };\n\n if (location_nominatim !== defaults.location)\n _object.location = location_nominatim;\n if (object.radius !== defaults.radius) _object.radius = object.radius;\n if (object.asn_v4 !== defaults.asn) _object.asn = object.asn_v4;\n if (object.country !== defaults.country) _object.country = object.country;\n if (selected_tags.length !== 0) _object.tags = selected_tags;\n if (lowlight !== defaults.dim) _object.dim = lowlight;\n\n let params = new URLSearchParams(_object).toString();\n return `${document.baseURI.split('?')[0]}?${params}`;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":3997,"value":"viewof _start = new Input(\n new Date(\n (() => {\n if (query['start']) return query['start'];\n let a = new Date();\n a.setDate(a.getDate() - 7);\n return a.toISOString().split(\"T\")[0];\n })()\n )\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":4005,"value":"start = _start.toISOString().split(\"T\")[0]","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":4001,"value":"viewof _stop = new Input(\n new Date(\n (() => {\n if (query['stop']) return query['stop'];\n let a = new Date();\n a.setDate(a.getDate() + 1);\n return a.toISOString().split(\"T\")[0];\n })()\n )\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":4008,"value":"stop = _stop.toISOString().split(\"T\")[0]","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":4337,"value":"location_nominatim = object.location","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":568,"value":"md`## Imports`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":17,"value":"d3 = require('d3@6')","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":447,"value":"import {\n Radio,\n Range,\n Text,\n Input,\n Checkbox,\n Toggle,\n bind\n} from '@observablehq/inputs'","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1879,"value":"import { colorPicker } from \"@shaunlebron/color-picker\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":2149,"value":"import { icon } from '@severo/fork-awesome-icons'","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":3363,"value":"import { what_is } from \"@aguformoso/ripe-atlas-texts\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":4577,"value":"import { formValue } from '@mbostock/form-input'","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":5331,"value":"import { LineChart } from \"@d3/line-with-tooltip\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":429,"value":"// sometimes the OpenStreetMap Nominatim API is down\n// net::ERR_ADDRESS_UNREACHABLE?\n// fallback to selecting a place on the map by hand\n// viewof _coordinates = worldMapCoordinates({\n// value: nominatim_down ? [-122.27, 37.87] : [0, 0]\n// })","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"}],"files":"$W39","stdlib":"1","titling":"auto"}} 2f:"$2e:body"