try all the dots
This commit is contained in:
Adam
parent
a4b8c463fb
commit
647794f6cb
5 changed files with 57 additions and 74 deletions
|
|
@ -15,9 +15,9 @@
|
|||
"vite": "^4.3.3"
|
||||
},
|
||||
"dependencies": {
|
||||
"@deck.gl/layers": "^8.9.10",
|
||||
"@deck.gl/mapbox": "^8.9.10",
|
||||
"@deck.gl/mesh-layers": "^8.9.10",
|
||||
"@deck.gl/layers": "^8.9.11",
|
||||
"@deck.gl/mapbox": "^8.9.11",
|
||||
"@deck.gl/mesh-layers": "^8.9.11",
|
||||
"@solidjs/meta": "^0.28.4",
|
||||
"@solidjs/router": "^0.8.2",
|
||||
"autoprefixer": "^10.4.14",
|
||||
|
|
|
|||
52
lightning/pnpm-lock.yaml
generated
52
lightning/pnpm-lock.yaml
generated
|
|
@ -2,14 +2,14 @@ lockfileVersion: '6.0'
|
|||
|
||||
dependencies:
|
||||
'@deck.gl/layers':
|
||||
specifier: ^8.9.10
|
||||
version: 8.9.10(@deck.gl/core@8.9.10)(@loaders.gl/core@3.3.3)(@luma.gl/core@8.5.19)
|
||||
specifier: ^8.9.11
|
||||
version: 8.9.11(@deck.gl/core@8.9.11)(@loaders.gl/core@3.3.3)(@luma.gl/core@8.5.19)
|
||||
'@deck.gl/mapbox':
|
||||
specifier: ^8.9.10
|
||||
version: 8.9.10(@deck.gl/core@8.9.10)
|
||||
specifier: ^8.9.11
|
||||
version: 8.9.11(@deck.gl/core@8.9.11)
|
||||
'@deck.gl/mesh-layers':
|
||||
specifier: ^8.9.10
|
||||
version: 8.9.10(@deck.gl/core@8.9.10)(@loaders.gl/images@3.3.3)(@luma.gl/core@8.5.19)(@luma.gl/engine@8.5.19)(@luma.gl/gltools@8.5.19)(@luma.gl/webgl@8.5.19)
|
||||
specifier: ^8.9.11
|
||||
version: 8.9.11(@deck.gl/core@8.9.11)(@loaders.gl/images@3.3.3)(@luma.gl/core@8.5.19)(@luma.gl/engine@8.5.19)(@luma.gl/gltools@8.5.19)(@luma.gl/webgl@8.5.19)
|
||||
'@solidjs/meta':
|
||||
specifier: ^0.28.4
|
||||
version: 0.28.4(solid-js@1.7.3)
|
||||
|
|
@ -1178,8 +1178,8 @@ packages:
|
|||
'@babel/helper-validator-identifier': 7.19.1
|
||||
to-fast-properties: 2.0.0
|
||||
|
||||
/@deck.gl/core@8.9.10:
|
||||
resolution: {integrity: sha512-1EzKjpxhbmn6+fHsCkL2Cd60FBNp/DKksijNNPkdzrkzkbXo52pCtQPT3W1cPMdGwk0JiAwGZmQTVpdPvcuarw==}
|
||||
/@deck.gl/core@8.9.11:
|
||||
resolution: {integrity: sha512-BlTil1NTYgzs1/uMOgJfO5LqL8coOYypaYxRp4Gy0Zybf0BZSW0W7VVsFZ+9YXWFRZb+n3uYVYFUaq1G7K7/sA==}
|
||||
dependencies:
|
||||
'@loaders.gl/core': 3.3.3
|
||||
'@loaders.gl/images': 3.3.3
|
||||
|
|
@ -1197,14 +1197,14 @@ packages:
|
|||
mjolnir.js: 2.7.1
|
||||
dev: false
|
||||
|
||||
/@deck.gl/layers@8.9.10(@deck.gl/core@8.9.10)(@loaders.gl/core@3.3.3)(@luma.gl/core@8.5.19):
|
||||
resolution: {integrity: sha512-fQn0AuPz4E3KulI1Sg2l5KrVbbi1oWBcSP97IKccI/YVTtlrBKj5Rdzfu4OmiNN3cF2fBB2KZkujwluVFxzDUA==}
|
||||
/@deck.gl/layers@8.9.11(@deck.gl/core@8.9.11)(@loaders.gl/core@3.3.3)(@luma.gl/core@8.5.19):
|
||||
resolution: {integrity: sha512-85KXPQCYlCb+J4BXjVkB2fg8VYO5d6ME7RPsl13eAIi7jFnJiYecgCnUlFMNsmy2qTFH5Ks8AKLWz54HOoUZ8Q==}
|
||||
peerDependencies:
|
||||
'@deck.gl/core': ^8.0.0
|
||||
'@loaders.gl/core': ^3.0.0
|
||||
'@luma.gl/core': ^8.0.0
|
||||
dependencies:
|
||||
'@deck.gl/core': 8.9.10
|
||||
'@deck.gl/core': 8.9.11
|
||||
'@loaders.gl/core': 3.3.3
|
||||
'@loaders.gl/images': 3.3.3
|
||||
'@loaders.gl/schema': 3.3.3
|
||||
|
|
@ -1217,22 +1217,22 @@ packages:
|
|||
earcut: 2.2.4
|
||||
dev: false
|
||||
|
||||
/@deck.gl/mapbox@8.9.10(@deck.gl/core@8.9.10):
|
||||
resolution: {integrity: sha512-k683gU30N0Gyh6YTqf+eXdJIRzUa0uACQvK5Xas/NsRRlMqwQruLfJWFGItYICyjASW182U43+jGMPUZB78ZTg==}
|
||||
/@deck.gl/mapbox@8.9.11(@deck.gl/core@8.9.11):
|
||||
resolution: {integrity: sha512-ix3NcnJVWHC4Bh1PqqxRkRj7GQR20BNbiJwq206Qj0zabOKUZGL4ZZfqd7cRJJ95YQMa9TZlx0Ipz5u4WvHhog==}
|
||||
peerDependencies:
|
||||
'@deck.gl/core': ^8.0.0
|
||||
dependencies:
|
||||
'@deck.gl/core': 8.9.10
|
||||
'@deck.gl/core': 8.9.11
|
||||
'@types/mapbox-gl': 2.7.10
|
||||
dev: false
|
||||
|
||||
/@deck.gl/mesh-layers@8.9.10(@deck.gl/core@8.9.10)(@loaders.gl/images@3.3.3)(@luma.gl/core@8.5.19)(@luma.gl/engine@8.5.19)(@luma.gl/gltools@8.5.19)(@luma.gl/webgl@8.5.19):
|
||||
resolution: {integrity: sha512-LxUdENKg0lh6GXQCJmznjf70SguldtjmUChkgbkTn/sKMUvV5siKmdHVNjGAHLlE/vSUeeYwaMPsJ2WwFtgxUw==}
|
||||
/@deck.gl/mesh-layers@8.9.11(@deck.gl/core@8.9.11)(@loaders.gl/images@3.3.3)(@luma.gl/core@8.5.19)(@luma.gl/engine@8.5.19)(@luma.gl/gltools@8.5.19)(@luma.gl/webgl@8.5.19):
|
||||
resolution: {integrity: sha512-DnSYJ352BTXXBCkGuhJk9IU9jeN6blmdZAycxJ20Xmqzbnbo/NbYDyLGS5zgwZJdfdBY9R6jzZn4YI0KZ5anKA==}
|
||||
peerDependencies:
|
||||
'@deck.gl/core': ^8.0.0
|
||||
'@luma.gl/core': ^8.0.0
|
||||
dependencies:
|
||||
'@deck.gl/core': 8.9.10
|
||||
'@deck.gl/core': 8.9.11
|
||||
'@loaders.gl/gltf': 3.3.3
|
||||
'@luma.gl/constants': 8.5.19
|
||||
'@luma.gl/core': 8.5.19
|
||||
|
|
@ -1818,7 +1818,7 @@ packages:
|
|||
'@babel/types': 7.21.4
|
||||
'@types/babel__generator': 7.6.4
|
||||
'@types/babel__template': 7.4.1
|
||||
'@types/babel__traverse': 7.18.4
|
||||
'@types/babel__traverse': 7.18.5
|
||||
|
||||
/@types/babel__generator@7.6.4:
|
||||
resolution: {integrity: sha512-tFkciB9j2K755yrTALxD44McOrk+gfpIpvC3sxHjRawj6PfnQxrse4Clq5y/Rq+G3mrBurMax/lG8Qn2t9mSsg==}
|
||||
|
|
@ -1831,8 +1831,8 @@ packages:
|
|||
'@babel/parser': 7.21.4
|
||||
'@babel/types': 7.21.4
|
||||
|
||||
/@types/babel__traverse@7.18.4:
|
||||
resolution: {integrity: sha512-TLG7CsGZZmX9aDF78UuJxnNTfQyRUFU0OYIVyIblr0/wd/HvsIo8wmuB90CszeD2MtLLAE9Tt4cWvk+KVkyGIw==}
|
||||
/@types/babel__traverse@7.18.5:
|
||||
resolution: {integrity: sha512-enCvTL8m/EHS/zIvJno9nE+ndYPh1/oNFzRYRmtUqJICG2VnCSBzMLW5VN2KCQU91f23tsNKR8v7VJJQMatl7Q==}
|
||||
dependencies:
|
||||
'@babel/types': 7.21.4
|
||||
|
||||
|
|
@ -2038,7 +2038,7 @@ packages:
|
|||
hasBin: true
|
||||
dependencies:
|
||||
caniuse-lite: 1.0.30001481
|
||||
electron-to-chromium: 1.4.372
|
||||
electron-to-chromium: 1.4.374
|
||||
node-releases: 2.0.10
|
||||
update-browserslist-db: 1.0.11(browserslist@4.21.5)
|
||||
|
||||
|
|
@ -2237,8 +2237,8 @@ packages:
|
|||
/ee-first@1.1.1:
|
||||
resolution: {integrity: sha512-WMwm9LhRUo+WUaRN+vRuETqG89IgZphVSNkdFgeb6sS/E4OrDIN7t48CAewSHXc6C8lefD8KKfr5vY61brQlow==}
|
||||
|
||||
/electron-to-chromium@1.4.372:
|
||||
resolution: {integrity: sha512-MrlFq/j+TYHOjeWsWGYfzevc25HNeJdsF6qaLFrqBTRWZQtWkb1myq/Q2veLWezVaa5OcSZ99CFwTT4aF4Mung==}
|
||||
/electron-to-chromium@1.4.374:
|
||||
resolution: {integrity: sha512-dNP9tQNTrjgVlSXMqGaj0BdrCS+9pcUvy5/emB6x8kh0YwCoDZ0Z4ce1+7aod+KhybHUd5o5LgKrc5al4kVmzQ==}
|
||||
|
||||
/emoji-regex@8.0.0:
|
||||
resolution: {integrity: sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==}
|
||||
|
|
@ -3260,8 +3260,8 @@ packages:
|
|||
dependencies:
|
||||
queue-microtask: 1.2.3
|
||||
|
||||
/rxjs@7.8.0:
|
||||
resolution: {integrity: sha512-F2+gxDshqmIub1KdvZkaEfGDwLNpPvk9Fs6LD/MyQxNgMds/WH9OdDDXOmxUZpME+iSK3rQCctkL0DYyytUqMg==}
|
||||
/rxjs@7.8.1:
|
||||
resolution: {integrity: sha512-AA3TVj+0A2iuIoQkWEK/tqFjBq2j+6PO6Y0zJcvzLAFhEFIO3HL0vls9hWLncZbAAbK0mar7oZ4V079I/qPMxg==}
|
||||
dependencies:
|
||||
tslib: 2.5.0
|
||||
|
||||
|
|
@ -3756,7 +3756,7 @@ packages:
|
|||
joi: 17.9.2
|
||||
lodash: 4.17.21
|
||||
minimist: 1.2.8
|
||||
rxjs: 7.8.0
|
||||
rxjs: 7.8.1
|
||||
transitivePeerDependencies:
|
||||
- debug
|
||||
|
||||
|
|
|
|||
|
|
@ -7,10 +7,10 @@ export const MapContext = createContext();
|
|||
|
||||
export function MapContextProvider(props: any) {
|
||||
const [viewport, setViewport] = createSignal<Viewport>({
|
||||
center: { lng: -71.05625, lat: 42.36, },
|
||||
zoom: 15.5,
|
||||
bearing: 160,
|
||||
pitch: 60,
|
||||
center: { lng: -90, lat: 38, },
|
||||
zoom: 4,
|
||||
bearing: 0,
|
||||
pitch: 0,
|
||||
});
|
||||
|
||||
return (
|
||||
|
|
|
|||
|
|
@ -37,7 +37,6 @@ export default function BadassMap(props: any) {
|
|||
|
||||
<MapScatLayer />
|
||||
<MapArcLayer />
|
||||
<MapMarkerLayer />
|
||||
<MapControls />
|
||||
|
||||
</MapGL >
|
||||
|
|
|
|||
|
|
@ -1,11 +1,10 @@
|
|||
import { ScatterplotLayer } from '@deck.gl/layers/typed';
|
||||
import { MapboxLayer } from '@deck.gl/mapbox/typed';
|
||||
import { Layer } from 'solid-map-gl';
|
||||
import { createEffect, createMemo, createSignal, Show } from 'solid-js';
|
||||
|
||||
import type { JSX } from 'solid-js';
|
||||
|
||||
import { StationsContext, useStationsContext } from '~/components/StationsContext';
|
||||
|
||||
|
||||
type ScatData = {
|
||||
coordinates: number[]
|
||||
|
|
@ -13,48 +12,33 @@ type ScatData = {
|
|||
|
||||
|
||||
export default function MapScatLayer(props: any) {
|
||||
const [stations] = useStationsContext();
|
||||
|
||||
const [scats, setScats] = createSignal([]);
|
||||
|
||||
async function getCoords(stations) {
|
||||
if (stations() === undefined) {
|
||||
return
|
||||
} else if (stations.loading) {
|
||||
return stations.loading
|
||||
} else if (stations.error) {
|
||||
return stations.error
|
||||
} else {
|
||||
let buf: ScatData[] = [];
|
||||
for (const station of stations()) {
|
||||
// long lat
|
||||
buf.push({ coordinates: [station.Loc.Coordinates[1], station.Loc.Coordinates[0]] })
|
||||
};
|
||||
return buf;
|
||||
async function fetchAllStations() {
|
||||
let buf: ScatData[] = [];
|
||||
const response = await fetch('https://kevinfwu.com/getall');
|
||||
for (const station of await response.json()) {
|
||||
buf.push({ coordinates: [station.Coordinates[1], station.Coordinates[0]] })
|
||||
};
|
||||
return (buf);
|
||||
};
|
||||
|
||||
const pls = createMemo(() => setScats(getCoords(stations)));
|
||||
|
||||
return (
|
||||
<Show when={stations()}>
|
||||
<Layer customLayer={
|
||||
new MapboxLayer({
|
||||
id: 'deckgl-scatterplot',
|
||||
type: ScatterplotLayer,
|
||||
data: scats(),
|
||||
pickable: true,
|
||||
stroked: false,
|
||||
lineWidthMaxPixels: 0,
|
||||
radiusMinPixels: 1,
|
||||
radiusMaxPixels: 100,
|
||||
radiusUnits: 'meters',
|
||||
getRadius: 1,
|
||||
radiusScale: 10,
|
||||
getPosition: (d: any) => d.coordinates,
|
||||
antialiasing: false,
|
||||
getFillColor: [255, 140, 0],
|
||||
} as any)} />
|
||||
</Show>
|
||||
<Layer customLayer={
|
||||
new MapboxLayer({
|
||||
id: 'deckgl-scatterplot',
|
||||
type: ScatterplotLayer,
|
||||
data: fetchAllStations(),
|
||||
pickable: true,
|
||||
stroked: false,
|
||||
lineWidthMaxPixels: 0,
|
||||
radiusMinPixels: 1,
|
||||
radiusMaxPixels: 100,
|
||||
radiusUnits: 'meters',
|
||||
getRadius: 1,
|
||||
radiusScale: 10,
|
||||
getPosition: (d: any) => d.coordinates,
|
||||
antialiasing: false,
|
||||
getFillColor: [255, 140, 0],
|
||||
} as any)} />
|
||||
) as JSX.Element;
|
||||
};
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue