Published
Edited
Nov 24, 2021
Importers
Scratch
Find datasets that cover neobank & "nonbank" deposit share growth (Chime, Varo, etc.) + credit unions (NCUA) -- CFPB? FFIEC? etc.
geojson = locations.data.map(d => ({
type: "Feature",
geometry: {
type: "Point",
coordinates: [d.data.LONGITUDE, d.data.LATITUDE]
},
properties: d.data.NAME
}))
locations = d3.json(url2, d3.autoType)
locationData = locations.data.map(d => d.data)
locationTable = Inputs.table(locations.data.map(d => d.data), {columns: ["ID", "NAME", "ESTYMD", "ZIP", "CITY", "COUNTY", "LATITUDE", "LONGITUDE"]}, {sort: "ID", reverse: true})
geoLocation = {
const createGeoJSON = () => {
const data = [
{
lat: locationData.getElementById("LATITUDE").value,
lng: locationData.getElementById("LONGITUDE").value
}
];
data[0][locationData.getElementById("propertyname1").value] = document.getElementById("propertyvalue1").value;
data[0][locationData.getElementById("propertyname2").value] = document.getElementById("propertyvalue2").value;
const dataGeoJSON = locationData.parse(data, { Point: ["lat", "lng"] });
locationData.getElementById("output").value = JSON.stringify(dataGeoJSON, null, 4);
}
}
map = {
const container = html`<div style="height:650px;">`;
yield container;
const map = L.map(container).setView([45.2, -69.5], 7);
L.tileLayer("https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png", {
attribution: "© <a href=https://www.openstreetmap.org/copyright>OpenStreetMap</a> contributors"
}).addTo(map);
L.svg().addTo(map)
const overlay = d3.select(map.getPanes().overlayPane)
const svg = overlay.select('svg')
const branches = svg.selectAll('circle')
.attr("class", "branch")
.data(geojson)
.join('circle')
.attr("id", "dots")
.attr("fill", "blue")
.attr("r", 5)
}
L = {
const L = await require("leaflet@1/dist/leaflet.js");
if (!L._style) {
const href = await require.resolve("leaflet@1/dist/leaflet.css");
document.head.appendChild(L._style = html`<link href=${href} rel=stylesheet>`);
}
return L;
}
bankTable = Inputs.table(banks.data.map(d => d.data))
simpleBankTable = Inputs.table(banks.data.map(d => d.data), {columns: ["ID", "NAME", "ZIP", "OFFICES", "DEPDOM"]}, {sort: "DEPDOM", reverse: true})
viewof filteredRows = Inputs.table(filteredBanks)
viewof deposits = Inputs.range([0,1500000], {value: 1200000, step: 100, label: "Minimum Deposits"})
chart = addTooltips(Plot.plot({
marks: [
Plot.barY(filteredBanks, {x: "ID", y: "DEP", title: "NAME", fill: colorScale})
],
width: 800
}))
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.
