Doing mappy and data things for City of Raleigh Parks, Recreation and Cultural Resources Department.
Published
Edited
Jul 2, 2019
1 fork
ccRidesUrl = 'https://maps.raleighnc.gov/arcgis/rest/services/Hosted/CitrixCycleHistory/MapServer/0'
ccRidesHeatFeatureGroup = L.featureGroup()
ccRidesHeatLayer = {
ccRidesHeatFeatureGroup.clearLayers();
let ccRidesHeatFeature = L.esri.Heat.featureLayer({
url: ccRidesUrl,
fields: ['objectid', 'received'],
radius: pointRadiusSlider,
blur: blurRadiusSlider,
gradient: {
'0': 'Black',
'0.5': heatColor,
'1': 'White'
},
timeField: 'received',
from: moment(date),
to: moment(date).add(1, 'days')
});
return ccRidesHeatFeatureGroup.addLayer(ccRidesHeatFeature);
}
count = {
let from = moment(date).valueOf();
let to = moment(date).add(1, 'days').valueOf();
let url = `${ccRidesUrl}/query?where=1%3D1&=&outFields=objectid%2Cid&returnGeometry=false&groupByFieldsForStatistics=id&outStatistics=%5B%7B%0D%0A"statisticType"%3A"count"%2C%0D%0A"onStatisticField"%3A"id"%2C%0D%0A"outStatisticFieldName"%3A"count"%0D%0A%7D%5D&f=pjson&time=${from}%2C${to}`
let result = (await fetch(url)).json()
return result
}
ccDocksUrl = 'https://citrixcycle.com/stations/stations/'
ccDocksJSON = (await fetch(`https://cors-bypasser.glitch.me/bypass/${ccDocksUrl}`)).json()
ccDocksGeoJSON = {
let featuresArray = [];
ccDocksJSON.forEach((x) => {
if (x.location && x.type == "OPEN") {
let geometry = x.location.reverse()
let properties = {
"id": x.id,
"locking_station_type": x.locking_station_type,
"description": x.description,
"address": x.address,
"stocking_full": x.stocking_full
}
let feature = turf.point(geometry, properties)
featuresArray.push(feature)
}
})
return turf.featureCollection(featuresArray)
}
ccDocksLayer = L.geoJSON(ccDocksGeoJSON, {
pointToLayer: (feature, latlng) => {
return L.circleMarker(latlng, {
radius: feature.properties.stocking_full / 2,
fillColor: '#EF9A9A',
fillOpacity: 0.5,
color: '#E57373',
opacity: 1,
weight: 1.5
})
}
})
L = {
const r = require.alias({leaflet: 'leaflet@1.4.0'});
const L = await r('leaflet');
if (!L._css) {
document.head.appendChild(L._css = html`
<link href='${await require.resolve('leaflet@1.4.0/dist/leaflet.css')}' rel=stylesheet>
`);
}
L.esri = await r('esri-leaflet');
L.esri.Heat = await r('esri-leaflet-heatmap');
await r('leaflet.heat').catch(() => L.heatLayer);
return L;
}
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.
