@trackunit/react-map-adapter-mapbox 0.0.144 → 0.0.145
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.
- package/index.cjs.js +23 -0
- package/index.esm.js +23 -0
- package/package.json +3 -3
package/index.cjs.js
CHANGED
|
@@ -159,6 +159,28 @@ const safeRemoveLayersAndSource = (map, layerIds, sourceId) => {
|
|
|
159
159
|
map.removeSource(sourceId);
|
|
160
160
|
}
|
|
161
161
|
};
|
|
162
|
+
/**
|
|
163
|
+
* `heatmap-color` over `heatmap-density` (0–1): density 0 is transparent, then the colours are evenly
|
|
164
|
+
* spaced from `1 / n` to `1`, low to high.
|
|
165
|
+
*
|
|
166
|
+
* Mapbox paints every pixel with the density-0 colour, including empty areas, so that stop must stay
|
|
167
|
+
* transparent to match deck.gl on Google.
|
|
168
|
+
*/
|
|
169
|
+
const toHeatmapColorExpression = (colorRange) => {
|
|
170
|
+
const [firstRed = 0, firstGreen = 0, firstBlue = 0] = colorRange[0] ?? [];
|
|
171
|
+
const stops = colorRange.flatMap(([red, green, blue, alpha], index) => [
|
|
172
|
+
(index + 1) / colorRange.length,
|
|
173
|
+
`rgba(${red}, ${green}, ${blue}, ${alpha})`,
|
|
174
|
+
]);
|
|
175
|
+
return [
|
|
176
|
+
"interpolate",
|
|
177
|
+
["linear"],
|
|
178
|
+
["heatmap-density"],
|
|
179
|
+
0,
|
|
180
|
+
`rgba(${firstRed}, ${firstGreen}, ${firstBlue}, 0)`,
|
|
181
|
+
...stops,
|
|
182
|
+
];
|
|
183
|
+
};
|
|
162
184
|
// ============================================================================
|
|
163
185
|
// MapboxLayerPort
|
|
164
186
|
// ============================================================================
|
|
@@ -976,6 +998,7 @@ class MapboxLayerPort {
|
|
|
976
998
|
"heatmap-radius": config.style.radiusPixels,
|
|
977
999
|
"heatmap-intensity": config.style.intensity,
|
|
978
1000
|
"heatmap-opacity": config.style.opacity,
|
|
1001
|
+
"heatmap-color": toHeatmapColorExpression(config.style.colorRange),
|
|
979
1002
|
},
|
|
980
1003
|
});
|
|
981
1004
|
this.heatmapSources.set(config.id, { sourceId, layerId, config });
|
package/index.esm.js
CHANGED
|
@@ -158,6 +158,28 @@ const safeRemoveLayersAndSource = (map, layerIds, sourceId) => {
|
|
|
158
158
|
map.removeSource(sourceId);
|
|
159
159
|
}
|
|
160
160
|
};
|
|
161
|
+
/**
|
|
162
|
+
* `heatmap-color` over `heatmap-density` (0–1): density 0 is transparent, then the colours are evenly
|
|
163
|
+
* spaced from `1 / n` to `1`, low to high.
|
|
164
|
+
*
|
|
165
|
+
* Mapbox paints every pixel with the density-0 colour, including empty areas, so that stop must stay
|
|
166
|
+
* transparent to match deck.gl on Google.
|
|
167
|
+
*/
|
|
168
|
+
const toHeatmapColorExpression = (colorRange) => {
|
|
169
|
+
const [firstRed = 0, firstGreen = 0, firstBlue = 0] = colorRange[0] ?? [];
|
|
170
|
+
const stops = colorRange.flatMap(([red, green, blue, alpha], index) => [
|
|
171
|
+
(index + 1) / colorRange.length,
|
|
172
|
+
`rgba(${red}, ${green}, ${blue}, ${alpha})`,
|
|
173
|
+
]);
|
|
174
|
+
return [
|
|
175
|
+
"interpolate",
|
|
176
|
+
["linear"],
|
|
177
|
+
["heatmap-density"],
|
|
178
|
+
0,
|
|
179
|
+
`rgba(${firstRed}, ${firstGreen}, ${firstBlue}, 0)`,
|
|
180
|
+
...stops,
|
|
181
|
+
];
|
|
182
|
+
};
|
|
161
183
|
// ============================================================================
|
|
162
184
|
// MapboxLayerPort
|
|
163
185
|
// ============================================================================
|
|
@@ -975,6 +997,7 @@ class MapboxLayerPort {
|
|
|
975
997
|
"heatmap-radius": config.style.radiusPixels,
|
|
976
998
|
"heatmap-intensity": config.style.intensity,
|
|
977
999
|
"heatmap-opacity": config.style.opacity,
|
|
1000
|
+
"heatmap-color": toHeatmapColorExpression(config.style.colorRange),
|
|
978
1001
|
},
|
|
979
1002
|
});
|
|
980
1003
|
this.heatmapSources.set(config.id, { sourceId, layerId, config });
|
package/package.json
CHANGED
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@trackunit/react-map-adapter-mapbox",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.145",
|
|
4
4
|
"repository": "https://github.com/Trackunit/manager",
|
|
5
5
|
"license": "SEE LICENSE IN LICENSE.txt",
|
|
6
6
|
"engines": {
|
|
7
7
|
"node": ">=24.x"
|
|
8
8
|
},
|
|
9
9
|
"dependencies": {
|
|
10
|
-
"@trackunit/react-map-adapter-shared": "0.0.
|
|
11
|
-
"@trackunit/geo-json-utils": "1.18.
|
|
10
|
+
"@trackunit/react-map-adapter-shared": "0.0.157",
|
|
11
|
+
"@trackunit/geo-json-utils": "1.18.6",
|
|
12
12
|
"mapbox-gl": "^3.18.1",
|
|
13
13
|
"supercluster": "^8.0.1",
|
|
14
14
|
"es-toolkit": "^1.52.0",
|