@macrostrat/column-views 3.8.0 → 3.10.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (173) hide show
  1. package/CHANGELOG.md +125 -0
  2. package/dist/animated-age-window.cjs +51 -0
  3. package/dist/animated-age-window.cjs.map +1 -0
  4. package/dist/animated-age-window.d.ts +51 -0
  5. package/dist/animated-age-window.js +51 -0
  6. package/dist/animated-age-window.js.map +1 -0
  7. package/dist/column.cjs +11 -1
  8. package/dist/column.cjs.map +1 -1
  9. package/dist/column.d.ts +11 -0
  10. package/dist/column.js +11 -1
  11. package/dist/column.js.map +1 -1
  12. package/dist/correlation-chart/main.cjs +24 -12
  13. package/dist/correlation-chart/main.cjs.map +1 -1
  14. package/dist/correlation-chart/main.d.ts +8 -1
  15. package/dist/correlation-chart/main.js +24 -12
  16. package/dist/correlation-chart/main.js.map +1 -1
  17. package/dist/data-provider/store.cjs +17 -4
  18. package/dist/data-provider/store.cjs.map +1 -1
  19. package/dist/data-provider/store.d.ts +6 -1
  20. package/dist/data-provider/store.js +17 -4
  21. package/dist/data-provider/store.js.map +1 -1
  22. package/dist/index.cjs +17 -42
  23. package/dist/index.cjs.map +1 -1
  24. package/dist/index.d.ts +3 -1
  25. package/dist/index.js +3 -34
  26. package/dist/index.js.map +1 -1
  27. package/dist/prepare-units/composite-scale.cjs +94 -8
  28. package/dist/prepare-units/composite-scale.cjs.map +1 -1
  29. package/dist/prepare-units/composite-scale.d.ts +39 -0
  30. package/dist/prepare-units/composite-scale.js +96 -10
  31. package/dist/prepare-units/composite-scale.js.map +1 -1
  32. package/dist/prepare-units/helpers.cjs +0 -1
  33. package/dist/prepare-units/helpers.cjs.map +1 -1
  34. package/dist/prepare-units/helpers.js +0 -1
  35. package/dist/prepare-units/helpers.js.map +1 -1
  36. package/dist/prepare-units/index.cjs +33 -12
  37. package/dist/prepare-units/index.cjs.map +1 -1
  38. package/dist/prepare-units/index.js +34 -13
  39. package/dist/prepare-units/index.js.map +1 -1
  40. package/dist/prepare-units/types.cjs.map +1 -1
  41. package/dist/prepare-units/types.d.ts +13 -0
  42. package/dist/prepare-units/types.js.map +1 -1
  43. package/dist/section.cjs +4 -2
  44. package/dist/section.cjs.map +1 -1
  45. package/dist/section.d.ts +4 -1
  46. package/dist/section.js +4 -2
  47. package/dist/section.js.map +1 -1
  48. package/dist/units/boxes.cjs +22 -39
  49. package/dist/units/boxes.cjs.map +1 -1
  50. package/dist/units/boxes.js +24 -41
  51. package/dist/units/boxes.js.map +1 -1
  52. package/dist/units/composite.cjs +12 -12
  53. package/dist/units/composite.cjs.map +1 -1
  54. package/dist/units/composite.js +12 -12
  55. package/dist/units/composite.js.map +1 -1
  56. package/dist/units/index.cjs +7 -11
  57. package/dist/units/index.cjs.map +1 -1
  58. package/dist/units/index.d.ts +0 -1
  59. package/dist/units/index.js +4 -9
  60. package/dist/units/index.js.map +1 -1
  61. package/package.json +10 -31
  62. package/src/animated-age-window.ts +120 -0
  63. package/src/column.ts +24 -0
  64. package/src/correlation-chart/main.ts +30 -8
  65. package/src/data-provider/store.ts +21 -2
  66. package/src/index.ts +4 -1
  67. package/src/prepare-units/composite-scale.ts +210 -10
  68. package/src/prepare-units/helpers.ts +0 -2
  69. package/src/prepare-units/index.ts +68 -14
  70. package/src/prepare-units/types.ts +13 -0
  71. package/src/section.ts +6 -0
  72. package/src/units/boxes.ts +37 -56
  73. package/src/units/composite.ts +21 -12
  74. package/src/units/index.ts +9 -26
  75. package/dist/maps/column-correlation/core.cjs +0 -288
  76. package/dist/maps/column-correlation/core.cjs.map +0 -1
  77. package/dist/maps/column-correlation/core.d.ts +0 -9
  78. package/dist/maps/column-correlation/core.js +0 -286
  79. package/dist/maps/column-correlation/core.js.map +0 -1
  80. package/dist/maps/column-correlation/index.d.ts +0 -2
  81. package/dist/maps/column-correlation/state.cjs +0 -193
  82. package/dist/maps/column-correlation/state.cjs.map +0 -1
  83. package/dist/maps/column-correlation/state.d.ts +0 -62
  84. package/dist/maps/column-correlation/state.js +0 -190
  85. package/dist/maps/column-correlation/state.js.map +0 -1
  86. package/dist/maps/column-navigation/index.d.ts +0 -2
  87. package/dist/maps/column-navigation/mapbox/index.cjs +0 -215
  88. package/dist/maps/column-navigation/mapbox/index.cjs.map +0 -1
  89. package/dist/maps/column-navigation/mapbox/index.d.ts +0 -38
  90. package/dist/maps/column-navigation/mapbox/index.js +0 -213
  91. package/dist/maps/column-navigation/mapbox/index.js.map +0 -1
  92. package/dist/maps/column-navigation/mapbox/keyboard-navigation.cjs +0 -105
  93. package/dist/maps/column-navigation/mapbox/keyboard-navigation.cjs.map +0 -1
  94. package/dist/maps/column-navigation/mapbox/keyboard-navigation.d.ts +0 -8
  95. package/dist/maps/column-navigation/mapbox/keyboard-navigation.js +0 -105
  96. package/dist/maps/column-navigation/mapbox/keyboard-navigation.js.map +0 -1
  97. package/dist/maps/column-navigation/mapbox/state.cjs +0 -73
  98. package/dist/maps/column-navigation/mapbox/state.cjs.map +0 -1
  99. package/dist/maps/column-navigation/mapbox/state.d.ts +0 -23
  100. package/dist/maps/column-navigation/mapbox/state.js +0 -71
  101. package/dist/maps/column-navigation/mapbox/state.js.map +0 -1
  102. package/dist/maps/column-navigation/svg/animated.d.ts +0 -1
  103. package/dist/maps/column-navigation/svg/data-fetcher.cjs +0 -25
  104. package/dist/maps/column-navigation/svg/data-fetcher.cjs.map +0 -1
  105. package/dist/maps/column-navigation/svg/data-fetcher.d.ts +0 -6
  106. package/dist/maps/column-navigation/svg/data-fetcher.js +0 -25
  107. package/dist/maps/column-navigation/svg/data-fetcher.js.map +0 -1
  108. package/dist/maps/column-navigation/svg/index.cjs +0 -94
  109. package/dist/maps/column-navigation/svg/index.cjs.map +0 -1
  110. package/dist/maps/column-navigation/svg/index.d.ts +0 -9
  111. package/dist/maps/column-navigation/svg/index.js +0 -93
  112. package/dist/maps/column-navigation/svg/index.js.map +0 -1
  113. package/dist/maps/column-navigation/svg/layers.cjs +0 -177
  114. package/dist/maps/column-navigation/svg/layers.cjs.map +0 -1
  115. package/dist/maps/column-navigation/svg/layers.d.ts +0 -54
  116. package/dist/maps/column-navigation/svg/layers.js +0 -174
  117. package/dist/maps/column-navigation/svg/layers.js.map +0 -1
  118. package/dist/maps/column-navigation/utils/keyboard-navigation.cjs +0 -50
  119. package/dist/maps/column-navigation/utils/keyboard-navigation.cjs.map +0 -1
  120. package/dist/maps/column-navigation/utils/keyboard-navigation.d.ts +0 -10
  121. package/dist/maps/column-navigation/utils/keyboard-navigation.js +0 -50
  122. package/dist/maps/column-navigation/utils/keyboard-navigation.js.map +0 -1
  123. package/dist/maps/index.d.ts +0 -4
  124. package/dist/maps/inset-map/index.cjs +0 -71
  125. package/dist/maps/inset-map/index.cjs.map +0 -1
  126. package/dist/maps/inset-map/index.d.ts +0 -16
  127. package/dist/maps/inset-map/index.js +0 -69
  128. package/dist/maps/inset-map/index.js.map +0 -1
  129. package/dist/maps/layers/columns.cjs +0 -165
  130. package/dist/maps/layers/columns.cjs.map +0 -1
  131. package/dist/maps/layers/columns.d.ts +0 -28
  132. package/dist/maps/layers/columns.js +0 -165
  133. package/dist/maps/layers/columns.js.map +0 -1
  134. package/dist/maps/layers/index.d.ts +0 -2
  135. package/dist/maps/layers/units.cjs +0 -207
  136. package/dist/maps/layers/units.cjs.map +0 -1
  137. package/dist/maps/layers/units.d.ts +0 -14
  138. package/dist/maps/layers/units.js +0 -204
  139. package/dist/maps/layers/units.js.map +0 -1
  140. package/dist/units/colors.cjs +0 -115
  141. package/dist/units/colors.cjs.map +0 -1
  142. package/dist/units/colors.d.ts +0 -20
  143. package/dist/units/colors.js +0 -113
  144. package/dist/units/colors.js.map +0 -1
  145. package/dist/units/resolvers.cjs +0 -125
  146. package/dist/units/resolvers.cjs.map +0 -1
  147. package/dist/units/resolvers.d.ts +0 -8
  148. package/dist/units/resolvers.js +0 -125
  149. package/dist/units/resolvers.js.map +0 -1
  150. package/src/maps/column-correlation/column-correlation-map.stories.ts +0 -108
  151. package/src/maps/column-correlation/core.ts +0 -342
  152. package/src/maps/column-correlation/index.ts +0 -2
  153. package/src/maps/column-correlation/state.ts +0 -315
  154. package/src/maps/column-navigation/index.ts +0 -2
  155. package/src/maps/column-navigation/mapbox/column-navigation-map.stories.ts +0 -278
  156. package/src/maps/column-navigation/mapbox/index.ts +0 -276
  157. package/src/maps/column-navigation/mapbox/keyboard-navigation.ts +0 -133
  158. package/src/maps/column-navigation/mapbox/state.ts +0 -119
  159. package/src/maps/column-navigation/svg/animated.ts +0 -78
  160. package/src/maps/column-navigation/svg/column-navigation-svg-map.stories.ts +0 -46
  161. package/src/maps/column-navigation/svg/data-fetcher.ts +0 -34
  162. package/src/maps/column-navigation/svg/index.ts +0 -96
  163. package/src/maps/column-navigation/svg/layers.ts +0 -233
  164. package/src/maps/column-navigation/utils/keyboard-navigation.ts +0 -58
  165. package/src/maps/index.ts +0 -4
  166. package/src/maps/inset-map/index.ts +0 -87
  167. package/src/maps/inset-map/inset-map.stories.ts +0 -20
  168. package/src/maps/layers/columns.ts +0 -216
  169. package/src/maps/layers/index.ts +0 -2
  170. package/src/maps/layers/units.ts +0 -286
  171. package/src/maps/unit-map.stories.ts +0 -79
  172. package/src/units/colors.ts +0 -183
  173. package/src/units/resolvers.ts +0 -141
@@ -1,125 +0,0 @@
1
- const symbolIndex = {
2
- "dolomite-limestone": 641,
3
- lime_mudstone: 627,
4
- sandstone: 607,
5
- "quartz arenite": 607,
6
- litharenite: 608,
7
- sand: 608,
8
- siltstone: 616,
9
- silt: 616,
10
- siliciclastic: 615,
11
- mud: 620,
12
- "dolomitic siltstone": 616,
13
- shale: 620,
14
- limestone: 627,
15
- dolomite: 642,
16
- conglomerate: 602,
17
- carbonate: 627,
18
- "dolomite-mudstone": 642,
19
- dolostone: 642,
20
- mudstone: 620,
21
- slate: 703,
22
- "sandy-dolomite": 645,
23
- quartzite: 702,
24
- halite: 668,
25
- gypsum: 667,
26
- evaporite: 667,
27
- claystone: 620,
28
- anhydrite: 667,
29
- gabbro: 720,
30
- basalt: 717,
31
- diabase: 717,
32
- rhyolite: 722,
33
- andesite: 723,
34
- till: 681,
35
- loess: 684,
36
- "calcareous ooze": 653,
37
- "siliceous ooze": 653,
38
- chalk: 626,
39
- gravel: 601,
40
- plutonic: 721,
41
- granite: 719,
42
- clay: 660,
43
- syenite: 722,
44
- tuff: 711,
45
- volcanic: 725,
46
- metamorphic: 707,
47
- volcaniclastic: 714,
48
- migmatite: 709,
49
- gneiss: 708,
50
- tonalite: 727,
51
- granodiorite: 725,
52
- monzonite: 723,
53
- argillite: 624,
54
- diamictite: 681
55
- };
56
- function getBestFGDCPatternForLithologyList(liths) {
57
- let lithsSorted = [...liths];
58
- lithsSorted.sort((a, b) => b.prop - a.prop);
59
- let firstLith = lithsSorted[0];
60
- let sym = symbolIndex[firstLith.name];
61
- if (sym != null) {
62
- return { lith: firstLith, patternID: `${sym}` };
63
- }
64
- return null;
65
- }
66
- const resolveID = (d) => {
67
- if (d.lith == null || d.lith.length == 0) {
68
- return null;
69
- }
70
- let liths = [...d.lith];
71
- let environs = d.environ.map((d2) => d2.name).join(" ");
72
- liths.sort((a, b) => b.prop - a.prop);
73
- let sym = null;
74
- if (d.unit_name == "clay") {
75
- return "650";
76
- }
77
- if (d.unit_name == "calcareous clay") {
78
- return "651";
79
- }
80
- for (const k of liths) {
81
- if (k.name == "sandstone") {
82
- if (environs.includes("dune")) {
83
- return "609";
84
- }
85
- if (environs.includes("marine")) {
86
- return "608";
87
- }
88
- if (environs.includes("shore")) {
89
- return "611";
90
- }
91
- if (environs.includes("loess")) {
92
- return "686";
93
- }
94
- }
95
- if (k.name == "conglomerate") {
96
- if (environs.includes("fluvial")) {
97
- return "603";
98
- }
99
- }
100
- if (k.name.includes("tuff")) {
101
- return "711";
102
- }
103
- sym = symbolIndex[k.name];
104
- if (sym != null) {
105
- return sym;
106
- }
107
- if (k.type == "volcanic") {
108
- return "725";
109
- }
110
- }
111
- return sym;
112
- };
113
- const patternScale = {
114
- "609": 1.5,
115
- "603": 1.5
116
- };
117
- const scalePattern = (id) => {
118
- return patternScale[`${id}`] ?? 1;
119
- };
120
- export {
121
- getBestFGDCPatternForLithologyList,
122
- resolveID,
123
- scalePattern
124
- };
125
- //# sourceMappingURL=resolvers.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"resolvers.js","sources":["../../src/units/resolvers.ts"],"sourcesContent":["import { Lithology, UnitLithology } from \"@macrostrat/api-types\";\nimport { LithologyCore } from \"@macrostrat/api-types/src/lithologies\";\n\nconst symbolIndex = {\n \"dolomite-limestone\": 641,\n lime_mudstone: 627,\n sandstone: 607,\n \"quartz arenite\": 607,\n litharenite: 608,\n sand: 608,\n siltstone: 616,\n silt: 616,\n siliciclastic: 615,\n mud: 620,\n \"dolomitic siltstone\": 616,\n shale: 620,\n limestone: 627,\n dolomite: 642,\n conglomerate: 602,\n carbonate: 627,\n \"dolomite-mudstone\": 642,\n dolostone: 642,\n mudstone: 620,\n slate: 703,\n \"sandy-dolomite\": 645,\n quartzite: 702,\n halite: 668,\n gypsum: 667,\n evaporite: 667,\n claystone: 620,\n anhydrite: 667,\n gabbro: 720,\n basalt: 717,\n diabase: 717,\n rhyolite: 722,\n andesite: 723,\n till: 681,\n loess: 684,\n \"calcareous ooze\": 653,\n \"siliceous ooze\": 653,\n chalk: 626,\n gravel: 601,\n plutonic: 721,\n granite: 719,\n clay: 660,\n syenite: 722,\n tuff: 711,\n volcanic: 725,\n metamorphic: 707,\n volcaniclastic: 714,\n migmatite: 709,\n gneiss: 708,\n tonalite: 727,\n granodiorite: 725,\n monzonite: 723,\n argillite: 624,\n diamictite: 681,\n};\n\nexport function getBestFGDCPatternForLithologyList<\n T extends UnitLithology | Lithology,\n>(liths: T[]): { lith: T; patternID: string } | null {\n let lithsSorted = [...liths];\n lithsSorted.sort((a, b) => b.prop - a.prop);\n let firstLith = lithsSorted[0];\n let sym = symbolIndex[firstLith.name];\n if (sym != null) {\n return { lith: firstLith, patternID: `${sym}` };\n }\n return null;\n}\n\nconst resolveID = (d: any) => {\n if (d.lith == null || d.lith.length == 0) {\n return null;\n }\n let liths = [...d.lith];\n let environs = d.environ.map((d) => d.name).join(\" \");\n liths.sort((a, b) => b.prop - a.prop);\n\n //console.log(d, d.unit_name, liths.map(d => d.name), environs)\n\n let sym = null;\n\n // overrides for IODP columns\n if (d.unit_name == \"clay\") {\n return \"650\";\n }\n if (d.unit_name == \"calcareous clay\") {\n return \"651\";\n }\n\n for (const k of liths) {\n if (k.name == \"sandstone\") {\n // Special cases for sandstone\n if (environs.includes(\"dune\")) {\n return \"609\";\n }\n if (environs.includes(\"marine\")) {\n return \"608\";\n }\n if (environs.includes(\"shore\")) {\n return \"611\";\n }\n if (environs.includes(\"loess\")) {\n return \"686\";\n }\n }\n\n if (k.name == \"conglomerate\") {\n // Special cases for sandstone\n if (environs.includes(\"fluvial\")) {\n return \"603\";\n }\n }\n\n if (k.name.includes(\"tuff\")) {\n return \"711\";\n }\n sym = symbolIndex[k.name];\n if (sym != null) {\n return sym;\n }\n\n if (k.type == \"volcanic\") {\n return \"725\";\n }\n }\n return sym;\n};\n\nconst patternScale = {\n \"609\": 1.5,\n \"603\": 1.5,\n};\n\nconst scalePattern = (id) => {\n return patternScale[`${id}`] ?? 1;\n};\n\nexport { resolveID, scalePattern };\n"],"names":["d"],"mappings":"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"}
@@ -1,108 +0,0 @@
1
- import h from "@macrostrat/hyper";
2
-
3
- const mapboxToken = import.meta.env.VITE_MAPBOX_API_TOKEN;
4
-
5
- import { Meta } from "@storybook/react-vite";
6
- import {
7
- ColumnCorrelationMap,
8
- ColumnCorrelationProvider,
9
- CorrelationMapProps,
10
- CorrelationProviderProps,
11
- } from ".";
12
-
13
- function ColumnCorrelationMapExt(
14
- props: CorrelationMapProps & CorrelationProviderProps,
15
- ) {
16
- const {
17
- focusedLine,
18
- manualColumns,
19
- columns,
20
- onSelectColumns,
21
- projectID,
22
- inProcess,
23
- ...rest
24
- } = props;
25
-
26
- return h(
27
- ColumnCorrelationProvider,
28
- {
29
- focusedLine,
30
- manualColumns,
31
- columns,
32
- onSelectColumns,
33
- projectID,
34
- inProcess,
35
- },
36
- h(ColumnCorrelationMap, { accessToken: mapboxToken, ...rest }),
37
- );
38
- }
39
-
40
- // More on default export: https://storybook.js.org/docs/react/writing-stories/introduction#default-export
41
- export default {
42
- title: "Column views/Maps/Column correlation",
43
- component: ColumnCorrelationMapExt,
44
- description: "Cross section creation map",
45
- } as Meta<typeof ColumnCorrelationMapExt>;
46
-
47
- export const ColumnCorrelation = {
48
- args: {
49
- style: { width: "800px", height: "600px" },
50
- padding: 100,
51
- },
52
- };
53
-
54
- export const withPreloadedCrossSection = {
55
- args: {
56
- style: { width: "800px", height: "600px" },
57
- padding: 100,
58
- focusedLine: {
59
- type: "LineString",
60
- coordinates: [
61
- [-122.399, 37.791],
62
- [-100, 45],
63
- ],
64
- },
65
- },
66
- };
67
-
68
- // Manual selection: click columns to add/remove them (no line of section).
69
- // Hovering highlights a column; the dashed line shows the selection order.
70
- export const manualColumnSelection = {
71
- args: {
72
- style: { width: "800px", height: "600px" },
73
- padding: 100,
74
- manualColumns: [432, 490],
75
- },
76
- };
77
-
78
- export const nonStandardProject = {
79
- args: {
80
- style: { width: "800px", height: "600px" },
81
- padding: 100,
82
- projectID: 10,
83
- inProcess: true,
84
- mapPosition: {
85
- camera: {
86
- lng: -100,
87
- lat: 38,
88
- altitude: 5000000,
89
- },
90
- },
91
- },
92
- };
93
-
94
- export const eODP = {
95
- args: {
96
- style: { width: "800px", height: "600px" },
97
- padding: 100,
98
- projectID: 3,
99
- inProcess: true,
100
- mapPosition: {
101
- camera: {
102
- lng: -100,
103
- lat: 38,
104
- altitude: 5000000,
105
- },
106
- },
107
- },
108
- };
@@ -1,342 +0,0 @@
1
- import {
2
- useMapClickHandler,
3
- useMapEaseTo,
4
- useMapStyleOperator,
5
- useOverlayStyle,
6
- } from "@macrostrat/mapbox-react";
7
- import { LngLatBounds, Style } from "mapbox-gl";
8
- import h from "@macrostrat/hyper";
9
- import { Feature, FeatureCollection } from "geojson";
10
- import { ReactNode, useMemo, useRef } from "react";
11
- import { setGeoJSON, buildGeoJSONSource } from "@macrostrat/mapbox-utils";
12
-
13
- import { useCorrelationMapStore } from "./state";
14
- import { InsetMap, type InsetMapProps } from "../inset-map";
15
- import { BaseColumnsLayer } from "../layers";
16
- import { buildCrossSectionLayers } from "@macrostrat/map-styles";
17
-
18
- export interface CorrelationMapProps extends InsetMapProps {
19
- padding?: number;
20
- children?: ReactNode;
21
- accessToken?: string;
22
- columnColor?: string;
23
- }
24
-
25
- export function ColumnCorrelationMap(props: CorrelationMapProps) {
26
- const { padding = 50, children, columnColor, projectID, ...rest } = props;
27
-
28
- return h(
29
- InsetMap,
30
- {
31
- ...rest,
32
- boxZoom: false,
33
- dragRotate: false,
34
- },
35
- [
36
- h(ColumnsLayer, { color: columnColor }),
37
- h(SelectedColumnsLayer),
38
- h(MapClickHandler),
39
- h(ColumnInteractionHandler),
40
- h(HoveredColumnHighlight),
41
- h(ColumnZoomer, { padding }),
42
- h(SectionLine, { padding }),
43
- children,
44
- ],
45
- );
46
- }
47
-
48
- function ColumnZoomer({ padding }: { padding: number }) {
49
- /** Frame a single column when `zoomColumn` is set (e.g. header click). */
50
- const zoomColumn = useCorrelationMapStore((state) => state.zoomColumn);
51
- const zoomNonce = useCorrelationMapStore((state) => state.zoomNonce);
52
- const columns = useCorrelationMapStore((state) => state.columns);
53
-
54
- const bounds = useMemo(() => {
55
- if (zoomColumn == null || columns == null) return null;
56
- const col = columns.find((c) => c.properties?.col_id === zoomColumn);
57
- if (col?.geometry == null) return null;
58
- const b = new LngLatBounds();
59
- forEachCoordinate(col.geometry, (coord) => b.extend(coord as [number, number]));
60
- return b.isEmpty() ? null : b;
61
- // zoomNonce forces a fresh bounds object so repeat clicks re-frame
62
- }, [zoomColumn, zoomNonce, columns]);
63
-
64
- useMapEaseTo({ bounds, padding: padding * 2 });
65
- return null;
66
- }
67
-
68
- function forEachCoordinate(geometry: any, fn: (coord: number[]) => void) {
69
- const walk = (coords: any) => {
70
- if (typeof coords[0] === "number") {
71
- fn(coords);
72
- } else {
73
- for (const c of coords) walk(c);
74
- }
75
- };
76
- if (geometry?.coordinates != null) walk(geometry.coordinates);
77
- }
78
-
79
- const columnLayers = ["columns-fill", "columns-points"];
80
-
81
- function MapClickHandler() {
82
- const onClickMap = useCorrelationMapStore((state) => state.onClickMap);
83
-
84
- useMapClickHandler(
85
- (e) => {
86
- onClickMap(e, { type: "Point", coordinates: e.lngLat.toArray() });
87
- },
88
- [onClickMap],
89
- );
90
-
91
- return null;
92
- }
93
-
94
- function ColumnInteractionHandler() {
95
- /** Per-column click (manual selection) and hover highlighting. */
96
- const toggleColumn = useCorrelationMapStore((state) => state.toggleColumn);
97
- const setHoveredColumn = useCorrelationMapStore(
98
- (state) => state.setHoveredColumn,
99
- );
100
- const isManual = useCorrelationMapStore(
101
- (state) => state.selectionMode === "manual",
102
- );
103
- const hoveredRef = useRef<number | string | null>(null);
104
-
105
- // Click a column to toggle it in/out of the selection (manual mode only)
106
- useMapStyleOperator(
107
- (map) => {
108
- if (!isManual) return;
109
- const onClick = (e) => {
110
- const colID = e.features?.[0]?.properties?.col_id;
111
- if (colID != null) toggleColumn(colID);
112
- };
113
- map.on("click", columnLayers, onClick);
114
- return () => map.off("click", columnLayers, onClick);
115
- },
116
- [isManual, toggleColumn],
117
- );
118
-
119
- // Hover highlighting (via the columns layer's `hover` feature-state)
120
- useMapStyleOperator(
121
- (map) => {
122
- const clearHover = () => {
123
- if (hoveredRef.current != null) {
124
- map.setFeatureState(
125
- { source: "columns", id: hoveredRef.current },
126
- { hover: false },
127
- );
128
- hoveredRef.current = null;
129
- }
130
- };
131
- const onMove = (e) => {
132
- const f = e.features?.[0];
133
- if (f == null) return;
134
- if (hoveredRef.current !== f.id) {
135
- clearHover();
136
- map.setFeatureState({ source: "columns", id: f.id }, { hover: true });
137
- hoveredRef.current = f.id;
138
- }
139
- setHoveredColumn(f.properties?.col_id ?? null);
140
- map.getCanvas().style.cursor = "pointer";
141
- };
142
- const onLeave = () => {
143
- clearHover();
144
- setHoveredColumn(null);
145
- map.getCanvas().style.cursor = "";
146
- };
147
- map.on("mousemove", columnLayers, onMove);
148
- map.on("mouseleave", columnLayers, onLeave);
149
- return () => {
150
- map.off("mousemove", columnLayers, onMove);
151
- map.off("mouseleave", columnLayers, onLeave);
152
- clearHover();
153
- };
154
- },
155
- [setHoveredColumn],
156
- );
157
-
158
- return null;
159
- }
160
-
161
- function HoveredColumnHighlight() {
162
- /** Reflects the store's `hoveredColumn` on the map (e.g. when a column is
163
- * hovered elsewhere in the UI) using the `highlighted` feature-state. */
164
- const hoveredColumn = useCorrelationMapStore((state) => state.hoveredColumn);
165
- const columns = useCorrelationMapStore((state) => state.columns);
166
- const appliedRef = useRef<number | string | null>(null);
167
-
168
- useMapStyleOperator(
169
- (map) => {
170
- if (appliedRef.current != null) {
171
- map.setFeatureState(
172
- { source: "columns", id: appliedRef.current },
173
- { highlighted: false },
174
- );
175
- appliedRef.current = null;
176
- }
177
- if (hoveredColumn == null || columns == null) return;
178
- const col = columns.find((c) => c.properties?.col_id === hoveredColumn);
179
- const id = (col as any)?.id ?? col?.properties?.col_id;
180
- if (id == null) return;
181
- map.setFeatureState({ source: "columns", id }, { highlighted: true });
182
- appliedRef.current = id;
183
- },
184
- [hoveredColumn, columns],
185
- );
186
-
187
- return null;
188
- }
189
-
190
- function SelectedColumnsLayer() {
191
- useOverlayStyle(() => selectedColumnsStyle, []);
192
-
193
- const focusedColumns = useCorrelationMapStore(
194
- (state) => state.focusedColumns,
195
- );
196
-
197
- useMapStyleOperator(
198
- (map) => {
199
- let features = focusedColumns;
200
-
201
- const data: FeatureCollection = {
202
- type: "FeatureCollection",
203
- features,
204
- };
205
-
206
- const columnCentroidLine: Feature = {
207
- type: "Feature",
208
- geometry: {
209
- type: "LineString",
210
- coordinates: features.map(
211
- (col) => col.properties.centroid.geometry.coordinates,
212
- ),
213
- },
214
- properties: {},
215
- };
216
-
217
- setGeoJSON(map, "selected-columns", data);
218
- setGeoJSON(map, "selected-column-centroids", {
219
- type: "FeatureCollection",
220
- features: [columnCentroidLine],
221
- });
222
- },
223
- [focusedColumns],
224
- );
225
- return null;
226
- }
227
-
228
- function ColumnsLayer({ enabled = true, color }) {
229
- const columns = useCorrelationMapStore((state) => state.columns);
230
- return h(BaseColumnsLayer, { enabled, color, columns });
231
- }
232
-
233
- const selectedColumnsStyle: Style = {
234
- version: 8,
235
- sources: {
236
- "selected-columns": buildGeoJSONSource(),
237
- "selected-column-centroids": buildGeoJSONSource(),
238
- },
239
- layers: [
240
- {
241
- id: "selected-columns-fill",
242
- type: "fill",
243
- source: "selected-columns",
244
- paint: {
245
- "fill-color": "rgba(255, 0, 0, 0.1)",
246
- },
247
- },
248
- {
249
- id: "selected-column-centroids-line",
250
- type: "line",
251
- source: "selected-column-centroids",
252
- paint: {
253
- "line-color": "rgba(255, 0, 0, 0.8)",
254
- "line-width": 2,
255
- "line-dasharray": [2, 2],
256
- },
257
- },
258
- {
259
- id: "selected-column-centroids-points",
260
- type: "circle",
261
- source: "selected-column-centroids",
262
- paint: {
263
- "circle-radius": 4,
264
- "circle-color": "rgba(255, 0, 0, 0.8)",
265
- },
266
- },
267
- ],
268
- };
269
-
270
- const lineOfSectionStyle: Style = {
271
- version: 8,
272
- sources: {
273
- elevationMarker: buildGeoJSONSource(),
274
- crossSectionLine: buildGeoJSONSource(),
275
- crossSectionEndpoints: buildGeoJSONSource(),
276
- },
277
- layers: buildCrossSectionLayers(),
278
- };
279
-
280
- function SectionLine({ padding }: { padding: number }) {
281
- useOverlayStyle(() => lineOfSectionStyle, []);
282
- const focusedLine = useCorrelationMapStore((state) => state.focusedLine);
283
- const focusedColumns = useCorrelationMapStore(
284
- (state) => state.focusedColumns,
285
- );
286
-
287
- // Setup focused line (only drawn in line-of-section mode)
288
- useMapStyleOperator(
289
- (map) => {
290
- if (focusedLine == null) {
291
- // Clear any previously-drawn line (e.g. after switching to manual mode)
292
- setGeoJSON(map, "crossSectionLine", emptyFeatureCollection);
293
- setGeoJSON(map, "crossSectionEndpoints", emptyFeatureCollection);
294
- return;
295
- }
296
- const data: FeatureCollection = {
297
- type: "FeatureCollection",
298
- features: [
299
- {
300
- type: "Feature",
301
- geometry: focusedLine,
302
- properties: { id: "focusedLine" },
303
- },
304
- ],
305
- };
306
-
307
- setGeoJSON(map, "crossSectionLine", data);
308
- setGeoJSON(map, "crossSectionEndpoints", {
309
- type: "FeatureCollection",
310
- features: focusedLine.coordinates.map((coord) => ({
311
- type: "Feature",
312
- geometry: { type: "Point", coordinates: coord },
313
- properties: {},
314
- })),
315
- });
316
- },
317
- [focusedLine],
318
- );
319
-
320
- const bounds = useMemo(() => {
321
- // In line mode, frame the line; in manual mode, frame the selected columns
322
- const coords: number[][] =
323
- focusedLine != null && focusedLine.coordinates.length >= 2
324
- ? focusedLine.coordinates
325
- : focusedColumns.map((c) => c.properties.centroid.geometry.coordinates);
326
- if (coords.length < 2) return null;
327
- const bounds = new LngLatBounds();
328
- for (const coord of coords) {
329
- bounds.extend(coord as [number, number]);
330
- }
331
- return bounds;
332
- }, [focusedLine, focusedColumns]);
333
-
334
- useMapEaseTo({ bounds, padding, trackResize: true });
335
-
336
- return null;
337
- }
338
-
339
- const emptyFeatureCollection: FeatureCollection = {
340
- type: "FeatureCollection",
341
- features: [],
342
- };
@@ -1,2 +0,0 @@
1
- export * from "./core";
2
- export * from "./state";