Public
Edited
Nov 24, 2022
url = (instance) => {return `https://${instance}/api/v1/instance/activity`}
"mastodon.social"
import {aq, op} from "@uwdata/arquero"
async function request(instance) {
const data = await aq.loadJSON(url(instance))
return data.derive({
instance: aq.escape(instance),
week: aq.escape(d => d3.utcParse('%Q')(d.week * 1e3)),
statuses: d => op.parse_int(d.statuses),
logins: d => op.parse_int(d.logins),
registrations: d => op.parse_int(d.registrations)
})
}
// async function = {
// let df = [{instance: [], week: [], statuses: [], logins: [], registrations: []}]
// if (instanceSelected == null) {
// return null
// } else {
// const dfi = request(instanceSelected.name)
// df = df.concat(dfi)
// return df
// // return plot(dfi)
// }
// }
instanceSelected
// Inputs.table([])
viewof instanceSelected = {const element = htl.html`<div></div>`;
element.value = null;
return element;}
instanceSelected
instance
plot = (df) => {
const scaleOptions = {tickSize: 0,
tickPadding: 10,
grid: true,
label: null}
const markOptions ={x: 'week',
y: measure,
curve: 'basis'}
const curve = 'natural'
return Plot.plot({
width: width,
marginLeft: 50,
x: {
...scaleOptions,
},
y: {
...scaleOptions
},
color: {
tickSize: 0,
tickPadding: 10,
// scheme: 'Set3',
legend: true
},
marks: [
Plot.areaY(df, {
...markOptions,
fill: 'instance',
fillOpacity: .1
}),
Plot.line(df, {
...markOptions,
stroke: 'instance',
}),
Plot.dot(df, {
...markOptions,
fill: 'instance',
title: d => `${d[measure]} logins\n${d.instance}`
})
]
})
}
import {Plot} from "@mkfreeman/plot-tooltip"
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
