@record-evolution/widget-mapbox 1.5.1 → 1.5.3

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 (7) hide show
  1. package/dist/src/widget-mapbox.d.ts +1 -0
  2. package/dist/tsconfig.tsbuildinfo +1 -1
  3. package/dist/widget-mapbox.js +37 -16
  4. package/dist/widget-mapbox.js.map +1 -1
  5. package/package.json +3 -1
  6. package/src/definition-schema.json +8 -0
  7. package/src/widget-mapbox.ts +37 -15
package/package.json CHANGED
@@ -3,7 +3,7 @@
3
3
  "description": "REWidget widget-mapbox",
4
4
  "license": "MIT",
5
5
  "author": "widget-mapbox",
6
- "version": "1.5.1",
6
+ "version": "1.5.3",
7
7
  "type": "module",
8
8
  "main": "dist/widget-mapbox.js",
9
9
  "types": "dist/src/widget-mapbox.d.ts",
@@ -16,6 +16,8 @@
16
16
  "start": "tsc && concurrently -k -r \"tsc --watch --preserveWatchOutput\" \"wds\"",
17
17
  "build": "rollup -c rollup.config.js",
18
18
  "watch": "rollup -w -c rollup.config.js",
19
+ "link": "npm link && cd ../RESWARM/frontend && npm link @record-evolution/widget-mapbox",
20
+ "unlink": "npm unlink --global && cd ../RESWARM/frontend && npm unlink @record-evolution/widget-mapbox && npm i @record-evolution/widget-mapbox",
19
21
  "types": "cat src/definition-schema.json | json2ts > src/definition-schema.d.ts",
20
22
  "lint": "eslint --ext .ts,.html . --ignore-path .gitignore && prettier \"**/*.ts\" --check --ignore-path .gitignore",
21
23
  "format": "eslint --ext .ts,.html . --fix --ignore-path .gitignore && prettier \"**/*.ts\" --write --ignore-path .gitignore",
package/src/definition-schema.json CHANGED
@@ -17,6 +17,7 @@
17
17
  "title": "Map Style",
18
18
  "description": "The basic style of the map.",
19
19
  "type": "string",
20
+ "dataDrivenDisabled": true,
20
21
  "enum": [
21
22
  "streets-v12",
22
23
  "outdoors-v12",
@@ -33,18 +34,21 @@
33
34
  "showLegend": {
34
35
  "title": "Show Legend",
35
36
  "type": "boolean",
37
+ "dataDrivenDisabled": true,
36
38
  "order": 4
37
39
  },
38
40
  "follow": {
39
41
  "title": "Auto Follow",
40
42
  "description": "If true, the map automatically keeps the drawn locations in focus.",
41
43
  "type": "boolean",
44
+ "dataDrivenDisabled": true,
42
45
  "order": 5
43
46
  },
44
47
  "dataseries": {
45
48
  "title": "Dataseries",
46
49
  "order": 8,
47
50
  "type": "array",
51
+ "dataDrivenDisabled": true,
48
52
  "items": {
49
53
  "type": "object",
50
54
  "properties": {
@@ -60,6 +64,7 @@
60
64
  "description": "Create the specified type of layer on the map.",
61
65
  "type": "string",
62
66
  "required": true,
67
+ "dataDrivenDisabled": true,
63
68
  "enum": ["circle", "symbol", "heatmap", "line"],
64
69
  "order": 2
65
70
  },
@@ -73,6 +78,7 @@
73
78
  "title": "Latest Values",
74
79
  "description": "Restrict the number of rows for this dataseries to the given number of newest values. (If you use split data, then per each of the split dataseries.)",
75
80
  "type": "number",
81
+ "dataDrivenDisabled": true,
76
82
  "order": 4
77
83
  },
78
84
  "config": {
@@ -88,6 +94,7 @@
88
94
  "circle-blur": {
89
95
  "title": "Blur",
90
96
  "description": "Blur of 1 means the whole circle is blurred starting from the center point. Blur 0 means no blur effect.",
97
+ "dataDrivenDisabled": true,
91
98
  "min": 0,
92
99
  "max": 1,
93
100
  "type": "number",
@@ -96,6 +103,7 @@
96
103
  "circle-opacity": {
97
104
  "title": "Opacity",
98
105
  "description": "Opactity 1 means fully opaque, 0 means fully transparent.",
106
+ "dataDrivenDisabled": true,
99
107
  "min": 0,
100
108
  "max": 1,
101
109
  "type": "number",
package/src/widget-mapbox.ts CHANGED
@@ -43,7 +43,7 @@ export class WidgetMapbox extends LitElement {
43
43
 
44
44
  disconnectedCallback() {
45
45
  super.disconnectedCallback()
46
- if(this.resizeObserver) {
46
+ if (this.resizeObserver) {
47
47
  this.resizeObserver.disconnect()
48
48
  }
49
49
  }
@@ -67,16 +67,33 @@ export class WidgetMapbox extends LitElement {
67
67
 
68
68
  this.customDebounce = setTimeout(() => {
69
69
  this.map?.resize()
70
- this.fitBounds()
70
+ this.fitBounds()
71
71
  }, 300)
72
72
  }
73
73
 
74
+ isArrayOfTwoNumbers(v: any) {
75
+ return (
76
+ Array.isArray(v) && // Check if it's an array
77
+ v.length <= 3 && // Check if the array has exactly two elements
78
+ typeof v[0] === 'number' && // Check if the first element is a number
79
+ typeof v[1] === 'number' // Check if the second element is a number
80
+ )
81
+ }
82
+
74
83
  fitBounds() {
75
84
  const bounds = new mapboxgl.LngLatBounds()
76
85
  this.dataSources.forEach((col: GeoJSON.FeatureCollection) => {
77
86
  col.features.forEach((f) => {
78
87
  // @ts-ignore
79
- if (f.geometry.coordinates?.length) bounds.extend(f.geometry.coordinates)
88
+ if (this.isArrayOfTwoNumbers(f.geometry?.coordinates)) {
89
+ // @ts-ignore
90
+ bounds.extend(f.geometry.coordinates)
91
+ } else {
92
+ // @ts-ignore
93
+ for (const lnglat of f.geometry.coordinates) {
94
+ if (this.isArrayOfTwoNumbers(lnglat)) bounds.extend(lnglat)
95
+ }
96
+ }
80
97
  })
81
98
  })
82
99
  if (bounds.isEmpty()) {
@@ -129,7 +146,7 @@ export class WidgetMapbox extends LitElement {
129
146
  // Filter for latest Values
130
147
  this.dataSets.forEach((ds) => {
131
148
  if (ds?.latestValues && ds?.latestValues > 0) {
132
- ds.data = ds?.data?.slice(0, ds.latestValues ?? 1) ?? []
149
+ ds.data = ds?.data?.slice(-ds.latestValues || -1) ?? []
133
150
  }
134
151
  })
135
152
 
@@ -586,6 +603,17 @@ export class WidgetMapbox extends LitElement {
586
603
  a.mapboxgl-ctrl-logo {
587
604
  display: none;
588
605
  }
606
+
607
+ .no-data {
608
+ font-size: 20px;
609
+ color: var(--re-text-color, #000);
610
+ display: flex;
611
+ height: 100%;
612
+ width: 100%;
613
+ text-align: center;
614
+ align-items: center;
615
+ justify-content: center;
616
+ }
589
617
  `
590
618
 
591
619
  render() {
@@ -595,17 +623,10 @@ export class WidgetMapbox extends LitElement {
595
623
  rel="stylesheet"
596
624
  />
597
625
  <div class="wrapper">
598
- <header
599
- class="paging"
600
- ?active=${this.inputData?.title || this.inputData?.subTitle}
601
- >
626
+ <header class="paging" ?active=${this.inputData?.title || this.inputData?.subTitle}>
602
627
  <div class="title">
603
- <h3 class="paging" ?active=${this.inputData?.title}>
604
- ${this.inputData?.title}
605
- </h3>
606
- <p class="paging" ?active=${this.inputData?.subTitle}>
607
- ${this.inputData?.subTitle}
608
- </p>
628
+ <h3 class="paging" ?active=${this.inputData?.title}>${this.inputData?.title}</h3>
629
+ <p class="paging" ?active=${this.inputData?.subTitle}>${this.inputData?.subTitle}</p>
609
630
  </div>
610
631
  <div class="legend paging" ?active=${this?.inputData?.showLegend}>
611
632
  ${repeat(
@@ -624,7 +645,8 @@ export class WidgetMapbox extends LitElement {
624
645
  )}
625
646
  </div>
626
647
  </header>
627
- <div id="map"></div>
648
+ <div class="paging no-data" ?active=${!this.dataSets.length}>No Data</div>
649
+ <div id="map" class="paging" ?active=${this.dataSets.length}></div>
628
650
  </div>
629
651
  `
630
652
  }