Skip to content

Commit a24bd7a

Browse files
backspacesbackspaces
committed
New: test.html: NM counties & MB CanvasSource
- bin/tools: async: mapLoad(map) - async.html: test of above - bin/featureFilter (nmcounties etc from uscounties etc)
1 parent 4ed4f4f commit a24bd7a

File tree

14 files changed

+322
-98
lines changed

14 files changed

+322
-98
lines changed

‎.eslintrc.js‎

Lines changed: 31 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
// .eslintrc.js
2+
// .eslintrc.js
3+
module.exports = {
4+
env: {
5+
browser: true,
6+
es6: true,
7+
node: true,
8+
},
9+
extends: 'eslint:recommended',
10+
parserOptions: {
11+
ecmaVersion: 2017,
12+
sourceType: 'module',
13+
},
14+
rules: {
15+
// curly: [0], // ignore curlies completely. eslint default?
16+
// curly: [2, "multi", "consistent"], // ok
17+
// curly: [2], // default?
18+
curly: ['error', 'multi-line', 'consistent'],
19+
'prefer-const': ['error'],
20+
'no-console': ['error', { allow: ['log', 'warn', 'error'] }],
21+
// Prettier prefers no space after function
22+
// 'space-before-function-paren': 'error',
23+
// 'space-before-function-paren': ['error', 'never'],
24+
// Here to match our Prettier options
25+
semi: ['error', 'never'],
26+
quotes: ['error', 'single'],
27+
indent: ['error', 4],
28+
'comma-dangle': ['error', 'always-multiline'],
29+
'arrow-parens': ['error', 'as-needed'],
30+
},
31+
}

‎.prettierrc.js‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
// .prettierrc.js
2+
module.exports = {
3+
semi: false,
4+
singleQuote: true,
5+
tabWidth: 4,
6+
trailingComma: 'es5',
7+
arrowParens: 'avoid',
8+
}

‎async.html‎

Lines changed: 89 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,89 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<meta charset="utf-8" />
5+
<title>Async</title>
6+
<meta
7+
name="viewport"
8+
content="initial-scale=1,maximum-scale=1,user-scalable=no"
9+
/>
10+
<script src="https://api.mapbox.com/mapbox-gl-js/v1.9.0/mapbox-gl.js"></script>
11+
<link
12+
href="https://api.mapbox.com/mapbox-gl-js/v1.9.0/mapbox-gl.css"
13+
rel="stylesheet"
14+
/>
15+
16+
<script src="https://unpkg.com/@turf/turf/turf.min.js"></script>
17+
18+
<style>
19+
body {
20+
margin: 10;
21+
padding: 10;
22+
}
23+
#map {
24+
position: absolute;
25+
top: 0;
26+
bottom: 0;
27+
/* height: 800px; */
28+
width: 95%;
29+
}
30+
</style>
31+
</head>
32+
<body>
33+
<div id="map"></div>
34+
<script type="module">
35+
mapboxgl.accessToken =
36+
'pk.eyJ1IjoiYmFja3NwYWNlcyIsImEiOiJjanVrbzI4dncwOXl3M3ptcGJtN3oxMmhoIn0.x9iSCrtm0iADEqixVgPwqQ'
37+
38+
const center = [-106.16, 34.185]
39+
const json = turf.featureCollection([turf.point(center)])
40+
41+
const map = new mapboxgl.Map({
42+
container: 'map', // container id
43+
style: 'mapbox://styles/mapbox/streets-v11',
44+
center: center,
45+
zoom: 5.5,
46+
})
47+
48+
function mapPromise(map) {
49+
return new Promise((resolve, reject) => {
50+
map.on('load', () => resolve())
51+
})
52+
}
53+
54+
async function run() {
55+
await mapPromise(map)
56+
map.addLayer({
57+
id: 'center',
58+
type: 'circle',
59+
source: {
60+
type: 'geojson',
61+
data: json,
62+
// data: './data/centroids.json',
63+
},
64+
paint: {
65+
'circle-color': 'red',
66+
'circle-radius': 20,
67+
},
68+
})
69+
}
70+
run()
71+
72+
// map.on('load', function () {
73+
// console.log('vanilla load')
74+
// map.addLayer({
75+
// id: 'center',
76+
// type: 'circle',
77+
// source: {
78+
// type: 'geojson',
79+
// data: json,
80+
// },
81+
// paint: {
82+
// 'circle-color': 'red',
83+
// 'circle-radius': 20,
84+
// },
85+
// })
86+
// })
87+
</script>
88+
</body>
89+
</html>

‎bin/centroidFilter‎

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
#!/usr/bin/env node
2+
3+
const process = require('process')
4+
let turf = require('@turf/turf')
5+
6+
let data = ''
7+
process.stdin.on('readable', () => {
8+
while ((chunk = process.stdin.read()) !== null) {
9+
data += chunk
10+
}
11+
})
12+
13+
process.stdin.on('end', () => {
14+
process.stdout.write(processData(data))
15+
})
16+
17+
function processData(data) {
18+
const json = JSON.parse(data)
19+
const centroids = json.features.map((f) => turf.centroid(f))
20+
json.features = centroids
21+
data = JSON.stringify(json, null, 2)
22+
// return json
23+
return data
24+
}

‎bin/featureFilter‎

Lines changed: 15 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,24 +1,33 @@
11
#!/usr/bin/env node
22

33
const process = require('process')
4-
let turf = require('@turf/turf')
4+
// let turf = require('@turf/turf')
55

6+
const filter = process.argv[2]
7+
if (!filter) throw 'No filter provided'
8+
9+
const [property, value] = filter.split(':')
10+
if (!property || !value) throw 'badly formatted filter:' + filter
11+
12+
// stdin/stdout pipeline. Modify output in processData()
613
let data = ''
714
process.stdin.on('readable', () => {
815
while ((chunk = process.stdin.read()) !== null) {
916
data += chunk
1017
}
1118
})
12-
1319
process.stdin.on('end', () => {
1420
process.stdout.write(processData(data))
1521
})
16-
1722
function processData(data) {
1823
const json = JSON.parse(data)
19-
const centroids = json.features.map((f) => turf.centroid(f))
20-
json.features = centroids
24+
25+
// Process json here
26+
json.features = json.features.filter(
27+
feature => feature.properties[property] === value
28+
)
29+
// End
30+
2131
data = JSON.stringify(json, null, 2)
22-
// return json
2332
return data
2433
}

‎counties.html‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -59,7 +59,7 @@
5959
type: 'fill',
6060
source: {
6161
type: 'geojson',
62-
data: './data/counties.json',
62+
data: './data/uscounties.json',
6363
},
6464
filter:
6565
states.length === 0
@@ -142,7 +142,7 @@
142142
const array = states
143143
.toUpperCase()
144144
.split(',')
145-
.map((postal) => fips[postal].fips)
145+
.map(postal => fips[postal].fips)
146146
return array.join(',')
147147
} else {
148148
return ''

0 commit comments

Comments
 (0)