Skip to content

Commit 39fed31

Browse files
committed
feat: Upgrade map-deck to v3
Signed-off-by: Gordon Smith <GordonJSmith@gmail.com>
1 parent f297d81 commit 39fed31

File tree

15 files changed

+1480
-559
lines changed

15 files changed

+1480
-559
lines changed

package-lock.json

Lines changed: 1183 additions & 400 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

package.json

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@
1717
"packages/composite",
1818
"packages/dataflow",
1919
"xpackages/ddl-shim",
20-
"xpackages/deck-shim",
20+
"packages/deck-shim",
2121
"packages/dgrid",
2222
"packages/dgrid-shim",
2323
"packages/dgrid2",
@@ -30,7 +30,7 @@
3030
"xpackages/leaflet-shim",
3131
"xpackages/loader",
3232
"xpackages/map",
33-
"xpackages/map-deck",
33+
"packages/map-deck",
3434
"packages/markdown-it-plugins",
3535
"xpackages/marshaller",
3636
"packages/observable-shim",

packages/deck-shim/package.json

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -40,6 +40,8 @@
4040
},
4141
"devDependencies": {
4242
"@hpcc-js/bundle": "^2.12.0",
43+
"css-loader": "7.1.2",
44+
"style-loader": "4.0.0",
4345
"tslib": "2.7.0"
4446
},
4547
"repository": {
@@ -53,4 +55,4 @@
5355
"url": "https://github.com/hpcc-systems/Visualization/issues"
5456
},
5557
"homepage": "https://github.com/hpcc-systems/Visualization"
56-
}
58+
}

packages/map-deck/.vscode/launch.json

Lines changed: 49 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,61 @@
11
{
2-
// Use IntelliSense to learn about possible attributes.
3-
// Hover to view descriptions of existing attributes.
4-
// For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
52
"version": "0.2.0",
63
"configurations": [
4+
{
5+
"name": "test-browser",
6+
"type": "msedge",
7+
"request": "launch",
8+
"url": "http://localhost:8888",
9+
"webRoot": "${workspaceFolder}",
10+
"outFiles": [
11+
"${workspaceFolder}/**/*.js",
12+
"!**/node_modules/**"
13+
],
14+
},
15+
{
16+
"name": "test-node",
17+
"type": "node",
18+
"request": "launch",
19+
"runtimeArgs": [
20+
"run-script",
21+
"test-node"
22+
],
23+
"runtimeExecutable": "npm",
24+
"skipFiles": [
25+
"<node_internals>/**"
26+
],
27+
"outFiles": [
28+
"${workspaceFolder}/**/*.js",
29+
"!**/node_modules/**"
30+
],
31+
},
732
{
833
"name": "index.html",
9-
"type": "chrome",
1034
"request": "launch",
11-
"url": "file:///${workspaceRoot}/index.html",
35+
"type": "msedge",
36+
"url": "file:///${workspaceFolder}/index.html",
37+
"runtimeArgs": [
38+
"--disable-web-security"
39+
],
40+
"webRoot": "${workspaceFolder}",
41+
"outFiles": [
42+
"${workspaceFolder}/**/*.js",
43+
"!**/node_modules/**"
44+
]
45+
},
46+
{
47+
"name": "wsl index.html",
48+
"request": "launch",
49+
"type": "msedge",
50+
"url": "file://wsl.localhost/Ubuntu-24.04/home/gordon/Visualization/packages/map/index.html",
1251
"runtimeArgs": [
1352
"--disable-web-security"
1453
],
15-
"webRoot": "${workspaceRoot}"
54+
"webRoot": "${workspaceFolder}",
55+
"outFiles": [
56+
"${workspaceFolder}/**/*.js",
57+
"!**/node_modules/**"
58+
]
1659
}
1760
]
1861
}

packages/map-deck/.vscode/tasks.json

Lines changed: 6 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -2,9 +2,9 @@
22
"version": "2.0.0",
33
"tasks": [
44
{
5-
"label": "es6 watch",
5+
"label": "gen-types-watch",
66
"type": "npm",
7-
"script": "compile-es6-watch",
7+
"script": "gen-types-watch",
88
"problemMatcher": [
99
"$tsc-watch"
1010
],
@@ -13,18 +13,7 @@
1313
}
1414
},
1515
{
16-
"label": "umd watch",
17-
"type": "npm",
18-
"script": "compile-umd-watch",
19-
"problemMatcher": [
20-
"$tsc-watch"
21-
],
22-
"presentation": {
23-
"group": "group-build"
24-
}
25-
},
26-
{
27-
"label": "bundle watch",
16+
"label": "bundle-watch",
2817
"type": "npm",
2918
"script": "bundle-watch",
3019
"problemMatcher": [],
@@ -35,15 +24,13 @@
3524
{
3625
"label": "build",
3726
"dependsOn": [
38-
"es6 watch",
39-
"umd watch",
40-
"bundle watch"
27+
"gen-types-watch",
28+
"bundle-watch",
4129
],
4230
"group": {
4331
"kind": "build",
4432
"isDefault": true
45-
},
46-
"problemMatcher": []
33+
}
4734
}
4835
]
4936
}

packages/map-deck/esbuild.js

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
import { browserTpl } from "@hpcc-js/esbuild-plugins";
2+
import pkg from "./package.json" with { type: "json" };
3+
4+
// config ---
5+
await Promise.all([
6+
browserTpl("src/index.ts", "dist/index", {
7+
keepNames: true,
8+
alias: {
9+
"d3-array": "@hpcc-js/common",
10+
"d3-brush": "@hpcc-js/common",
11+
"d3-collection": "@hpcc-js/common",
12+
"d3-color": "@hpcc-js/common",
13+
"d3-dispatch": "@hpcc-js/common",
14+
"d3-drag": "@hpcc-js/common",
15+
"d3-dsv": "@hpcc-js/common",
16+
"d3-ease": "@hpcc-js/common",
17+
"d3-format": "@hpcc-js/common",
18+
"d3-interpolate": "@hpcc-js/common",
19+
"d3-scale": "@hpcc-js/common",
20+
"d3-selection": "@hpcc-js/common",
21+
"d3-time-format": "@hpcc-js/common",
22+
"d3-transition": "@hpcc-js/common",
23+
"d3-zoom": "@hpcc-js/common"
24+
},
25+
external: [
26+
...Object.keys(pkg.dependencies),
27+
]
28+
})
29+
]);

packages/map-deck/index.html

Lines changed: 72 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -1,57 +1,90 @@
1-
<!doctype html>
1+
<!DOCTYPE html>
22
<html>
33

44
<head>
5-
<meta charset="utf-8">
6-
<title>@hpcc-js/chart</title>
7-
8-
<script>
9-
if (window.location.protocol === "file:" || window.location.origin.indexOf("http://localhost") === 0) {
10-
document.write('<link rel="stylesheet" href="../../packages/common/font-awesome/css/font-awesome.min.css">');
11-
document.write('<script type="text/javascript" src="../../packages/loader/dist/index.js"><' + '/script>');
12-
} else {
13-
document.write('<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@hpcc-js/common/font-awesome/css/font-awesome.min.css">');
14-
document.write('<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/@hpcc-js/loader"><' + '/script>');
5+
<title>Home</title>
6+
<style>
7+
body {
8+
font-family: Arial, sans-serif;
9+
margin: 0;
10+
padding: 0;
11+
background-color: #f0f0f0;
1512
}
16-
</script>
1713

18-
<script>
19-
var hpccLoader = window["@hpcc-js/loader"];
20-
</script>
14+
h1 {
15+
text-align: center;
16+
margin-top: 50px;
17+
}
2118

22-
<style>
23-
#placeholder,
24-
.placeholder {
25-
position: absolute;
26-
left: 8px;
27-
top: 8px;
28-
right: 8px;
29-
bottom: 8px;
19+
#placeholder {
20+
width: 100%;
21+
height: 500px;
22+
background-color: #fff;
23+
margin-top: 20px;
3024
}
3125
</style>
26+
<script type="importmap">
27+
{
28+
"imports": {
29+
"@observablehq/runtime": "https://cdn.jsdelivr.net/npm/@observablehq/runtime@5.9.9/dist/runtime.js",
30+
31+
"@hpcc-js/util": "../util/dist/index.js",
32+
"@hpcc-js/common": "../common/dist/index.js",
33+
"@hpcc-js/api": "../api/dist/index.js",
34+
"@hpcc-js/chart": "../chart/dist/index.js",
35+
"@hpcc-js/codemirror": "../codemirror/dist/index.js",
36+
"@hpcc-js/comms": "../comms/dist/index.js",
37+
"@hpcc-js/dgrid": "../dgrid/dist/index.js",
38+
"@hpcc-js/dgrid2": "../dgrid2/dist/index.js",
39+
"@hpcc-js/react": "../react/dist/index.js",
40+
"@hpcc-js/html": "../html/dist/index.js",
41+
"@hpcc-js/graph": "../graph/dist/index.js",
42+
"@hpcc-js/layout": "../layout/dist/index.js",
43+
"@hpcc-js/other": "../other/dist/index.js",
44+
"@hpcc-js/map": "../map/dist/index.js",
45+
"@hpcc-js/map-deck": "../map-deck/dist/index.js",
46+
"@hpcc-js/observablehq-compiler": "../observablehq-compiler/dist/index.js"
47+
}
48+
}
49+
</script>
50+
<link rel="stylesheet" href="./dist/index.css">
3251
</head>
3352

3453
<body onresize="doResize()">
35-
<div id="placeholder">
36-
</div>
37-
<script>
38-
var app;
39-
hpccLoader.amd().then(function (require) {
40-
require(["lib-umd/test"], function (testMod) {
54+
<h1>ESM Quick Test</h1>
55+
<div id="placeholder"></div>
56+
<script type="module">
57+
import { Polygons } from "@hpcc-js/map-deck";
4158

42-
app = new testMod.Test()
43-
.target("placeholder")
44-
.render();
59+
// import "@hpcc-js/common/dist/index.css";
60+
// import "@hpcc-js/common/font-awesome/css/font-awesome.min.css";
61+
// import "@hpcc-js/chart/dist/index.css";
62+
// import "@hpcc-js/dgrid2/dist/index.css";
4563

46-
});
47-
});
64+
window.__widget = new Polygons()
65+
.target("placeholder")
66+
.columns(["h3index", "polys", "weight"])
67+
.data([
68+
["822647fffffffff", [[-89.7485370040972, 36.65876042006413], [-87.99076359407903, 37.38207405857687], [-87.95138172303123, 39.0147883106185], [-89.72621630626134, 39.94722184718561], [-91.54335025644869, 39.22565620613393], [-91.52528283315517, 37.57043047609912]], 46],
69+
["82489ffffffffff", [[-98.24787904177958, 28.91983357142504], [-96.56734672388515, 29.86373079369924], [-96.66289038040519, 31.61953062690852], [-98.49387337240059, 32.44435492016832], [-100.2117838202375, 31.48993750697799], [-100.061214992845, 29.72188188001257]], 14],
70+
["82450ffffffffff", [[-88.35361313416331, 18.71869881492448], [-86.86052253318431, 19.58510743293509], [-86.81165399779584, 21.27218577811605], [-88.29590003003726, 22.12073073961633], [-89.8335894971924, 21.24816786632389], [-89.8417414487811, 19.53349485374346]], 15],
71+
["824447fffffffff", [[-91.44305997299979, 29.03851386192278], [-89.78916802666802, 29.87606801972664], [-89.7794734704032, 31.59073781085478], [-91.4744264324729, 32.49146921600194], [-93.17771064982072, 31.65113143450284], [-93.13595107051557, 29.91330256038463]], 26],
72+
["82265ffffffffff", [[-91.49084714009673, 34.20071647537129], [-89.75917248139794, 34.98489313139716], [-89.7485370040972, 36.65876042006413], [-91.52528283315517, 37.57043047609912], [-93.31108179083483, 36.78541768537119], [-93.26521175979074, 35.09010839353649]], 22],
73+
["8244b7fffffffff", [[-76.8312173516333, 23.34286288063484], [-75.445541089086, 24.01255660121923], [-75.25188715193887, 25.56875428660015], [-76.47218493325147, 26.49429123770877], [-77.90890704647856, 25.83560088252219], [-78.0732653483983, 24.24011047374086]], 1],
74+
["8226cffffffffff", [[-96.66289038040519, 31.61953062690852], [-94.94582051780957, 32.51690625937428], [-95.01750723130108, 34.24608056480459], [-96.86314528739003, 35.09305545301956], [-98.62272599746812, 34.18804644137447], [-98.49387337240059, 32.44435492016832]], 38],
75+
["8248b7fffffffff", [[-97.90563426634658, 23.58979436809323], [-96.29745134025397, 24.55902528467453], [-96.38475070596915, 26.33013314194643], [-98.13038997835126, 27.14553087371657], [-99.77344403948946, 26.16294928512754], [-99.63585556147724, 24.37894428550873]], 14],
76+
["82445ffffffffff", [[-89.7794734704032, 31.59073781085478], [-88.10173760069401, 32.37535444162421], [-88.0658863098819, 34.05983621723471], [-89.75917248139794, 34.98489313139716], [-91.49084714009673, 34.20071647537129], [-91.4744264324729, 32.49146921600194]], 13],
77+
["822677fffffffff", [[-91.4762617917987, 42.44495953871468], [-93.4580322172988, 41.74324949577916], [-93.40741416499294, 40.11435457093053], [-91.54335025644869, 39.22565620613393], [-89.7262163062613, 39.94722184718562], [-89.5783976626672, 41.51855472869031]], 21]
78+
])
79+
.polygonColumn("polys")
80+
.weightColumn("weight")
81+
.render()
82+
;
4883

84+
</script>
85+
<script>
4986
function doResize() {
50-
if (app) {
51-
app
52-
.resize()
53-
.lazyRender();
54-
}
87+
window.__widget?.resize()?.render();
5588
}
5689
</script>
5790
</body>

0 commit comments

Comments
 (0)