@bpd-library/components 1.3.2-beta.2 → 1.3.2-beta.5
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/dist/molecules/map/map.js +9 -4
- package/dist/molecules/map/map.js.map +1 -1
- package/dist/molecules/map/store/map/store.d.ts +1 -7
- package/dist/molecules/map/store/map/store.js +0 -32
- package/dist/molecules/map/store/map/store.js.map +1 -1
- package/dist/molecules/map/store/store.d.ts +3 -0
- package/dist/molecules/map/store/store.js +8 -0
- package/dist/molecules/map/store/store.js.map +1 -1
- package/dist/molecules/map/utilities/mapbox/pointers/setup-pointers.js +32 -2
- package/dist/molecules/map/utilities/mapbox/pointers/setup-pointers.js.map +1 -1
- package/dist/molecules/map/utilities/mapbox/search/search.d.ts +1 -1
- package/dist/molecules/map/utilities/mapbox/search/search.js +8 -4
- package/dist/molecules/map/utilities/mapbox/search/search.js.map +1 -1
- package/package.json +4 -4
- package/dist/esm/atoms/button/button.js +0 -33
- package/dist/esm/atoms/button/button.js.map +0 -1
- package/dist/esm/atoms/col/col.js +0 -22
- package/dist/esm/atoms/col/col.js.map +0 -1
- package/dist/esm/atoms/container/container.js +0 -6
- package/dist/esm/atoms/container/container.js.map +0 -1
- package/dist/esm/atoms/form-elements/range-slider/range-slider.js +0 -21
- package/dist/esm/atoms/form-elements/range-slider/range-slider.js.map +0 -1
- package/dist/esm/atoms/form-elements/utilities/range-slider.js +0 -100
- package/dist/esm/atoms/form-elements/utilities/range-slider.js.map +0 -1
- package/dist/esm/atoms/image/image.js +0 -18
- package/dist/esm/atoms/image/image.js.map +0 -1
- package/dist/esm/atoms/image/utilities/create-image-url.js +0 -15
- package/dist/esm/atoms/image/utilities/create-image-url.js.map +0 -1
- package/dist/esm/atoms/row/row.js +0 -6
- package/dist/esm/atoms/row/row.js.map +0 -1
- package/dist/esm/atoms/svg/svg.js +0 -25
- package/dist/esm/atoms/svg/svg.js.map +0 -1
- package/dist/esm/index.js +0 -14
- package/dist/esm/index.js.map +0 -1
- package/dist/esm/molecules/infobox/infobox.js +0 -20
- package/dist/esm/molecules/infobox/infobox.js.map +0 -1
- package/dist/esm/molecules/map/map.js +0 -256
- package/dist/esm/molecules/map/map.js.map +0 -1
- package/dist/esm/molecules/map/store/map/store.js +0 -150
- package/dist/esm/molecules/map/store/map/store.js.map +0 -1
- package/dist/esm/molecules/map/utilities/fit-bounds.js +0 -4
- package/dist/esm/molecules/map/utilities/fit-bounds.js.map +0 -1
- package/dist/esm/molecules/map/utilities/mapbox/add-data.js +0 -54
- package/dist/esm/molecules/map/utilities/mapbox/add-data.js.map +0 -1
- package/dist/esm/molecules/map/utilities/mapbox/center.js +0 -15
- package/dist/esm/molecules/map/utilities/mapbox/center.js.map +0 -1
- package/dist/esm/molecules/map/utilities/mapbox/constants.js +0 -5
- package/dist/esm/molecules/map/utilities/mapbox/constants.js.map +0 -1
- package/dist/esm/molecules/map/utilities/mapbox/index.js +0 -3
- package/dist/esm/molecules/map/utilities/mapbox/index.js.map +0 -1
- package/dist/esm/molecules/map/utilities/mapbox/mapbox.js +0 -27
- package/dist/esm/molecules/map/utilities/mapbox/mapbox.js.map +0 -1
- package/dist/esm/molecules/map/utilities/mapbox/parse-feature-properties.js +0 -18
- package/dist/esm/molecules/map/utilities/mapbox/parse-feature-properties.js.map +0 -1
- package/dist/esm/molecules/map/utilities/mapbox/pointers/setup-pointers.js +0 -151
- package/dist/esm/molecules/map/utilities/mapbox/pointers/setup-pointers.js.map +0 -1
- package/dist/esm/molecules/map/utilities/mapbox/polygons/feature-state.js +0 -11
- package/dist/esm/molecules/map/utilities/mapbox/polygons/feature-state.js.map +0 -1
- package/dist/esm/molecules/map/utilities/mapbox/polygons/geojson.js +0 -10
- package/dist/esm/molecules/map/utilities/mapbox/polygons/geojson.js.map +0 -1
- package/dist/esm/molecules/map/utilities/mapbox/polygons/interaction.js +0 -34
- package/dist/esm/molecules/map/utilities/mapbox/polygons/interaction.js.map +0 -1
- package/dist/esm/molecules/map/utilities/mapbox/polygons/layer.js +0 -110
- package/dist/esm/molecules/map/utilities/mapbox/polygons/layer.js.map +0 -1
- package/dist/esm/molecules/map/utilities/mapbox/raster.js +0 -43
- package/dist/esm/molecules/map/utilities/mapbox/raster.js.map +0 -1
- package/dist/esm/molecules/map/utilities/mapbox/search/alternative-city-suggestions.js +0 -27
- package/dist/esm/molecules/map/utilities/mapbox/search/alternative-city-suggestions.js.map +0 -1
- package/dist/esm/molecules/map/utilities/mapbox/search/search.js +0 -174
- package/dist/esm/molecules/map/utilities/mapbox/search/search.js.map +0 -1
- package/dist/esm/molecules/map/utilities/mapbox/tooltip.js +0 -26
- package/dist/esm/molecules/map/utilities/mapbox/tooltip.js.map +0 -1
- package/dist/esm/molecules/tooltip/tooltip.js +0 -14
- package/dist/esm/molecules/tooltip/tooltip.js.map +0 -1
- package/dist/esm/node_modules/tslib/tslib.es6.js +0 -24
- package/dist/esm/node_modules/tslib/tslib.es6.js.map +0 -1
- package/dist/lib/atoms/button/button.js +0 -31
- package/dist/lib/atoms/button/button.js.map +0 -1
- package/dist/lib/atoms/button/index.js +0 -2
- package/dist/lib/atoms/button/index.js.map +0 -1
- package/dist/lib/atoms/col/col.js +0 -19
- package/dist/lib/atoms/col/col.js.map +0 -1
- package/dist/lib/atoms/container/container.js +0 -3
- package/dist/lib/atoms/container/container.js.map +0 -1
- package/dist/lib/atoms/form-elements/range-slider/range-slider.js +0 -18
- package/dist/lib/atoms/form-elements/range-slider/range-slider.js.map +0 -1
- package/dist/lib/atoms/form-elements/utilities/range-slider.js +0 -97
- package/dist/lib/atoms/form-elements/utilities/range-slider.js.map +0 -1
- package/dist/lib/atoms/image/image.js +0 -15
- package/dist/lib/atoms/image/image.js.map +0 -1
- package/dist/lib/atoms/image/index.js +0 -2
- package/dist/lib/atoms/image/index.js.map +0 -1
- package/dist/lib/atoms/image/utilities/create-image-url.js +0 -14
- package/dist/lib/atoms/image/utilities/create-image-url.js.map +0 -1
- package/dist/lib/atoms/image/utilities/detect-responsive-images.js +0 -24
- package/dist/lib/atoms/image/utilities/detect-responsive-images.js.map +0 -1
- package/dist/lib/atoms/image/utilities/image.js +0 -86
- package/dist/lib/atoms/image/utilities/image.js.map +0 -1
- package/dist/lib/atoms/image/utilities/object-fit.js +0 -35
- package/dist/lib/atoms/image/utilities/object-fit.js.map +0 -1
- package/dist/lib/atoms/row/row.js +0 -3
- package/dist/lib/atoms/row/row.js.map +0 -1
- package/dist/lib/atoms/svg/svg.js +0 -23
- package/dist/lib/atoms/svg/svg.js.map +0 -1
- package/dist/lib/index.js +0 -12
- package/dist/lib/index.js.map +0 -1
- package/dist/lib/molecules/infobox/index.js +0 -2
- package/dist/lib/molecules/infobox/index.js.map +0 -1
- package/dist/lib/molecules/infobox/infobox.js +0 -17
- package/dist/lib/molecules/infobox/infobox.js.map +0 -1
- package/dist/lib/molecules/map/hooks/use-style-loaded.js +0 -14
- package/dist/lib/molecules/map/hooks/use-style-loaded.js.map +0 -1
- package/dist/lib/molecules/map/index.js +0 -4
- package/dist/lib/molecules/map/index.js.map +0 -1
- package/dist/lib/molecules/map/map.js +0 -256
- package/dist/lib/molecules/map/map.js.map +0 -1
- package/dist/lib/molecules/map/store/map/index.js +0 -2
- package/dist/lib/molecules/map/store/map/index.js.map +0 -1
- package/dist/lib/molecules/map/store/map/store.js +0 -147
- package/dist/lib/molecules/map/store/map/store.js.map +0 -1
- package/dist/lib/molecules/map/storybook/themes.js +0 -54
- package/dist/lib/molecules/map/storybook/themes.js.map +0 -1
- package/dist/lib/molecules/map/utilities/fit-bounds.js +0 -2
- package/dist/lib/molecules/map/utilities/fit-bounds.js.map +0 -1
- package/dist/lib/molecules/map/utilities/mapbox/add-data.js +0 -52
- package/dist/lib/molecules/map/utilities/mapbox/add-data.js.map +0 -1
- package/dist/lib/molecules/map/utilities/mapbox/center.js +0 -13
- package/dist/lib/molecules/map/utilities/mapbox/center.js.map +0 -1
- package/dist/lib/molecules/map/utilities/mapbox/constants.js +0 -3
- package/dist/lib/molecules/map/utilities/mapbox/constants.js.map +0 -1
- package/dist/lib/molecules/map/utilities/mapbox/index.js +0 -3
- package/dist/lib/molecules/map/utilities/mapbox/index.js.map +0 -1
- package/dist/lib/molecules/map/utilities/mapbox/mapbox.js +0 -25
- package/dist/lib/molecules/map/utilities/mapbox/mapbox.js.map +0 -1
- package/dist/lib/molecules/map/utilities/mapbox/parse-feature-properties.js +0 -16
- package/dist/lib/molecules/map/utilities/mapbox/parse-feature-properties.js.map +0 -1
- package/dist/lib/molecules/map/utilities/mapbox/pointers/setup-pointers.js +0 -151
- package/dist/lib/molecules/map/utilities/mapbox/pointers/setup-pointers.js.map +0 -1
- package/dist/lib/molecules/map/utilities/mapbox/polygons/feature-state.js +0 -10
- package/dist/lib/molecules/map/utilities/mapbox/polygons/feature-state.js.map +0 -1
- package/dist/lib/molecules/map/utilities/mapbox/polygons/geojson.js +0 -9
- package/dist/lib/molecules/map/utilities/mapbox/polygons/geojson.js.map +0 -1
- package/dist/lib/molecules/map/utilities/mapbox/polygons/interaction.js +0 -32
- package/dist/lib/molecules/map/utilities/mapbox/polygons/interaction.js.map +0 -1
- package/dist/lib/molecules/map/utilities/mapbox/polygons/layer.js +0 -109
- package/dist/lib/molecules/map/utilities/mapbox/polygons/layer.js.map +0 -1
- package/dist/lib/molecules/map/utilities/mapbox/raster.js +0 -42
- package/dist/lib/molecules/map/utilities/mapbox/raster.js.map +0 -1
- package/dist/lib/molecules/map/utilities/mapbox/search/alternative-city-suggestions.js +0 -26
- package/dist/lib/molecules/map/utilities/mapbox/search/alternative-city-suggestions.js.map +0 -1
- package/dist/lib/molecules/map/utilities/mapbox/search/search.js +0 -172
- package/dist/lib/molecules/map/utilities/mapbox/search/search.js.map +0 -1
- package/dist/lib/molecules/map/utilities/mapbox/tooltip.js +0 -24
- package/dist/lib/molecules/map/utilities/mapbox/tooltip.js.map +0 -1
- package/dist/lib/molecules/tooltip/index.js +0 -2
- package/dist/lib/molecules/tooltip/index.js.map +0 -1
- package/dist/lib/molecules/tooltip/tooltip.js +0 -11
- package/dist/lib/molecules/tooltip/tooltip.js.map +0 -1
- package/dist/types/atoms/button/button.d.ts +0 -17
- package/dist/types/atoms/button/index.d.ts +0 -1
- package/dist/types/atoms/col/col.d.ts +0 -11
- package/dist/types/atoms/container/container.d.ts +0 -6
- package/dist/types/atoms/form-elements/range-slider/range-slider.d.ts +0 -11
- package/dist/types/atoms/form-elements/utilities/range-slider.d.ts +0 -7
- package/dist/types/atoms/image/image.d.ts +0 -14
- package/dist/types/atoms/image/index.d.ts +0 -1
- package/dist/types/atoms/image/utilities/create-image-url.d.ts +0 -6
- package/dist/types/atoms/image/utilities/detect-responsive-images.d.ts +0 -7
- package/dist/types/atoms/image/utilities/image.d.ts +0 -18
- package/dist/types/atoms/image/utilities/object-fit.d.ts +0 -7
- package/dist/types/atoms/row/row.d.ts +0 -6
- package/dist/types/atoms/svg/svg.d.ts +0 -4
- package/dist/types/index.d.ts +0 -11
- package/dist/types/molecules/infobox/index.d.ts +0 -1
- package/dist/types/molecules/infobox/infobox.d.ts +0 -7
- package/dist/types/molecules/map/hooks/use-style-loaded.d.ts +0 -2
- package/dist/types/molecules/map/index.d.ts +0 -3
- package/dist/types/molecules/map/map.d.ts +0 -2
- package/dist/types/molecules/map/store/map/index.d.ts +0 -1
- package/dist/types/molecules/map/store/map/store.d.ts +0 -60
- package/dist/types/molecules/map/storybook/themes.d.ts +0 -3
- package/dist/types/molecules/map/utilities/fit-bounds.d.ts +0 -3
- package/dist/types/molecules/map/utilities/mapbox/add-data.d.ts +0 -3
- package/dist/types/molecules/map/utilities/mapbox/center.d.ts +0 -3
- package/dist/types/molecules/map/utilities/mapbox/constants.d.ts +0 -2
- package/dist/types/molecules/map/utilities/mapbox/index.d.ts +0 -2
- package/dist/types/molecules/map/utilities/mapbox/mapbox.d.ts +0 -16
- package/dist/types/molecules/map/utilities/mapbox/parse-feature-properties.d.ts +0 -6
- package/dist/types/molecules/map/utilities/mapbox/pointers/setup-pointers.d.ts +0 -3
- package/dist/types/molecules/map/utilities/mapbox/polygons/feature-state.d.ts +0 -2
- package/dist/types/molecules/map/utilities/mapbox/polygons/geojson.d.ts +0 -3
- package/dist/types/molecules/map/utilities/mapbox/polygons/interaction.d.ts +0 -3
- package/dist/types/molecules/map/utilities/mapbox/polygons/layer.d.ts +0 -3
- package/dist/types/molecules/map/utilities/mapbox/raster.d.ts +0 -3
- package/dist/types/molecules/map/utilities/mapbox/search/alternative-city-suggestions.d.ts +0 -3
- package/dist/types/molecules/map/utilities/mapbox/search/search.d.ts +0 -4
- package/dist/types/molecules/map/utilities/mapbox/tooltip.d.ts +0 -4
- package/dist/types/molecules/tooltip/index.d.ts +0 -1
- package/dist/types/molecules/tooltip/tooltip.d.ts +0 -7
|
@@ -1,54 +0,0 @@
|
|
|
1
|
-
import { h } from '@atomify/jsx';
|
|
2
|
-
const THEME = {
|
|
3
|
-
polygon: {
|
|
4
|
-
settings: [
|
|
5
|
-
{
|
|
6
|
-
variant: 'bouwnummer',
|
|
7
|
-
normal: {
|
|
8
|
-
fill: [255, 0, 0, 0.5],
|
|
9
|
-
stroke: [255, 255, 255, 1],
|
|
10
|
-
},
|
|
11
|
-
hover: {
|
|
12
|
-
fill: [0, 0, 0, 1],
|
|
13
|
-
stroke: [255, 255, 255, 1],
|
|
14
|
-
},
|
|
15
|
-
},
|
|
16
|
-
{
|
|
17
|
-
variant: 'woningtype',
|
|
18
|
-
normal: {
|
|
19
|
-
fill: [0, 255, 0, 0.5],
|
|
20
|
-
stroke: [255, 255, 255, 1],
|
|
21
|
-
},
|
|
22
|
-
hover: {
|
|
23
|
-
fill: [0, 0, 0, 1],
|
|
24
|
-
stroke: [255, 255, 255, 1],
|
|
25
|
-
},
|
|
26
|
-
},
|
|
27
|
-
],
|
|
28
|
-
},
|
|
29
|
-
pointer: {
|
|
30
|
-
settings: [
|
|
31
|
-
{
|
|
32
|
-
variant: 'bouwnummer',
|
|
33
|
-
createElement: () => (h("div", { style: {
|
|
34
|
-
width: '40px',
|
|
35
|
-
height: '40px',
|
|
36
|
-
'border-radius': '50%',
|
|
37
|
-
'background-color': 'green',
|
|
38
|
-
} })),
|
|
39
|
-
},
|
|
40
|
-
{
|
|
41
|
-
variant: 'woningtype',
|
|
42
|
-
createElement: () => (h("div", { style: {
|
|
43
|
-
width: '40px',
|
|
44
|
-
height: '40px',
|
|
45
|
-
'border-radius': '50%',
|
|
46
|
-
'background-color': 'red',
|
|
47
|
-
} })),
|
|
48
|
-
},
|
|
49
|
-
],
|
|
50
|
-
cluster: (total) => h("span", null, total),
|
|
51
|
-
},
|
|
52
|
-
};
|
|
53
|
-
export default THEME;
|
|
54
|
-
//# sourceMappingURL=themes.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"themes.js","sourceRoot":"","sources":["../../../../../src/molecules/map/storybook/themes.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,cAAc,CAAC;AAGjC,MAAM,KAAK,GAAa;IACpB,OAAO,EAAE;QACL,QAAQ,EAAE;YACN;gBACI,OAAO,EAAE,YAAY;gBACrB,MAAM,EAAE;oBACJ,IAAI,EAAE,CAAC,GAAG,EAAE,CAAC,EAAE,CAAC,EAAE,GAAG,CAAC;oBACtB,MAAM,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC,CAAC;iBAC7B;gBACD,KAAK,EAAE;oBACH,IAAI,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC;oBAClB,MAAM,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC,CAAC;iBAC7B;aACJ;YACD;gBACI,OAAO,EAAE,YAAY;gBACrB,MAAM,EAAE;oBACJ,IAAI,EAAE,CAAC,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG,CAAC;oBACtB,MAAM,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC,CAAC;iBAC7B;gBACD,KAAK,EAAE;oBACH,IAAI,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC;oBAClB,MAAM,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC,CAAC;iBAC7B;aACJ;SACJ;KACJ;IACD,OAAO,EAAE;QACL,QAAQ,EAAE;YACN;gBACI,OAAO,EAAE,YAAY;gBACrB,aAAa,EAAE,GAAG,EAAE,CAAC,CACjB,WACI,KAAK,EAAE;wBACH,KAAK,EAAE,MAAM;wBACb,MAAM,EAAE,MAAM;wBACd,eAAe,EAAE,KAAK;wBACtB,kBAAkB,EAAE,OAAO;qBAC9B,GAAQ,CAChB;aACJ;YACD;gBACI,OAAO,EAAE,YAAY;gBACrB,aAAa,EAAE,GAAG,EAAE,CAAC,CACjB,WACI,KAAK,EAAE;wBACH,KAAK,EAAE,MAAM;wBACb,MAAM,EAAE,MAAM;wBACd,eAAe,EAAE,KAAK;wBACtB,kBAAkB,EAAE,KAAK;qBAC5B,GAAQ,CAChB;aACJ;SACJ;QACD,OAAO,EAAE,CAAC,KAAa,EAAE,EAAE,CAAC,gBAAO,KAAK,CAAQ;KACnD;CACJ,CAAC;AAEF,eAAe,KAAK,CAAC","sourcesContent":["import { h } from '@atomify/jsx';\nimport { MapTheme } from '@bpd-library/types';\n\nconst THEME: MapTheme = {\n polygon: {\n settings: [\n {\n variant: 'bouwnummer',\n normal: {\n fill: [255, 0, 0, 0.5],\n stroke: [255, 255, 255, 1],\n },\n hover: {\n fill: [0, 0, 0, 1],\n stroke: [255, 255, 255, 1],\n },\n },\n {\n variant: 'woningtype',\n normal: {\n fill: [0, 255, 0, 0.5],\n stroke: [255, 255, 255, 1],\n },\n hover: {\n fill: [0, 0, 0, 1],\n stroke: [255, 255, 255, 1],\n },\n },\n ],\n },\n pointer: {\n settings: [\n {\n variant: 'bouwnummer',\n createElement: () => (\n <div\n style={{\n width: '40px',\n height: '40px',\n 'border-radius': '50%',\n 'background-color': 'green',\n }}></div>\n ),\n },\n {\n variant: 'woningtype',\n createElement: () => (\n <div\n style={{\n width: '40px',\n height: '40px',\n 'border-radius': '50%',\n 'background-color': 'red',\n }}></div>\n ),\n },\n ],\n cluster: (total: number) => <span>{total}</span>,\n },\n};\n\nexport default THEME;\n"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"fit-bounds.js","sourceRoot":"","sources":["../../../../../src/molecules/map/utilities/fit-bounds.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,MAAM,SAAS,GAAG,CAAC,GAAiB,EAAE,WAAwB,EAAE,EAAE,CACrE,GAAG,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC","sourcesContent":["import { BoundingBox } from '@bpd-library/types';\n\nexport const fitBounds = (map: mapboxgl.Map, boundingBox: BoundingBox) =>\n map.fitBounds(boundingBox);\n"]}
|
|
@@ -1,52 +0,0 @@
|
|
|
1
|
-
import { calculateCenter, functionIsTrue } from '@bpd-library/utilities';
|
|
2
|
-
const variants = [];
|
|
3
|
-
const isPointerVariant = (variant, theme) => {
|
|
4
|
-
var _a;
|
|
5
|
-
return !!((_a = theme.pointer) === null || _a === void 0 ? void 0 : _a.settings.find((pointerTheme) => pointerTheme.variant === variant));
|
|
6
|
-
};
|
|
7
|
-
const addData = async (map, data, theme) => {
|
|
8
|
-
const features = {};
|
|
9
|
-
variants.forEach((variant) => (features[variant] = []));
|
|
10
|
-
data.forEach((item) => {
|
|
11
|
-
const { variant } = item;
|
|
12
|
-
if (variants.indexOf(variant) < 0) {
|
|
13
|
-
variants.push(variant);
|
|
14
|
-
features[variant] = [];
|
|
15
|
-
}
|
|
16
|
-
if (isPointerVariant(variant, theme)) {
|
|
17
|
-
features[variant].push({
|
|
18
|
-
type: 'Feature',
|
|
19
|
-
geometry: {
|
|
20
|
-
coordinates: calculateCenter(item.coordinates),
|
|
21
|
-
type: 'Point',
|
|
22
|
-
},
|
|
23
|
-
properties: Object.assign({}, item),
|
|
24
|
-
});
|
|
25
|
-
}
|
|
26
|
-
else {
|
|
27
|
-
item.coordinates.forEach((coordinate) => {
|
|
28
|
-
features[variant].push({
|
|
29
|
-
type: 'Feature',
|
|
30
|
-
geometry: {
|
|
31
|
-
coordinates: [coordinate],
|
|
32
|
-
type: 'Polygon',
|
|
33
|
-
},
|
|
34
|
-
properties: Object.assign({}, item),
|
|
35
|
-
});
|
|
36
|
-
});
|
|
37
|
-
}
|
|
38
|
-
});
|
|
39
|
-
await functionIsTrue(() => map.isStyleLoaded() && map.isSourceLoaded);
|
|
40
|
-
Object.keys(features).forEach((variant) => {
|
|
41
|
-
const variantFeatures = features[variant];
|
|
42
|
-
const source = map.getSource(variant);
|
|
43
|
-
if (source) {
|
|
44
|
-
source.setData({
|
|
45
|
-
type: 'FeatureCollection',
|
|
46
|
-
features: variantFeatures,
|
|
47
|
-
});
|
|
48
|
-
}
|
|
49
|
-
});
|
|
50
|
-
};
|
|
51
|
-
export default addData;
|
|
52
|
-
//# sourceMappingURL=add-data.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"add-data.js","sourceRoot":"","sources":["../../../../../../src/molecules/map/utilities/mapbox/add-data.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,eAAe,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAEzE,MAAM,QAAQ,GAAa,EAAE,CAAC;AAE9B,MAAM,gBAAgB,GAAG,CAAC,OAAe,EAAE,KAAe,EAAE,EAAE;;IAC1D,OAAO,CAAC,QAAC,KAAK,CAAC,OAAO,0CAAE,QAAQ,CAAC,IAAI,CAAC,CAAC,YAAY,EAAE,EAAE,CAAC,YAAY,CAAC,OAAO,KAAK,OAAO,EAAC,CAAC;AAC9F,CAAC,CAAC;AAEF,MAAM,OAAO,GAAG,KAAK,EAAE,GAAiB,EAAE,IAAa,EAAE,KAAe,EAAE,EAAE;IACxE,MAAM,QAAQ,GAA6C,EAAE,CAAC;IAM9D,QAAQ,CAAC,OAAO,CAAC,CAAC,OAAO,EAAE,EAAE,CAAC,CAAC,QAAQ,CAAC,OAAO,CAAC,GAAG,EAAE,CAAC,CAAC,CAAC;IAKxD,IAAI,CAAC,OAAO,CAAC,CAAC,IAAI,EAAE,EAAE;QAClB,MAAM,EAAE,OAAO,EAAE,GAAG,IAAI,CAAC;QAEzB,IAAI,QAAQ,CAAC,OAAO,CAAC,OAAO,CAAC,GAAG,CAAC,EAAE;YAC/B,QAAQ,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;YACvB,QAAQ,CAAC,OAAO,CAAC,GAAG,EAAE,CAAC;SAC1B;QAED,IAAI,gBAAgB,CAAC,OAAO,EAAE,KAAK,CAAC,EAAE;YAClC,QAAQ,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC;gBACnB,IAAI,EAAE,SAAS;gBACf,QAAQ,EAAE;oBACN,WAAW,EAAE,eAAe,CAAC,IAAI,CAAC,WAAW,CAAC;oBAC9C,IAAI,EAAE,OAAO;iBAChB;gBACD,UAAU,oBACH,IAAI,CACV;aACJ,CAAC,CAAC;SACN;aAAM;YACH,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,CAAC,UAAU,EAAE,EAAE;gBACpC,QAAQ,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC;oBACnB,IAAI,EAAE,SAAS;oBACf,QAAQ,EAAE;wBACN,WAAW,EAAE,CAAC,UAAU,CAAC;wBACzB,IAAI,EAAE,SAAS;qBAClB;oBACD,UAAU,oBACH,IAAI,CACV;iBACJ,CAAC,CAAC;YACP,CAAC,CAAC,CAAC;SACN;IACL,CAAC,CAAC,CAAC;IAKH,MAAM,cAAc,CAAC,GAAG,EAAE,CAAC,GAAG,CAAC,aAAa,EAAE,IAAI,GAAG,CAAC,cAAc,CAAC,CAAC;IAEtE,MAAM,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,OAAO,CAAC,CAAC,OAAO,EAAE,EAAE;QACtC,MAAM,eAAe,GAAG,QAAQ,CAAC,OAAO,CAAC,CAAC;QAE1C,MAAM,MAAM,GAAG,GAAG,CAAC,SAAS,CAAC,OAAO,CAAuC,CAAC;QAE5E,IAAI,MAAM,EAAE;YACR,MAAM,CAAC,OAAO,CAAC;gBACX,IAAI,EAAE,mBAAmB;gBACzB,QAAQ,EAAE,eAAe;aAC5B,CAAC,CAAC;SACN;IACL,CAAC,CAAC,CAAC;AACP,CAAC,CAAC;AAEF,eAAe,OAAO,CAAC","sourcesContent":["import { MapData, MapTheme } from '@bpd-library/types';\nimport { calculateCenter, functionIsTrue } from '@bpd-library/utilities';\n\nconst variants: string[] = [];\n\nconst isPointerVariant = (variant: string, theme: MapTheme) => {\n return !!theme.pointer?.settings.find((pointerTheme) => pointerTheme.variant === variant);\n};\n\nconst addData = async (map: mapboxgl.Map, data: MapData, theme: MapTheme) => {\n const features: { [variant: string]: GeoJSON.Feature[] } = {};\n\n /*\n Create empty arrays for previously set variants,\n this will make sure old variants will be removed.\n */\n variants.forEach((variant) => (features[variant] = []));\n\n /*\n Construct GeoJSON Features\n */\n data.forEach((item) => {\n const { variant } = item;\n\n if (variants.indexOf(variant) < 0) {\n variants.push(variant);\n features[variant] = [];\n }\n\n if (isPointerVariant(variant, theme)) {\n features[variant].push({\n type: 'Feature',\n geometry: {\n coordinates: calculateCenter(item.coordinates),\n type: 'Point',\n },\n properties: {\n ...item,\n },\n });\n } else {\n item.coordinates.forEach((coordinate) => {\n features[variant].push({\n type: 'Feature',\n geometry: {\n coordinates: [coordinate],\n type: 'Polygon',\n },\n properties: {\n ...item,\n },\n });\n });\n }\n });\n\n /*\n Update layer with features\n */\n await functionIsTrue(() => map.isStyleLoaded() && map.isSourceLoaded);\n\n Object.keys(features).forEach((variant) => {\n const variantFeatures = features[variant];\n\n const source = map.getSource(variant) as mapboxgl.GeoJSONSource | undefined;\n\n if (source) {\n source.setData({\n type: 'FeatureCollection',\n features: variantFeatures,\n });\n }\n });\n};\n\nexport default addData;\n"]}
|
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
import { calculateCenter } from '@bpd-library/utilities';
|
|
2
|
-
import { MAP_FLY_DURATION, MAP_FLY_EASING_FUNCTION } from './constants';
|
|
3
|
-
const center = (map, coordinates) => {
|
|
4
|
-
const center = calculateCenter(coordinates);
|
|
5
|
-
map.flyTo({
|
|
6
|
-
center,
|
|
7
|
-
curve: 0,
|
|
8
|
-
easing: MAP_FLY_EASING_FUNCTION,
|
|
9
|
-
duration: MAP_FLY_DURATION,
|
|
10
|
-
});
|
|
11
|
-
};
|
|
12
|
-
export default center;
|
|
13
|
-
//# sourceMappingURL=center.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"center.js","sourceRoot":"","sources":["../../../../../../src/molecules/map/utilities/mapbox/center.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,eAAe,EAAE,MAAM,wBAAwB,CAAC;AAEzD,OAAO,EAAE,gBAAgB,EAAE,uBAAuB,EAAE,MAAM,aAAa,CAAC;AAExE,MAAM,MAAM,GAAG,CAAC,GAAiB,EAAE,WAAwB,EAAE,EAAE;IAC3D,MAAM,MAAM,GAAG,eAAe,CAAC,WAAW,CAAC,CAAC;IAE5C,GAAG,CAAC,KAAK,CAAC;QACN,MAAM;QACN,KAAK,EAAE,CAAC;QACR,MAAM,EAAE,uBAAuB;QAC/B,QAAQ,EAAE,gBAAgB;KAC7B,CAAC,CAAC;AACP,CAAC,CAAC;AAEF,eAAe,MAAM,CAAC","sourcesContent":["import { Coordinates } from '@bpd-library/types';\nimport { calculateCenter } from '@bpd-library/utilities';\n\nimport { MAP_FLY_DURATION, MAP_FLY_EASING_FUNCTION } from './constants';\n\nconst center = (map: mapboxgl.Map, coordinates: Coordinates) => {\n const center = calculateCenter(coordinates);\n\n map.flyTo({\n center,\n curve: 0,\n easing: MAP_FLY_EASING_FUNCTION,\n duration: MAP_FLY_DURATION,\n });\n};\n\nexport default center;\n"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"constants.js","sourceRoot":"","sources":["../../../../../../src/molecules/map/utilities/mapbox/constants.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,gBAAgB,GAAG,IAAI,CAAC;AACrC,MAAM,CAAC,MAAM,uBAAuB,GAAG,CAAC,CAAS,EAAE,EAAE,CACjD,CAAC,GAAG,GAAG,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC","sourcesContent":["export const MAP_FLY_DURATION = 1000;\nexport const MAP_FLY_EASING_FUNCTION = (t: number) =>\n t < 0.5 ? 4 * t * t * t : (t - 1) * (2 * t - 2) * (2 * t - 2) + 1;\n"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../src/molecules/map/utilities/mapbox/index.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,MAAM,UAAU,CAAC;AAC9B,eAAe,MAAM,CAAC","sourcesContent":["import mapbox from './mapbox';\nexport default mapbox;\n"]}
|
|
@@ -1,25 +0,0 @@
|
|
|
1
|
-
import addData from './add-data';
|
|
2
|
-
import center from './center';
|
|
3
|
-
import setupPointers from './pointers/setup-pointers';
|
|
4
|
-
import setFeatureState from './polygons/feature-state';
|
|
5
|
-
import geojson from './polygons/geojson';
|
|
6
|
-
import interaction from './polygons/interaction';
|
|
7
|
-
import layer from './polygons/layer';
|
|
8
|
-
import raster from './raster';
|
|
9
|
-
import search from './search/search';
|
|
10
|
-
import { addTooltip, removeTooltip } from './tooltip';
|
|
11
|
-
const mapbox = (map, options, theme) => ({
|
|
12
|
-
raster: (settings) => raster(map, settings),
|
|
13
|
-
geojson: (setting) => geojson(map, setting),
|
|
14
|
-
layer: (setting) => layer(map, setting),
|
|
15
|
-
interaction: (setting) => interaction(map, setting),
|
|
16
|
-
center: (coordinates) => center(map, coordinates),
|
|
17
|
-
setupPointers: (element) => setupPointers(map, theme, element),
|
|
18
|
-
addData: (data) => addData(map, data, theme),
|
|
19
|
-
addTooltip: (coordinates, mapDataItem) => addTooltip(map, coordinates, mapDataItem, options.openInTab),
|
|
20
|
-
removeTooltip,
|
|
21
|
-
setFeatureState: (variant, id, type, hover) => setFeatureState(map, variant, id, type, hover),
|
|
22
|
-
search: (searchOptions) => search(map, searchOptions, options),
|
|
23
|
-
});
|
|
24
|
-
export default mapbox;
|
|
25
|
-
//# sourceMappingURL=mapbox.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"mapbox.js","sourceRoot":"","sources":["../../../../../../src/molecules/map/utilities/mapbox/mapbox.ts"],"names":[],"mappings":"AAWA,OAAO,OAAO,MAAM,YAAY,CAAC;AACjC,OAAO,MAAM,MAAM,UAAU,CAAC;AAC9B,OAAO,aAAa,MAAM,2BAA2B,CAAC;AACtD,OAAO,eAAe,MAAM,0BAA0B,CAAC;AACvD,OAAO,OAAO,MAAM,oBAAoB,CAAC;AACzC,OAAO,WAAW,MAAM,wBAAwB,CAAC;AACjD,OAAO,KAAK,MAAM,kBAAkB,CAAC;AACrC,OAAO,MAAM,MAAM,UAAU,CAAC;AAC9B,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,EAAE,UAAU,EAAE,aAAa,EAAE,MAAM,WAAW,CAAC;AAEtD,MAAM,MAAM,GAAG,CAAC,GAAiB,EAAE,OAAmB,EAAE,KAAe,EAAE,EAAE,CAAC,CAAC;IACzE,MAAM,EAAE,CAAC,QAAgC,EAAE,EAAE,CAAC,MAAM,CAAC,GAAG,EAAE,QAAQ,CAAC;IACnE,OAAO,EAAE,CAAC,OAA4B,EAAE,EAAE,CAAC,OAAO,CAAC,GAAG,EAAE,OAAO,CAAC;IAChE,KAAK,EAAE,CAAC,OAA4B,EAAE,EAAE,CAAC,KAAK,CAAC,GAAG,EAAE,OAAO,CAAC;IAC5D,WAAW,EAAE,CAAC,OAA4B,EAAE,EAAE,CAAC,WAAW,CAAC,GAAG,EAAE,OAAO,CAAC;IACxE,MAAM,EAAE,CAAC,WAAwB,EAAE,EAAE,CAAC,MAAM,CAAC,GAAG,EAAE,WAAW,CAAC;IAC9D,aAAa,EAAE,CAAC,OAAoB,EAAE,EAAE,CAAC,aAAa,CAAC,GAAG,EAAE,KAAK,EAAE,OAAO,CAAC;IAC3E,OAAO,EAAE,CAAC,IAAa,EAAE,EAAE,CAAC,OAAO,CAAC,GAAG,EAAE,IAAI,EAAE,KAAK,CAAC;IACrD,UAAU,EAAE,CAAC,WAAwB,EAAE,WAAwB,EAAE,EAAE,CAC/D,UAAU,CAAC,GAAG,EAAE,WAAW,EAAE,WAAW,EAAE,OAAO,CAAC,SAAS,CAAC;IAChE,aAAa;IACb,eAAe,EAAE,CAAC,OAAe,EAAE,EAAU,EAAE,IAAuB,EAAE,KAAc,EAAE,EAAE,CACtF,eAAe,CAAC,GAAG,EAAE,OAAO,EAAE,EAAE,EAAE,IAAI,EAAE,KAAK,CAAC;IAClD,MAAM,EAAE,CAAC,aAA+B,EAAE,EAAE,CAAC,MAAM,CAAC,GAAG,EAAE,aAAa,EAAE,OAAO,CAAC;CACnF,CAAC,CAAC;AAEH,eAAe,MAAM,CAAC","sourcesContent":["import {\n Coordinates,\n MapData,\n MapDataItem,\n MapOptions,\n MapSearchOptions,\n MapTheme,\n PolygonThemeSetting,\n} from '@bpd-library/types';\n\nimport { MapLayerRasterSettings } from '../../store/map';\nimport addData from './add-data';\nimport center from './center';\nimport setupPointers from './pointers/setup-pointers';\nimport setFeatureState from './polygons/feature-state';\nimport geojson from './polygons/geojson';\nimport interaction from './polygons/interaction';\nimport layer from './polygons/layer';\nimport raster from './raster';\nimport search from './search/search';\nimport { addTooltip, removeTooltip } from './tooltip';\n\nconst mapbox = (map: mapboxgl.Map, options: MapOptions, theme: MapTheme) => ({\n raster: (settings: MapLayerRasterSettings) => raster(map, settings),\n geojson: (setting: PolygonThemeSetting) => geojson(map, setting),\n layer: (setting: PolygonThemeSetting) => layer(map, setting),\n interaction: (setting: PolygonThemeSetting) => interaction(map, setting),\n center: (coordinates: Coordinates) => center(map, coordinates),\n setupPointers: (element: HTMLElement) => setupPointers(map, theme, element),\n addData: (data: MapData) => addData(map, data, theme),\n addTooltip: (coordinates: Coordinates, mapDataItem: MapDataItem) =>\n addTooltip(map, coordinates, mapDataItem, options.openInTab),\n removeTooltip,\n setFeatureState: (variant: string, id: string, type: 'hover' | 'focus', hover: boolean) =>\n setFeatureState(map, variant, id, type, hover),\n search: (searchOptions: MapSearchOptions) => search(map, searchOptions, options),\n});\n\nexport default mapbox;\n"]}
|
|
@@ -1,16 +0,0 @@
|
|
|
1
|
-
export const parseFeatureProperties = (obj) => {
|
|
2
|
-
const safeJSONParse = (str) => {
|
|
3
|
-
try {
|
|
4
|
-
return JSON.parse(str);
|
|
5
|
-
}
|
|
6
|
-
catch (e) {
|
|
7
|
-
return false;
|
|
8
|
-
}
|
|
9
|
-
};
|
|
10
|
-
Object.keys(obj).forEach(key => {
|
|
11
|
-
const parsedJSON = safeJSONParse(obj[key]);
|
|
12
|
-
obj[key] = parsedJSON || obj[key];
|
|
13
|
-
});
|
|
14
|
-
return obj;
|
|
15
|
-
};
|
|
16
|
-
//# sourceMappingURL=parse-feature-properties.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"parse-feature-properties.js","sourceRoot":"","sources":["../../../../../../src/molecules/map/utilities/mapbox/parse-feature-properties.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,MAAM,sBAAsB,GAAG,CAAC,GAAsB,EAA0B,EAAE;IACrF,MAAM,aAAa,GAAG,CAAC,GAAW,EAAE,EAAE;QAClC,IAAI;YACA,OAAO,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;SAC1B;QAAC,OAAO,CAAC,EAAE;YACR,OAAO,KAAK,CAAC;SAChB;IACL,CAAC,CAAC;IAEF,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,OAAO,CAAC,GAAG,CAAC,EAAE;QAC3B,MAAM,UAAU,GAAG,aAAa,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,CAAC;QAE3C,GAAG,CAAC,GAAG,CAAC,GAAG,UAAU,IAAI,GAAG,CAAC,GAAG,CAAC,CAAC;IACtC,CAAC,CAAC,CAAC;IAEH,OAAO,GAAG,CAAC;AACf,CAAC,CAAC","sourcesContent":["export type FeatureProperties = { [key: string]: string };\n\nexport const parseFeatureProperties = (obj: FeatureProperties): { [key: string]: any } => {\n const safeJSONParse = (str: string) => {\n try {\n return JSON.parse(str);\n } catch (e) {\n return false;\n }\n };\n\n Object.keys(obj).forEach(key => {\n const parsedJSON = safeJSONParse(obj[key]);\n\n obj[key] = parsedJSON || obj[key];\n });\n\n return obj;\n};\n"]}
|
|
@@ -1,151 +0,0 @@
|
|
|
1
|
-
import { h } from '@atomify/jsx';
|
|
2
|
-
import { calculateCenter, throttle } from '@bpd-library/utilities';
|
|
3
|
-
import { Marker } from 'mapbox-gl';
|
|
4
|
-
import { clearHover, updateClick, updateHover } from '../../../store/map';
|
|
5
|
-
import { MAP_FLY_DURATION, MAP_FLY_EASING_FUNCTION } from '../constants';
|
|
6
|
-
import { parseFeatureProperties } from '../parse-feature-properties';
|
|
7
|
-
const MAP_HOVER_CLASS = 'map--hovering';
|
|
8
|
-
const POINTER_FADEOUT_DURATION = 300;
|
|
9
|
-
const setupPointers = (map, theme, element) => {
|
|
10
|
-
const { pointer: pointerTheme } = theme;
|
|
11
|
-
const clusters = { cache: {}, onScreen: {} };
|
|
12
|
-
const pointers = { cache: {}, onScreen: {} };
|
|
13
|
-
const sourceNames = [];
|
|
14
|
-
init();
|
|
15
|
-
function init() {
|
|
16
|
-
var _a;
|
|
17
|
-
(_a = theme.pointer) === null || _a === void 0 ? void 0 : _a.settings.forEach(({ variant, minzoom, maxzoom }) => {
|
|
18
|
-
sourceNames.push(variant);
|
|
19
|
-
map.addSource(variant, {
|
|
20
|
-
type: 'geojson',
|
|
21
|
-
data: { type: 'FeatureCollection', features: [] },
|
|
22
|
-
cluster: true,
|
|
23
|
-
clusterRadius: 50,
|
|
24
|
-
clusterMaxZoom: 8,
|
|
25
|
-
promoteId: 'id',
|
|
26
|
-
});
|
|
27
|
-
const layerSettings = {
|
|
28
|
-
id: variant,
|
|
29
|
-
type: 'circle',
|
|
30
|
-
source: variant,
|
|
31
|
-
filter: ['!=', 'cluster', true],
|
|
32
|
-
paint: {
|
|
33
|
-
'circle-opacity': 0,
|
|
34
|
-
},
|
|
35
|
-
};
|
|
36
|
-
if (minzoom)
|
|
37
|
-
layerSettings.minzoom = minzoom;
|
|
38
|
-
if (maxzoom)
|
|
39
|
-
layerSettings.maxzoom = maxzoom;
|
|
40
|
-
map.addLayer(layerSettings);
|
|
41
|
-
});
|
|
42
|
-
bindEvents();
|
|
43
|
-
}
|
|
44
|
-
function bindEvents() {
|
|
45
|
-
map.on('render', throttle(updateMarkers, 200));
|
|
46
|
-
}
|
|
47
|
-
function addCluster(clus, variant) {
|
|
48
|
-
const { properties, geometry } = clus;
|
|
49
|
-
const { coordinates } = geometry;
|
|
50
|
-
const { cluster_id: id, point_count: count } = properties;
|
|
51
|
-
let cluster;
|
|
52
|
-
if (id && count) {
|
|
53
|
-
cluster = clusters.cache[id];
|
|
54
|
-
if (!cluster) {
|
|
55
|
-
cluster = new Marker({
|
|
56
|
-
element: (h("button", { class: "map__cluster", onMouseenter: () => {
|
|
57
|
-
element.classList.add(MAP_HOVER_CLASS);
|
|
58
|
-
}, onMouseleave: () => {
|
|
59
|
-
element.classList.remove(MAP_HOVER_CLASS);
|
|
60
|
-
}, onClick: () => {
|
|
61
|
-
element.classList.remove(MAP_HOVER_CLASS);
|
|
62
|
-
map.getSource(variant).getClusterExpansionZoom(id, (err, zoom) => {
|
|
63
|
-
if (err)
|
|
64
|
-
return;
|
|
65
|
-
map.easeTo({
|
|
66
|
-
center: coordinates,
|
|
67
|
-
zoom,
|
|
68
|
-
duration: MAP_FLY_DURATION,
|
|
69
|
-
easing: MAP_FLY_EASING_FUNCTION,
|
|
70
|
-
});
|
|
71
|
-
});
|
|
72
|
-
} }, pointerTheme.cluster(count))),
|
|
73
|
-
}).setLngLat(coordinates);
|
|
74
|
-
clusters.cache[id] = cluster;
|
|
75
|
-
}
|
|
76
|
-
if (!clusters.onScreen[id])
|
|
77
|
-
cluster.addTo(map);
|
|
78
|
-
}
|
|
79
|
-
return [cluster, id];
|
|
80
|
-
}
|
|
81
|
-
function addPointer({ properties, }) {
|
|
82
|
-
const mapDataItem = parseFeatureProperties(properties);
|
|
83
|
-
const { id, variant, coordinates } = mapDataItem;
|
|
84
|
-
const setting = pointerTheme.settings.find((setting) => setting.variant === variant);
|
|
85
|
-
if (!setting)
|
|
86
|
-
return [undefined, undefined];
|
|
87
|
-
let pointer = pointers.cache[id];
|
|
88
|
-
const center = calculateCenter(coordinates);
|
|
89
|
-
if (!pointer) {
|
|
90
|
-
pointer = new Marker({
|
|
91
|
-
anchor: 'center',
|
|
92
|
-
element: (h("button", { id: `pointer-${id}`, onMouseenter: () => {
|
|
93
|
-
element.classList.add(MAP_HOVER_CLASS);
|
|
94
|
-
updateHover(mapDataItem);
|
|
95
|
-
}, onMouseleave: () => {
|
|
96
|
-
element.classList.remove(MAP_HOVER_CLASS);
|
|
97
|
-
clearHover();
|
|
98
|
-
}, onClick: (e) => {
|
|
99
|
-
e.stopPropagation();
|
|
100
|
-
updateClick(mapDataItem);
|
|
101
|
-
}, class: `map__pointer${setting.disablePointerEvents ? ' map__pointer--disabled' : ''}` }, setting.createElement(mapDataItem))),
|
|
102
|
-
}).setLngLat(center);
|
|
103
|
-
pointers.cache[id] = pointer;
|
|
104
|
-
}
|
|
105
|
-
if (!pointers.onScreen[id])
|
|
106
|
-
pointer.addTo(map);
|
|
107
|
-
return [pointer, id];
|
|
108
|
-
}
|
|
109
|
-
function updateMarkers() {
|
|
110
|
-
var _a;
|
|
111
|
-
const newClusters = {};
|
|
112
|
-
const newPointers = {};
|
|
113
|
-
(_a = theme.pointer) === null || _a === void 0 ? void 0 : _a.settings.forEach(({ variant }) => {
|
|
114
|
-
const features = map.querySourceFeatures(variant);
|
|
115
|
-
features.forEach((feature) => {
|
|
116
|
-
const { properties } = feature;
|
|
117
|
-
if (properties === null || properties === void 0 ? void 0 : properties.cluster) {
|
|
118
|
-
const [cluster, id] = addCluster(feature, variant);
|
|
119
|
-
if (cluster && id)
|
|
120
|
-
newClusters[id] = cluster;
|
|
121
|
-
}
|
|
122
|
-
else {
|
|
123
|
-
const [pointer, id] = addPointer(feature);
|
|
124
|
-
if (pointer && id)
|
|
125
|
-
newPointers[id] = pointer;
|
|
126
|
-
}
|
|
127
|
-
});
|
|
128
|
-
});
|
|
129
|
-
Object.keys(clusters.onScreen).forEach((id) => {
|
|
130
|
-
if (!newClusters[id])
|
|
131
|
-
clusters.onScreen[id].remove();
|
|
132
|
-
});
|
|
133
|
-
Object.keys(pointers.onScreen).forEach((id) => {
|
|
134
|
-
if (!newPointers[id]) {
|
|
135
|
-
fadeoutPointer(pointers.onScreen[id]);
|
|
136
|
-
}
|
|
137
|
-
});
|
|
138
|
-
clusters.onScreen = newClusters;
|
|
139
|
-
pointers.onScreen = newPointers;
|
|
140
|
-
}
|
|
141
|
-
function fadeoutPointer(pointer) {
|
|
142
|
-
const pointerElement = pointer.getElement();
|
|
143
|
-
pointerElement.classList.add('map__pointer--fadeout');
|
|
144
|
-
setTimeout(() => {
|
|
145
|
-
pointer.remove();
|
|
146
|
-
pointerElement.classList.remove('map__pointer--fadeout');
|
|
147
|
-
}, POINTER_FADEOUT_DURATION);
|
|
148
|
-
}
|
|
149
|
-
};
|
|
150
|
-
export default setupPointers;
|
|
151
|
-
//# sourceMappingURL=setup-pointers.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"setup-pointers.js","sourceRoot":"","sources":["../../../../../../../src/molecules/map/utilities/mapbox/pointers/setup-pointers.tsx"],"names":[],"mappings":"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","sourcesContent":["import { h } from '@atomify/jsx';\nimport { MapDataItem, MapTheme } from '@bpd-library/types';\nimport { calculateCenter, throttle } from '@bpd-library/utilities';\nimport { GeoJSONSource, LngLatLike, Marker } from 'mapbox-gl';\n\nimport { clearHover, updateClick, updateHover } from '../../../store/map';\nimport { MAP_FLY_DURATION, MAP_FLY_EASING_FUNCTION } from '../constants';\nimport { FeatureProperties, parseFeatureProperties } from '../parse-feature-properties';\n\ntype MapMarkers = { [key: string]: mapboxgl.Marker };\n\ntype MarkerObject = {\n cache: MapMarkers;\n onScreen: MapMarkers;\n};\n\nconst MAP_HOVER_CLASS = 'map--hovering';\nconst POINTER_FADEOUT_DURATION = 300;\n\nconst setupPointers = (map: mapboxgl.Map, theme: MapTheme, element: HTMLElement) => {\n const { pointer: pointerTheme } = theme;\n const clusters: MarkerObject = { cache: {}, onScreen: {} };\n const pointers: MarkerObject = { cache: {}, onScreen: {} };\n const sourceNames: string[] = [];\n\n init();\n\n function init() {\n theme.pointer?.settings.forEach(({ variant, minzoom, maxzoom }) => {\n sourceNames.push(variant);\n\n map.addSource(variant, {\n type: 'geojson',\n data: { type: 'FeatureCollection', features: [] },\n cluster: true,\n clusterRadius: 50,\n clusterMaxZoom: 8,\n promoteId: 'id',\n });\n\n const layerSettings: mapboxgl.AnyLayer | mapboxgl.CustomLayerInterface = {\n id: variant,\n type: 'circle',\n source: variant,\n filter: ['!=', 'cluster', true],\n paint: {\n 'circle-opacity': 0,\n },\n };\n\n if (minzoom) layerSettings.minzoom = minzoom;\n if (maxzoom) layerSettings.maxzoom = maxzoom;\n\n map.addLayer(layerSettings);\n });\n\n bindEvents();\n }\n\n function bindEvents() {\n map.on('render', throttle(updateMarkers, 200));\n }\n\n function addCluster(\n clus: GeoJSON.Feature,\n variant: string,\n ): [mapboxgl.Marker | undefined, number | undefined] {\n const { properties, geometry } = clus;\n const { coordinates } = geometry as GeoJSON.Point;\n const { cluster_id: id, point_count: count } = properties as {\n cluster_id?: number;\n point_count?: number;\n };\n\n let cluster: mapboxgl.Marker | undefined;\n\n if (id && count) {\n cluster = clusters.cache[id];\n\n if (!cluster) {\n cluster = new Marker({\n element: (\n <button\n class=\"map__cluster\"\n onMouseenter={() => {\n element.classList.add(MAP_HOVER_CLASS);\n }}\n onMouseleave={() => {\n element.classList.remove(MAP_HOVER_CLASS);\n }}\n onClick={() => {\n element.classList.remove(MAP_HOVER_CLASS);\n\n (map.getSource(variant) as GeoJSONSource).getClusterExpansionZoom(\n id,\n (err, zoom) => {\n if (err) return;\n\n map.easeTo({\n center: coordinates as LngLatLike,\n zoom,\n duration: MAP_FLY_DURATION,\n easing: MAP_FLY_EASING_FUNCTION,\n });\n },\n );\n }}>\n {pointerTheme!.cluster(count)}\n </button>\n ),\n }).setLngLat(coordinates as LngLatLike);\n\n clusters.cache[id] = cluster;\n }\n\n if (!clusters.onScreen[id]) cluster.addTo(map);\n }\n\n return [cluster, id];\n }\n\n function addPointer({\n properties,\n }: GeoJSON.Feature): [mapboxgl.Marker | undefined, string | undefined] {\n const mapDataItem = parseFeatureProperties(properties as FeatureProperties) as MapDataItem;\n const { id, variant, coordinates } = mapDataItem;\n const setting = pointerTheme!.settings.find((setting) => setting.variant === variant);\n\n if (!setting) return [undefined, undefined];\n\n let pointer: mapboxgl.Marker | undefined = pointers.cache[id];\n const center = calculateCenter(coordinates);\n\n if (!pointer) {\n pointer = new Marker({\n anchor: 'center',\n element: (\n <button\n id={`pointer-${id}`}\n onMouseenter={() => {\n element.classList.add(MAP_HOVER_CLASS);\n updateHover(mapDataItem);\n }}\n onMouseleave={() => {\n element.classList.remove(MAP_HOVER_CLASS);\n clearHover();\n }}\n onClick={(e: Event) => {\n e.stopPropagation();\n updateClick(mapDataItem);\n }}\n class={`map__pointer${\n setting.disablePointerEvents ? ' map__pointer--disabled' : ''\n }`}>\n {setting.createElement(mapDataItem)}\n </button>\n ),\n }).setLngLat(center);\n\n pointers.cache[id] = pointer;\n }\n\n if (!pointers.onScreen[id]) pointer.addTo(map);\n\n return [pointer, id];\n }\n\n function updateMarkers() {\n const newClusters: MapMarkers = {};\n const newPointers: MapMarkers = {};\n\n theme.pointer?.settings.forEach(({ variant }) => {\n const features = map.querySourceFeatures(variant);\n\n features.forEach((feature) => {\n const { properties } = feature;\n\n if (properties?.cluster) {\n const [cluster, id] = addCluster(feature, variant);\n\n if (cluster && id) newClusters[id] = cluster;\n } else {\n const [pointer, id] = addPointer(feature);\n\n if (pointer && id) newPointers[id] = pointer;\n }\n });\n });\n\n Object.keys(clusters.onScreen).forEach((id) => {\n if (!newClusters[id]) clusters.onScreen[id].remove();\n });\n\n Object.keys(pointers.onScreen).forEach((id) => {\n if (!newPointers[id]) {\n fadeoutPointer(pointers.onScreen[id]);\n }\n });\n\n clusters.onScreen = newClusters;\n pointers.onScreen = newPointers;\n }\n\n function fadeoutPointer(pointer: mapboxgl.Marker) {\n const pointerElement = pointer.getElement();\n\n pointerElement.classList.add('map__pointer--fadeout');\n\n setTimeout(() => {\n pointer.remove();\n\n pointerElement.classList.remove('map__pointer--fadeout');\n }, POINTER_FADEOUT_DURATION);\n }\n};\n\nexport default setupPointers;\n"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"feature-state.js","sourceRoot":"","sources":["../../../../../../../src/molecules/map/utilities/mapbox/polygons/feature-state.ts"],"names":[],"mappings":"AAAA,MAAM,eAAe,GAAG,CACpB,GAAiB,EACjB,OAAe,EACf,EAAU,EACV,IAAuB,EACvB,KAAc,EAChB,EAAE;IACA,GAAG,CAAC,eAAe,CACf;QACI,MAAM,EAAE,OAAO;QACf,EAAE;KACL,EACD;QACI,CAAC,IAAI,CAAC,EAAE,KAAK;KAChB,CACJ,CAAC;AACN,CAAC,CAAC;AAEF,eAAe,eAAe,CAAC","sourcesContent":["const setFeatureState = (\n map: mapboxgl.Map,\n variant: string,\n id: string,\n type: 'hover' | 'focus',\n value: boolean,\n) => {\n map.setFeatureState(\n {\n source: variant,\n id,\n },\n {\n [type]: value,\n },\n );\n};\n\nexport default setFeatureState;\n"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"geojson.js","sourceRoot":"","sources":["../../../../../../../src/molecules/map/utilities/mapbox/polygons/geojson.ts"],"names":[],"mappings":"AAEA,MAAM,OAAO,GAAG,CAAC,GAAiB,EAAE,OAA4B,EAAE,EAAE;IAChE,GAAG,CAAC,SAAS,CAAC,OAAO,CAAC,OAAO,EAAE;QAC3B,IAAI,EAAE,SAAS;QACf,IAAI,EAAE,EAAE,IAAI,EAAE,mBAAmB,EAAE,QAAQ,EAAE,EAAE,EAAE;QACjD,SAAS,EAAE,IAAI;KAClB,CAAC,CAAC;AACP,CAAC,CAAC;AAEF,eAAe,OAAO,CAAC","sourcesContent":["import { PolygonThemeSetting } from '@bpd-library/types';\n\nconst geojson = (map: mapboxgl.Map, setting: PolygonThemeSetting) => {\n map.addSource(setting.variant, {\n type: 'geojson',\n data: { type: 'FeatureCollection', features: [] },\n promoteId: 'id',\n });\n};\n\nexport default geojson;\n"]}
|
|
@@ -1,32 +0,0 @@
|
|
|
1
|
-
import { clearHover, getHover, updateClick, updateHover } from '../../../store/map';
|
|
2
|
-
import { parseFeatureProperties } from '../parse-feature-properties';
|
|
3
|
-
const getFeatureFromEvent = (e) => {
|
|
4
|
-
const features = e.features;
|
|
5
|
-
const feature = features ? features[0] : undefined;
|
|
6
|
-
return feature || undefined;
|
|
7
|
-
};
|
|
8
|
-
const interaction = (map, setting) => {
|
|
9
|
-
map.on('mousemove', setting.variant + '-fill', (e) => {
|
|
10
|
-
var _a;
|
|
11
|
-
const hover = getHover();
|
|
12
|
-
const feature = getFeatureFromEvent(e);
|
|
13
|
-
if (!feature)
|
|
14
|
-
return;
|
|
15
|
-
if (((_a = hover.current) === null || _a === void 0 ? void 0 : _a.id) !== feature.id) {
|
|
16
|
-
const item = parseFeatureProperties(feature.properties);
|
|
17
|
-
updateHover(item);
|
|
18
|
-
}
|
|
19
|
-
});
|
|
20
|
-
map.on('mouseleave', setting.variant + '-fill', () => {
|
|
21
|
-
clearHover();
|
|
22
|
-
});
|
|
23
|
-
map.on('click', setting.variant + '-fill', (e) => {
|
|
24
|
-
const feature = getFeatureFromEvent(e);
|
|
25
|
-
if (feature) {
|
|
26
|
-
const item = parseFeatureProperties(feature.properties);
|
|
27
|
-
updateClick(item);
|
|
28
|
-
}
|
|
29
|
-
});
|
|
30
|
-
};
|
|
31
|
-
export default interaction;
|
|
32
|
-
//# sourceMappingURL=interaction.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"interaction.js","sourceRoot":"","sources":["../../../../../../../src/molecules/map/utilities/mapbox/polygons/interaction.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,UAAU,EAAE,QAAQ,EAAE,WAAW,EAAE,WAAW,EAAE,MAAM,oBAAoB,CAAC;AACpF,OAAO,EAAqB,sBAAsB,EAAE,MAAM,6BAA6B,CAAC;AAMxF,MAAM,mBAAmB,GAAG,CAAC,CAAc,EAAE,EAAE;IAC3C,MAAM,QAAQ,GAAG,CAAC,CAAC,QAAQ,CAAC;IAC5B,MAAM,OAAO,GAAG,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC;IAEnD,OAAO,OAAO,IAAI,SAAS,CAAC;AAChC,CAAC,CAAC;AAEF,MAAM,WAAW,GAAG,CAAC,GAAiB,EAAE,OAA4B,EAAE,EAAE;IACpE,GAAG,CAAC,EAAE,CAAC,WAAW,EAAE,OAAO,CAAC,OAAO,GAAG,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE;;QACjD,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;QACzB,MAAM,OAAO,GAAG,mBAAmB,CAAC,CAAC,CAAC,CAAC;QAEvC,IAAI,CAAC,OAAO;YAAE,OAAO;QAErB,IAAI,OAAA,KAAK,CAAC,OAAO,0CAAE,EAAE,MAAK,OAAO,CAAC,EAAE,EAAE;YAClC,MAAM,IAAI,GAAG,sBAAsB,CAC/B,OAAO,CAAC,UAA+B,CAC3B,CAAC;YAEjB,WAAW,CAAC,IAAI,CAAC,CAAC;SACrB;IACL,CAAC,CAAC,CAAC;IAEH,GAAG,CAAC,EAAE,CAAC,YAAY,EAAE,OAAO,CAAC,OAAO,GAAG,OAAO,EAAE,GAAG,EAAE;QACjD,UAAU,EAAE,CAAC;IACjB,CAAC,CAAC,CAAC;IAEH,GAAG,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,CAAC,OAAO,GAAG,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE;QAC7C,MAAM,OAAO,GAAG,mBAAmB,CAAC,CAAC,CAAC,CAAC;QAEvC,IAAI,OAAO,EAAE;YACT,MAAM,IAAI,GAAG,sBAAsB,CAC/B,OAAO,CAAC,UAA+B,CAC3B,CAAC;YAEjB,WAAW,CAAC,IAAI,CAAC,CAAC;SACrB;IACL,CAAC,CAAC,CAAC;AACP,CAAC,CAAC;AAEF,eAAe,WAAW,CAAC","sourcesContent":["import { MapDataItem, PolygonThemeSetting } from '@bpd-library/types';\n\nimport { clearHover, getHover, updateClick, updateHover } from '../../../store/map';\nimport { FeatureProperties, parseFeatureProperties } from '../parse-feature-properties';\n\ntype MapboxEvent = mapboxgl.MapMouseEvent & {\n features?: mapboxgl.MapboxGeoJSONFeature[] | undefined;\n} & mapboxgl.EventData;\n\nconst getFeatureFromEvent = (e: MapboxEvent) => {\n const features = e.features;\n const feature = features ? features[0] : undefined;\n\n return feature || undefined;\n};\n\nconst interaction = (map: mapboxgl.Map, setting: PolygonThemeSetting) => {\n map.on('mousemove', setting.variant + '-fill', (e) => {\n const hover = getHover();\n const feature = getFeatureFromEvent(e);\n\n if (!feature) return;\n\n if (hover.current?.id !== feature.id) {\n const item = parseFeatureProperties(\n feature.properties as FeatureProperties,\n ) as MapDataItem;\n\n updateHover(item);\n }\n });\n\n map.on('mouseleave', setting.variant + '-fill', () => {\n clearHover();\n });\n\n map.on('click', setting.variant + '-fill', (e) => {\n const feature = getFeatureFromEvent(e);\n\n if (feature) {\n const item = parseFeatureProperties(\n feature.properties as FeatureProperties,\n ) as MapDataItem;\n\n updateClick(item);\n }\n });\n};\n\nexport default interaction;\n"]}
|
|
@@ -1,109 +0,0 @@
|
|
|
1
|
-
const MIN_ZOOM = 1;
|
|
2
|
-
const MAX_ZOOM = 24;
|
|
3
|
-
const LINE_WIDTH = 2;
|
|
4
|
-
const TRANSITION_ZOOM_MARGIN = 0.75;
|
|
5
|
-
const NORMAL_FEATURE_STATE = [
|
|
6
|
-
'case',
|
|
7
|
-
['boolean', ['feature-state', 'hover'], false],
|
|
8
|
-
0,
|
|
9
|
-
['boolean', ['feature-state', 'focus'], false],
|
|
10
|
-
0,
|
|
11
|
-
1,
|
|
12
|
-
];
|
|
13
|
-
const HOVER_FEATURE_STATE = [
|
|
14
|
-
'case',
|
|
15
|
-
['boolean', ['feature-state', 'hover'], false],
|
|
16
|
-
1,
|
|
17
|
-
['boolean', ['feature-state', 'focus'], false],
|
|
18
|
-
1,
|
|
19
|
-
0,
|
|
20
|
-
];
|
|
21
|
-
const RGBAString = ([r, g, b, a], overwriteAlpha) => {
|
|
22
|
-
a = overwriteAlpha !== undefined ? overwriteAlpha : a;
|
|
23
|
-
return `rgba(${r},${g},${b},${a})`;
|
|
24
|
-
};
|
|
25
|
-
const layer = (map, { variant, normal, hover, minzoom, maxzoom }) => {
|
|
26
|
-
let layerMinzoom = minzoom ? minzoom - TRANSITION_ZOOM_MARGIN : MIN_ZOOM;
|
|
27
|
-
let layerMaxzoom = maxzoom ? maxzoom + TRANSITION_ZOOM_MARGIN : MAX_ZOOM;
|
|
28
|
-
if (layerMinzoom < 1)
|
|
29
|
-
layerMinzoom = 1;
|
|
30
|
-
if (layerMaxzoom > 24)
|
|
31
|
-
layerMaxzoom = 24;
|
|
32
|
-
if (normal.fill) {
|
|
33
|
-
map.addLayer({
|
|
34
|
-
id: `${variant}-fill`,
|
|
35
|
-
type: 'fill',
|
|
36
|
-
source: variant,
|
|
37
|
-
minzoom: layerMinzoom,
|
|
38
|
-
maxzoom: layerMaxzoom,
|
|
39
|
-
paint: {
|
|
40
|
-
'fill-color': RGBAString(normal.fill),
|
|
41
|
-
'fill-opacity': NORMAL_FEATURE_STATE,
|
|
42
|
-
},
|
|
43
|
-
});
|
|
44
|
-
setTransitionPaintProperty(`${variant}-fill`, normal.fill, 'fill-color');
|
|
45
|
-
}
|
|
46
|
-
if (normal.stroke) {
|
|
47
|
-
map.addLayer({
|
|
48
|
-
id: `${variant}-line`,
|
|
49
|
-
type: 'line',
|
|
50
|
-
source: variant,
|
|
51
|
-
minzoom: layerMinzoom,
|
|
52
|
-
maxzoom: layerMaxzoom,
|
|
53
|
-
paint: {
|
|
54
|
-
'line-color': RGBAString(normal.stroke),
|
|
55
|
-
'line-width': LINE_WIDTH,
|
|
56
|
-
'line-opacity': NORMAL_FEATURE_STATE,
|
|
57
|
-
},
|
|
58
|
-
});
|
|
59
|
-
setTransitionPaintProperty(`${variant}-line`, normal.stroke, 'line-color');
|
|
60
|
-
}
|
|
61
|
-
if (hover) {
|
|
62
|
-
map.addLayer({
|
|
63
|
-
id: `${variant}-fill-hover`,
|
|
64
|
-
type: 'fill',
|
|
65
|
-
source: variant,
|
|
66
|
-
minzoom: layerMinzoom,
|
|
67
|
-
maxzoom: layerMaxzoom,
|
|
68
|
-
paint: {
|
|
69
|
-
'fill-color': RGBAString(hover.fill),
|
|
70
|
-
'fill-opacity': HOVER_FEATURE_STATE,
|
|
71
|
-
},
|
|
72
|
-
});
|
|
73
|
-
setTransitionPaintProperty(`${variant}-fill-hover`, hover.fill, 'fill-color');
|
|
74
|
-
if (normal.stroke) {
|
|
75
|
-
map.addLayer({
|
|
76
|
-
id: `${variant}-line-hover`,
|
|
77
|
-
type: 'line',
|
|
78
|
-
source: variant,
|
|
79
|
-
minzoom: layerMinzoom,
|
|
80
|
-
maxzoom: layerMaxzoom,
|
|
81
|
-
paint: {
|
|
82
|
-
'line-color': RGBAString(hover.stroke),
|
|
83
|
-
'line-width': LINE_WIDTH,
|
|
84
|
-
'line-opacity': HOVER_FEATURE_STATE,
|
|
85
|
-
},
|
|
86
|
-
});
|
|
87
|
-
setTransitionPaintProperty(`${variant}-line-hover`, hover.stroke, 'line-color');
|
|
88
|
-
}
|
|
89
|
-
}
|
|
90
|
-
function setTransitionPaintProperty(layer, color, property) {
|
|
91
|
-
if (!minzoom || !maxzoom)
|
|
92
|
-
return;
|
|
93
|
-
map.setPaintProperty(layer, property, [
|
|
94
|
-
'interpolate',
|
|
95
|
-
['exponential', TRANSITION_ZOOM_MARGIN],
|
|
96
|
-
['zoom'],
|
|
97
|
-
minzoom - TRANSITION_ZOOM_MARGIN,
|
|
98
|
-
RGBAString(color, 0),
|
|
99
|
-
minzoom,
|
|
100
|
-
RGBAString(color),
|
|
101
|
-
maxzoom,
|
|
102
|
-
RGBAString(color),
|
|
103
|
-
maxzoom + TRANSITION_ZOOM_MARGIN,
|
|
104
|
-
RGBAString(color, 0),
|
|
105
|
-
]);
|
|
106
|
-
}
|
|
107
|
-
};
|
|
108
|
-
export default layer;
|
|
109
|
-
//# sourceMappingURL=layer.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"layer.js","sourceRoot":"","sources":["../../../../../../../src/molecules/map/utilities/mapbox/polygons/layer.ts"],"names":[],"mappings":"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","sourcesContent":["import { PolygonThemeSetting, RGBA } from '@bpd-library/types';\n\nconst MIN_ZOOM = 1;\nconst MAX_ZOOM = 24;\nconst LINE_WIDTH = 2;\nconst TRANSITION_ZOOM_MARGIN = 0.75;\n\nconst NORMAL_FEATURE_STATE: mapboxgl.Expression = [\n 'case',\n ['boolean', ['feature-state', 'hover'], false],\n 0,\n ['boolean', ['feature-state', 'focus'], false],\n 0,\n 1,\n];\n\nconst HOVER_FEATURE_STATE: mapboxgl.Expression = [\n 'case',\n ['boolean', ['feature-state', 'hover'], false],\n 1,\n ['boolean', ['feature-state', 'focus'], false],\n 1,\n 0,\n];\n\nconst RGBAString = ([r, g, b, a]: RGBA, overwriteAlpha?: number) => {\n a = overwriteAlpha !== undefined ? overwriteAlpha : a;\n\n return `rgba(${r},${g},${b},${a})`;\n};\n\nconst layer = (\n map: mapboxgl.Map,\n { variant, normal, hover, minzoom, maxzoom }: PolygonThemeSetting,\n) => {\n // Calculate the minzoom and maxzoom when it's set. This makes sure the layer gets disabled when it's invisible.\n let layerMinzoom = minzoom ? minzoom - TRANSITION_ZOOM_MARGIN : MIN_ZOOM;\n let layerMaxzoom = maxzoom ? maxzoom + TRANSITION_ZOOM_MARGIN : MAX_ZOOM;\n\n // Limit the minzoom to 1 and the maxzoom to 24.\n if (layerMinzoom < 1) layerMinzoom = 1;\n if (layerMaxzoom > 24) layerMaxzoom = 24;\n\n if (normal.fill) {\n map.addLayer({\n id: `${variant}-fill`,\n type: 'fill',\n source: variant,\n minzoom: layerMinzoom,\n maxzoom: layerMaxzoom,\n paint: {\n 'fill-color': RGBAString(normal.fill),\n 'fill-opacity': NORMAL_FEATURE_STATE,\n },\n });\n\n setTransitionPaintProperty(`${variant}-fill`, normal.fill, 'fill-color');\n }\n\n // Only add stroke layer, if it is set\n if (normal.stroke) {\n map.addLayer({\n id: `${variant}-line`,\n type: 'line',\n source: variant,\n minzoom: layerMinzoom,\n maxzoom: layerMaxzoom,\n paint: {\n 'line-color': RGBAString(normal.stroke),\n 'line-width': LINE_WIDTH,\n 'line-opacity': NORMAL_FEATURE_STATE,\n },\n });\n\n setTransitionPaintProperty(`${variant}-line`, normal.stroke, 'line-color');\n }\n\n if (hover) {\n map.addLayer({\n id: `${variant}-fill-hover`,\n type: 'fill',\n source: variant,\n minzoom: layerMinzoom,\n maxzoom: layerMaxzoom,\n paint: {\n 'fill-color': RGBAString(hover.fill),\n 'fill-opacity': HOVER_FEATURE_STATE,\n },\n });\n\n setTransitionPaintProperty(`${variant}-fill-hover`, hover.fill, 'fill-color');\n\n if (normal.stroke) {\n map.addLayer({\n id: `${variant}-line-hover`,\n type: 'line',\n source: variant,\n minzoom: layerMinzoom,\n maxzoom: layerMaxzoom,\n paint: {\n 'line-color': RGBAString(hover.stroke),\n 'line-width': LINE_WIDTH,\n 'line-opacity': HOVER_FEATURE_STATE,\n },\n });\n\n setTransitionPaintProperty(`${variant}-line-hover`, hover.stroke, 'line-color');\n }\n }\n\n /**\n * @description Creates a fade-in effect when zooming in or out, based on a minzoom and maxzoom\n * @param {string} layer\n * @param {RGBA} color\n * @param {string} property\n * @return {*}\n */\n function setTransitionPaintProperty(layer: string, color: RGBA, property: string) {\n if (!minzoom || !maxzoom) return;\n\n map.setPaintProperty(layer, property, [\n 'interpolate',\n ['exponential', TRANSITION_ZOOM_MARGIN],\n ['zoom'],\n minzoom - TRANSITION_ZOOM_MARGIN,\n RGBAString(color, 0),\n minzoom,\n RGBAString(color),\n maxzoom,\n RGBAString(color),\n maxzoom + TRANSITION_ZOOM_MARGIN,\n RGBAString(color, 0),\n ]);\n }\n};\n\nexport default layer;\n"]}
|