md`# BACKUP BLOOD LEVELS`
md`# PHILADELPHIA CHILD BLOOD LEAD LEVELS BY ZIP CODE`
// drag the 3 dots to move cells
map = {
let container = DOM.element('div', { style: `width:${width}px;height:${width/1.6}px` });
yield container;
let map = L.map(container).setView([40.0035, -75.1187], 11);
let osmLayer = L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
attribution: '© <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
}).addTo(map);
{
const banana = L.geoJSON(leadBlood, { // this was originally here, trying to make it it's own layer
pointToLayer: function(feature, num_bll_5plus) {
return L.polygon(num_bll_5plus);
}}).addTo(map)
}
}
d3 = require("d3@6", "d3-tile@1")
d3Fetch = require('d3-fetch')
L = require('leaflet@1.2.0')
leadBlood= d3.json("https://phl.carto.com/api/v2/sql?q=SELECT+*+FROM+child_blood_lead_levels_by_zip&filename=child_blood_lead_levels_by_zip&format=geojson&skipfields=cartodb_id")
//d3Fetch.json
Type JavaScript, then Shift-Enter. Ctrl-space for more options. Arrow ↑/↓ to switch modes.
html`<link href='${resolve('leaflet@1.2.0/dist/leaflet.css')}' rel='stylesheet' />`
// this keeps the map within the container, affects the 'let container = DOM.element' line
md` ### Source: https://www.opendataphilly.org/showcase/2015-philadelphia-child-blood-lead-levels-by-zip-map`
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.
