Skip to content

Instantly share code, notes, and snippets.

@bresson

bresson/index.html

Last active February 11, 2020 03:04
Show Gist options
  • Save bresson/654d03d8c4280a9de307e95e258af38d to your computer and use it in GitHub Desktop.
Save bresson/654d03d8c4280a9de307e95e258af38d to your computer and use it in GitHub Desktop.
Download ZIP
working geojson with extant, now with Saga
Raw
index.html
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>GistRun</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<div id="content">
<svg width="400px" height="400px">
<g class="map"></g>
</svg>
</div>
<script src="https://d3js.org/d3.v5.js"></script>
<script src="script.js"></script>
</body>
</html>
Raw
script.js
console.log('Hello World!');
var geojson = {
"type": "FeatureCollection",
"features": [
{
"type": "Feature",
"properties": {},
"geometry": {
"type": "Polygon",
"coordinates": [
[
[
55.15465,
24.960386
],
[
55.154884,
24.960276
],
[
55.154983,
24.960422
],
[
55.154748,
24.960535
],
[
55.15465,
24.960386
]
]
]
}
}
],
}
var projection = d3.geoMercator().fitExtent([[0, 0], [400, 400]], geojson);;
var geoGenerator = d3.geoPath()
.projection(projection);
// Join the FeatureCollection's features array to path elements
var u = d3.select('#content g.map')
.selectAll('path')
.data(geojson.features);
// Create path elements and update the d attribute using the geo generator
u.enter()
.append('path')
.attr('d', geoGenerator);
Raw
styles.css
/* todo: add styles */
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment