The end-to-end solution for building and hosting better data apps, dashboards, and reports.
2021 Pride Month and LGBTQIA+ EqualityWomen in the German Bundestag by PartyAnti-Trans Legislation TrackerThe Racial Wealth GapHow much money does MTC owe Mississippi for vacant guard jobs?George Floyd Protests:
Press Freedom Violations Per DayRacial demographic dot-density mapA Growing Threat to Life: Taser usage by Greater Manchester PoliceThe Woman Citizen's Wheel of Progress, 1917Rejected Mail Ballots in North CarolinaBlack Lives Matter and Anti-RacismJuneteenth: History and ResourcesBlack Lives Matter and Racial Equality Resources
Pride Month and LGBTQIA+ Equality
rainbowFlag = ["#5E513F", "#A5765C", "#FF7E6A", "#FFB47E", "#FFE694", "#B3EB9F", "#7EC4F6", "#BB87FA"]
transgenderFlag = ["#7EC4F6", "#FFB7DE", "#FFFDF6", "#FFB7DE", "#7EC4F6"]
bisexualFlag = ["#ED6EBA", "#ED6EBA", "#A55DB7", "#7074D1", "#7074D1"]
genderqueerFlag = ["#BB87FA", "#FFFDF6", "#80B65F"]
pansexualFlag = ["#FA87EE", "#FAE49A", "#7EC4F6"]
nonbinaryFlag = ["#FAE49A", "#FFFDF6", "#BB87FA", "#353535"]
asexualFlag = ["#353535", "#CACACA", "#FFFDF6", "#A55DB7"]
flags = [
{name: "Rainbow", colors: rainbowFlag},
{name: "Transgender", colors: transgenderFlag},
{name: "Bisexual", colors: bisexualFlag},
{name: "Genderqueer", colors: genderqueerFlag},
{name: "Pansexual", colors: pansexualFlag},
{name: "Non-binary", colors: nonbinaryFlag},
{name: "Asexual", colors: asexualFlag}
]
flagIndex = {
let i = 0;
while (true) {
yield i++;
if (i == flags.length) {
i = 0;
}
await Promises.delay(2000);
}
}
function generateFlagPattern(colors) {
return colors.map((color, i) => `<rect fill="${color}" x="-3" y="${(23 / colors.length) * i}" width="28" height="${23 / colors.length + 1}"></rect>`);
}
import {toc} from "@nebrius/indented-toc"
One platform to build and deploy the best data apps
Experiment and prototype by building visualizations in live JavaScript notebooks. Collaborate with your team and decide which concepts to build out.
Use Observable Framework to build data apps locally. Use data loaders to build in any language or library, including Python, SQL, and R.
Seamlessly deploy to Observable. Test before you ship, use automatic deploy-on-commit, and ensure your projects are always up-to-date.