Published
Edited
Mar 28, 2021
rewind = (geoJson) => {
const returnValue = lodash.cloneDeep(geoJson)
returnValue.features = returnValue.features.map(feature => turf.rewind(feature, {reverse: true}))
return returnValue
}
stateFeaturesCollection = rewind(stateGeoJson)
stateFeaturesCollection2 = d3.geoStitch(stateFeaturesCollection)
stateSvg = function(featuresCollection) {
const height = width
const projection = d3.geoMercator()
.fitSize([width, height], featuresCollection)
const pathGenerator = d3.geoPath()
.projection(projection)
const bbox = turf.bbox(featuresCollection)
const geoBounds = d3.geoBounds(featuresCollection)
debugger
const svg = d3.create('svg')
.attr("viewBox", [0, 0, width, height])
svg.append('g')
.attr('class', 'features')
.selectAll('g.features path')
.data(featuresCollection.features)
.enter()
.append('path')
.attr('d', pathGenerator)
.append('title')
.text(d => d.properties.BASENAME)
svg.append('g')
.attr('class', 'graticule')
.selectAll('g.graticule path')
.data(d3.geoGraticule().step([1, 1]).lines())
.enter()
.append('path')
.attr('d', pathGenerator)
return svg.node();
}
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.
