@mapcomponents/react-maplibre 0.1.12 → 0.1.13

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 (120) hide show
  1. package/coverage/clover.xml +727 -608
  2. package/coverage/coverage-final.json +19 -14
  3. package/coverage/lcov-report/index.html +156 -96
  4. package/coverage/lcov-report/{components → src/components}/MapLibreMap/MapLibreMap.js.html +10 -10
  5. package/coverage/lcov-report/{components → src/components}/MapLibreMap/index.html +10 -10
  6. package/coverage/lcov-report/{components → src/components}/MlCreatePdfButton/MlCreatePdfButton.js.html +10 -10
  7. package/coverage/lcov-report/{components → src/components}/MlCreatePdfButton/index.html +10 -10
  8. package/coverage/lcov-report/{components → src/components}/MlFeatureEditor/MlFeatureEditor.js.html +10 -10
  9. package/coverage/lcov-report/{components → src/components}/MlFeatureEditor/index.html +10 -10
  10. package/coverage/lcov-report/{components → src/components}/MlFillExtrusionLayer/MlFillExtrusionLayer.js.html +10 -10
  11. package/coverage/lcov-report/{components → src/components}/MlFillExtrusionLayer/index.html +10 -10
  12. package/coverage/lcov-report/{components → src/components}/MlFollowGps/MlFollowGps.js.html +61 -55
  13. package/coverage/lcov-report/{components → src/components}/MlFollowGps/index.html +10 -10
  14. package/coverage/lcov-report/{components → src/components}/MlGPXViewer/MlGPXViewer.js.html +66 -60
  15. package/coverage/lcov-report/{components → src/components}/MlGPXViewer/gpxConverter.js.html +49 -70
  16. package/coverage/lcov-report/{components → src/components}/MlGPXViewer/index.html +25 -25
  17. package/coverage/lcov-report/{components → src/components}/MlGeoJsonLayer/MlGeoJsonLayer.js.html +70 -28
  18. package/coverage/lcov-report/{components → src/components}/MlGeoJsonLayer/index.html +27 -27
  19. package/coverage/lcov-report/{components → src/components}/MlImageMarkerLayer/MlImageMarkerLayer.js.html +19 -22
  20. package/coverage/lcov-report/{components → src/components}/MlImageMarkerLayer/index.html +19 -19
  21. package/coverage/lcov-report/{components → src/components}/MlLayer/MlLayer.js.html +30 -30
  22. package/coverage/lcov-report/{components → src/components}/MlLayer/index.html +26 -26
  23. package/coverage/lcov-report/{components → src/components}/MlLayerMagnify/MlLayerMagnify.js.html +41 -41
  24. package/coverage/lcov-report/{components → src/components}/MlLayerMagnify/index.html +24 -24
  25. package/coverage/lcov-report/{components → src/components}/MlLayerSwipe/MlLayerSwipe.js.html +38 -41
  26. package/coverage/lcov-report/{components → src/components}/MlLayerSwipe/index.html +24 -24
  27. package/coverage/lcov-report/src/components/MlLayerSwitcher/MlLayerSwitcher.js.html +755 -0
  28. package/coverage/lcov-report/src/components/MlLayerSwitcher/components/LayerBox.js.html +380 -0
  29. package/coverage/lcov-report/src/components/MlLayerSwitcher/components/index.html +117 -0
  30. package/coverage/lcov-report/src/components/MlLayerSwitcher/index.html +117 -0
  31. package/coverage/lcov-report/{components → src/components}/MlMarker/MlMarker.js.html +11 -11
  32. package/coverage/lcov-report/{components → src/components}/MlMarker/index.html +10 -10
  33. package/coverage/lcov-report/{components → src/components}/MlNavigationCompass/MlNavigationCompass.js.html +10 -10
  34. package/coverage/lcov-report/{components → src/components}/MlNavigationCompass/index.html +10 -10
  35. package/coverage/lcov-report/{components → src/components}/MlNavigationTools/MlNavigationTools.js.html +48 -36
  36. package/coverage/lcov-report/{components → src/components}/MlNavigationTools/index.html +16 -16
  37. package/coverage/lcov-report/{components → src/components}/MlOsmLayer/MlOsmLayer.js.html +10 -10
  38. package/coverage/lcov-report/{components → src/components}/MlOsmLayer/index.html +10 -10
  39. package/coverage/lcov-report/{components → src/components}/MlScaleReference/MlScaleReference.js.html +10 -10
  40. package/coverage/lcov-report/{components → src/components}/MlScaleReference/index.html +10 -10
  41. package/coverage/lcov-report/{components → src/components}/MlShareMapState/MlShareMapState.js.html +10 -10
  42. package/coverage/lcov-report/{components → src/components}/MlShareMapState/index.html +10 -10
  43. package/coverage/lcov-report/{components → src/components}/MlSpatialElevationProfile/MlSpatialElevationProfile.js.html +10 -10
  44. package/coverage/lcov-report/{components → src/components}/MlSpatialElevationProfile/index.html +10 -10
  45. package/coverage/lcov-report/{components → src/components}/MlThreeJsLayer/MlThreeJsLayer.js.html +30 -54
  46. package/coverage/lcov-report/{components → src/components}/MlThreeJsLayer/index.html +24 -24
  47. package/coverage/lcov-report/{components → src/components}/MlUseMapDebugger/MlUseMapDebugger.js.html +10 -10
  48. package/coverage/lcov-report/{components → src/components}/MlUseMapDebugger/index.html +10 -10
  49. package/coverage/lcov-report/{components → src/components}/MlVectorTileLayer/MlVectorTileLayer.js.html +10 -10
  50. package/coverage/lcov-report/{components → src/components}/MlVectorTileLayer/index.html +10 -10
  51. package/coverage/lcov-report/{components → src/components}/MlWmsFeatureInfoPopup/MlWmsFeatureInfoPopup.js.html +10 -10
  52. package/coverage/lcov-report/{components → src/components}/MlWmsFeatureInfoPopup/index.html +10 -10
  53. package/coverage/lcov-report/{components → src/components}/MlWmsLayer/MlWmsLayer.js.html +13 -13
  54. package/coverage/lcov-report/{components → src/components}/MlWmsLayer/index.html +14 -14
  55. package/coverage/lcov-report/{components → src/components}/MlWmsLoader/MlWmsLoader.js.html +31 -19
  56. package/coverage/lcov-report/{components → src/components}/MlWmsLoader/index.html +16 -16
  57. package/coverage/lcov-report/{hooks → src/hooks}/index.html +10 -10
  58. package/coverage/lcov-report/{hooks → src/hooks}/useMap.js.html +10 -10
  59. package/coverage/lcov-report/{hooks → src/hooks}/useMapState.js.html +10 -10
  60. package/coverage/lcov-report/{hooks → src/hooks}/useWms.js.html +18 -18
  61. package/coverage/lcov-report/src/i18n.js.html +167 -0
  62. package/coverage/lcov-report/src/index.html +117 -0
  63. package/coverage/lcov-report/src/translations/english.js.html +95 -0
  64. package/coverage/lcov-report/src/translations/german.js.html +95 -0
  65. package/coverage/lcov-report/src/translations/index.html +132 -0
  66. package/coverage/lcov.info +1240 -976
  67. package/dist/b556faa3bc6829d2.png +0 -0
  68. package/dist/index.esm.js +102 -71
  69. package/dist/index.esm.js.map +1 -1
  70. package/package.json +3 -1
  71. package/public/assets/dop.png +0 -0
  72. package/public/assets/historic.png +0 -0
  73. package/public/assets/osm.png +0 -0
  74. package/public/thumbnails/MlFollowGps.png +0 -0
  75. package/public/thumbnails/MlThreeJsLayer.png +0 -0
  76. package/src/components/MapLibreMap/lib/MapLibreGlWrapper.js +58 -73
  77. package/src/components/MlFeatureEditor/MlFeatureEditor.meta.json +2 -2
  78. package/src/components/MlFollowGps/MlFollowGps.js +45 -43
  79. package/src/components/MlFollowGps/MlFollowGps.meta.json +2 -2
  80. package/src/components/MlFollowGps/assets/marker.png +0 -0
  81. package/src/components/MlGPXViewer/MlGPXViewer.js +45 -43
  82. package/src/components/MlGPXViewer/gpxConverter.js +22 -29
  83. package/src/components/MlGeoJsonLayer/MlGeoJsonLayer.js +22 -8
  84. package/src/components/MlImageMarkerLayer/MlImageMarkerLayer.js +3 -4
  85. package/src/components/MlImageMarkerLayer/MlImageMarkerLayer.test.js +6 -7
  86. package/src/components/MlLayer/MlLayer.js +2 -2
  87. package/src/components/MlLayer/MlLayer.test.js +12 -10
  88. package/src/components/MlLayerMagnify/MlLayerMagnify.js +3 -3
  89. package/src/components/MlLayerSwipe/MlLayerSwipe.js +4 -5
  90. package/src/components/MlLayerSwitcher/MlLayerSwitcher.css +17 -0
  91. package/src/components/MlLayerSwitcher/MlLayerSwitcher.doc.de.md +3 -0
  92. package/src/components/MlLayerSwitcher/MlLayerSwitcher.js +223 -0
  93. package/src/components/MlLayerSwitcher/MlLayerSwitcher.meta_.json +15 -0
  94. package/src/components/MlLayerSwitcher/MlLayerSwitcher.stories.js +106 -0
  95. package/src/components/MlLayerSwitcher/assets/sample_1.json +26 -0
  96. package/src/components/MlLayerSwitcher/assets/sample_2.json +22 -0
  97. package/src/components/MlLayerSwitcher/components/LayerBox.js +98 -0
  98. package/src/components/MlMarker/MlMarker.js +1 -1
  99. package/src/components/MlNavigationTools/MlNavigationTools.js +26 -22
  100. package/src/components/MlScaleReference/MlScaleReference.meta.json +1 -1
  101. package/src/components/MlScaleReference/MlScaleReference.stories.js +25 -21
  102. package/src/components/MlSpatialElevationProfile/MlSpatialElevationProfile.stories.js +12 -6
  103. package/src/components/MlThreeJsLayer/MlThreeJsLayer.js +8 -15
  104. package/src/components/MlWmsLayer/MlWmsLayer.js +1 -1
  105. package/src/components/MlWmsLoader/MlWmsLoader.js +8 -4
  106. package/src/components/MlWmsLoader/MlWmsLoader.meta.json +1 -1
  107. package/src/components/MlWmsLoader/MlWmsLoader.stories.js +5 -4
  108. package/src/decorators/EmptyMapContextDecorator.js +11 -6
  109. package/src/decorators/MapContext3DDecorator.js +25 -20
  110. package/src/decorators/MapContextDashboardDecorator.js +7 -2
  111. package/src/decorators/MapContextDecorator.js +7 -3
  112. package/src/decorators/MapContextKlokantechBasicDecorator.js +8 -4
  113. package/src/decorators/MultiMapContextDecorator.js +2 -1
  114. package/src/hooks/useWms.js +7 -6
  115. package/src/i18n.js +28 -0
  116. package/src/translations/english.js +4 -0
  117. package/src/translations/german.js +4 -0
  118. package/src/ui_components/ImageLoader.js +73 -0
  119. package/src/ui_components/Sidebar.js +75 -20
  120. package/src/ui_components/TopToolbar.js +18 -18
@@ -3,15 +3,15 @@
3
3
  <html lang="en">
4
4
 
5
5
  <head>
6
- <title>Code coverage report for components/MlGeoJsonLayer/MlGeoJsonLayer.js</title>
6
+ <title>Code coverage report for src/components/MlGeoJsonLayer/MlGeoJsonLayer.js</title>
7
7
  <meta charset="utf-8" />
8
- <link rel="stylesheet" href="../../prettify.css" />
9
- <link rel="stylesheet" href="../../base.css" />
10
- <link rel="shortcut icon" type="image/x-icon" href="../../favicon.png" />
8
+ <link rel="stylesheet" href="../../../prettify.css" />
9
+ <link rel="stylesheet" href="../../../base.css" />
10
+ <link rel="shortcut icon" type="image/x-icon" href="../../../favicon.png" />
11
11
  <meta name="viewport" content="width=device-width, initial-scale=1" />
12
12
  <style type='text/css'>
13
13
  .coverage-summary .sorter {
14
- background-image: url(../../sort-arrow-sprite.png);
14
+ background-image: url(../../../sort-arrow-sprite.png);
15
15
  }
16
16
  </style>
17
17
  </head>
@@ -19,34 +19,34 @@
19
19
  <body>
20
20
  <div class='wrapper'>
21
21
  <div class='pad1'>
22
- <h1><a href="../../index.html">All files</a> / <a href="index.html">components/MlGeoJsonLayer</a> MlGeoJsonLayer.js</h1>
22
+ <h1><a href="../../../index.html">All files</a> / <a href="index.html">src/components/MlGeoJsonLayer</a> MlGeoJsonLayer.js</h1>
23
23
  <div class='clearfix'>
24
24
 
25
25
  <div class='fl pad1y space-right2'>
26
- <span class="strong">68.85% </span>
26
+ <span class="strong">68.18% </span>
27
27
  <span class="quiet">Statements</span>
28
- <span class='fraction'>42/61</span>
28
+ <span class='fraction'>45/66</span>
29
29
  </div>
30
30
 
31
31
 
32
32
  <div class='fl pad1y space-right2'>
33
- <span class="strong">56% </span>
33
+ <span class="strong">57.14% </span>
34
34
  <span class="quiet">Branches</span>
35
- <span class='fraction'>28/50</span>
35
+ <span class='fraction'>32/56</span>
36
36
  </div>
37
37
 
38
38
 
39
39
  <div class='fl pad1y space-right2'>
40
- <span class="strong">85.71% </span>
40
+ <span class="strong">87.5% </span>
41
41
  <span class="quiet">Functions</span>
42
- <span class='fraction'>6/7</span>
42
+ <span class='fraction'>7/8</span>
43
43
  </div>
44
44
 
45
45
 
46
46
  <div class='fl pad1y space-right2'>
47
- <span class="strong">67.24% </span>
47
+ <span class="strong">66.12% </span>
48
48
  <span class="quiet">Lines</span>
49
- <span class='fraction'>39/58</span>
49
+ <span class='fraction'>41/62</span>
50
50
  </div>
51
51
 
52
52
 
@@ -289,7 +289,21 @@
289
289
  <a name='L224'></a><a href='#L224'>224</a>
290
290
  <a name='L225'></a><a href='#L225'>225</a>
291
291
  <a name='L226'></a><a href='#L226'>226</a>
292
- <a name='L227'></a><a href='#L227'>227</a></td><td class="line-coverage quiet"><span class="cline-any cline-neutral">&nbsp;</span>
292
+ <a name='L227'></a><a href='#L227'>227</a>
293
+ <a name='L228'></a><a href='#L228'>228</a>
294
+ <a name='L229'></a><a href='#L229'>229</a>
295
+ <a name='L230'></a><a href='#L230'>230</a>
296
+ <a name='L231'></a><a href='#L231'>231</a>
297
+ <a name='L232'></a><a href='#L232'>232</a>
298
+ <a name='L233'></a><a href='#L233'>233</a>
299
+ <a name='L234'></a><a href='#L234'>234</a>
300
+ <a name='L235'></a><a href='#L235'>235</a>
301
+ <a name='L236'></a><a href='#L236'>236</a>
302
+ <a name='L237'></a><a href='#L237'>237</a>
303
+ <a name='L238'></a><a href='#L238'>238</a>
304
+ <a name='L239'></a><a href='#L239'>239</a>
305
+ <a name='L240'></a><a href='#L240'>240</a>
306
+ <a name='L241'></a><a href='#L241'>241</a></td><td class="line-coverage quiet"><span class="cline-any cline-neutral">&nbsp;</span>
293
307
  <span class="cline-any cline-neutral">&nbsp;</span>
294
308
  <span class="cline-any cline-neutral">&nbsp;</span>
295
309
  <span class="cline-any cline-neutral">&nbsp;</span>
@@ -329,7 +343,6 @@
329
343
  <span class="cline-any cline-no">&nbsp;</span>
330
344
  <span class="cline-any cline-neutral">&nbsp;</span>
331
345
  <span class="cline-any cline-yes">2x</span>
332
- <span class="cline-any cline-neutral">&nbsp;</span>
333
346
  <span class="cline-any cline-yes">2x</span>
334
347
  <span class="cline-any cline-neutral">&nbsp;</span>
335
348
  <span class="cline-any cline-yes">2x</span>
@@ -340,8 +353,14 @@
340
353
  <span class="cline-any cline-yes">8x</span>
341
354
  <span class="cline-any cline-yes">8x</span>
342
355
  <span class="cline-any cline-neutral">&nbsp;</span>
356
+ <span class="cline-any cline-no">&nbsp;</span>
357
+ <span class="cline-any cline-no">&nbsp;</span>
358
+ <span class="cline-any cline-neutral">&nbsp;</span>
343
359
  <span class="cline-any cline-neutral">&nbsp;</span>
344
360
  <span class="cline-any cline-neutral">&nbsp;</span>
361
+ <span class="cline-any cline-yes">8x</span>
362
+ <span class="cline-any cline-yes">8x</span>
363
+ <span class="cline-any cline-neutral">&nbsp;</span>
345
364
  <span class="cline-any cline-no">&nbsp;</span>
346
365
  <span class="cline-any cline-no">&nbsp;</span>
347
366
  <span class="cline-any cline-neutral">&nbsp;</span>
@@ -432,6 +451,7 @@
432
451
  <span class="cline-any cline-neutral">&nbsp;</span>
433
452
  <span class="cline-any cline-neutral">&nbsp;</span>
434
453
  <span class="cline-any cline-neutral">&nbsp;</span>
454
+ <span class="cline-any cline-neutral">&nbsp;</span>
435
455
  <span class="cline-any cline-yes">4x</span>
436
456
  <span class="cline-any cline-no">&nbsp;</span>
437
457
  <span class="cline-any cline-neutral">&nbsp;</span>
@@ -515,6 +535,14 @@
515
535
  <span class="cline-any cline-neutral">&nbsp;</span>
516
536
  <span class="cline-any cline-neutral">&nbsp;</span>
517
537
  <span class="cline-any cline-neutral">&nbsp;</span>
538
+ <span class="cline-any cline-neutral">&nbsp;</span>
539
+ <span class="cline-any cline-neutral">&nbsp;</span>
540
+ <span class="cline-any cline-neutral">&nbsp;</span>
541
+ <span class="cline-any cline-neutral">&nbsp;</span>
542
+ <span class="cline-any cline-neutral">&nbsp;</span>
543
+ <span class="cline-any cline-neutral">&nbsp;</span>
544
+ <span class="cline-any cline-neutral">&nbsp;</span>
545
+ <span class="cline-any cline-neutral">&nbsp;</span>
518
546
  <span class="cline-any cline-neutral">&nbsp;</span></td><td class="text"><pre class="prettyprint lang-js">import React, { useRef, useEffect, useContext, useCallback } from "react";
519
547
  import PropTypes from "prop-types";
520
548
  &nbsp;
@@ -551,11 +579,10 @@ const MlGeoJsonLayer = (props) =&gt; {
551
579
  let _componentId = componentId.current;
552
580
  return () =&gt; {
553
581
  // This is the cleanup function, it is called when this react component is removed from react-dom
554
- <span class="missing-if-branch" title="if path not taken" >I</span>if(transitionTimeoutRef.current){
555
- <span class="cstat-no" title="statement not covered" > clearTimeout(transitionTimeoutRef.current)</span>
582
+ <span class="missing-if-branch" title="if path not taken" >I</span>if (transitionTimeoutRef.current) {
583
+ <span class="cstat-no" title="statement not covered" > clearTimeout(transitionTimeoutRef.current);</span>
556
584
  }
557
585
  if (mapRef.current) {
558
- &nbsp;
559
586
  mapRef.current.cleanup(_componentId);
560
587
  &nbsp;
561
588
  mapRef.current = null;
@@ -565,11 +592,17 @@ const MlGeoJsonLayer = (props) =&gt; {
565
592
  &nbsp;
566
593
  useEffect(() =&gt; {
567
594
  if (!mapRef.current || <span class="branch-1 cbranch-no" title="branch not covered" >!initializedRef.current)</span> return;
568
- // the MapLibre-gl instance (mapContext.map) is accessible here
569
- // initialize the layer and add it to the MapLibre-gl instance or do something else with it
595
+ &nbsp;
596
+ <span class="cstat-no" title="statement not covered" > for (var key in props.layout) {</span>
597
+ <span class="cstat-no" title="statement not covered" > mapContext.getMap(props.mapId).setLayoutProperty(layerId.current, key, props.layout[key]);</span>
598
+ }
599
+ }, [props.layout, mapContext, props.mapId]);
600
+ &nbsp;
601
+ useEffect(() =&gt; {
602
+ if (!mapRef.current || <span class="branch-1 cbranch-no" title="branch not covered" >!initializedRef.current)</span> return;
570
603
  &nbsp;
571
604
  <span class="cstat-no" title="statement not covered" > for (var key in props.paint) {</span>
572
- <span class="cstat-no" title="statement not covered" > mapContext.getMap(props.mapId).setPaintProperty(componentId.current, key, props.paint[key]);</span>
605
+ <span class="cstat-no" title="statement not covered" > mapContext.getMap(props.mapId).setPaintProperty(layerId.current, key, props.paint[key]);</span>
573
606
  }
574
607
  }, [props.paint, mapContext, props.mapId]);
575
608
  &nbsp;
@@ -653,6 +686,7 @@ const MlGeoJsonLayer = (props) =&gt; {
653
686
  "line-color": "rgb(100,200,100)",
654
687
  "line-width": 10,
655
688
  },
689
+ layout: props.layout || {},
656
690
  },
657
691
  props.insertBeforeLayer,
658
692
  componentId.current
@@ -695,8 +729,16 @@ MlGeoJsonLayer.propTypes = {
695
729
  */
696
730
  type: PropTypes.string,
697
731
  /**
698
- * Paint object, that is passed to the addLayer call.
699
- * Possible propsdepend on the layer type.
732
+ * Layout property object, that is passed to the addLayer call.
733
+ * Possible props depend on the layer type.
734
+ * https://maplibre.org/maplibre-gl-js-docs/style-spec/layers/#line
735
+ * https://maplibre.org/maplibre-gl-js-docs/style-spec/layers/#circle
736
+ * https://maplibre.org/maplibre-gl-js-docs/style-spec/layers/#fill
737
+ */
738
+ layout: PropTypes.object,
739
+ /**
740
+ * Paint property object, that is passed to the addLayer call.
741
+ * Possible props depend on the layer type.
700
742
  * https://maplibre.org/maplibre-gl-js-docs/style-spec/layers/#line
701
743
  * https://maplibre.org/maplibre-gl-js-docs/style-spec/layers/#circle
702
744
  * https://maplibre.org/maplibre-gl-js-docs/style-spec/layers/#fill
@@ -748,17 +790,17 @@ export default MlGeoJsonLayer;
748
790
  <div class='footer quiet pad2 space-top1 center small'>
749
791
  Code coverage generated by
750
792
  <a href="https://istanbul.js.org/" target="_blank" rel="noopener">istanbul</a>
751
- at Sat Dec 04 2021 10:55:55 GMT+0000 (Coordinated Universal Time)
793
+ at Wed Dec 15 2021 17:14:00 GMT+0000 (Coordinated Universal Time)
752
794
  </div>
753
795
  </div>
754
- <script src="../../prettify.js"></script>
796
+ <script src="../../../prettify.js"></script>
755
797
  <script>
756
798
  window.onload = function () {
757
799
  prettyPrint();
758
800
  };
759
801
  </script>
760
- <script src="../../sorter.js"></script>
761
- <script src="../../block-navigation.js"></script>
802
+ <script src="../../../sorter.js"></script>
803
+ <script src="../../../block-navigation.js"></script>
762
804
  </body>
763
805
  </html>
764
806
 
@@ -3,15 +3,15 @@
3
3
  <html lang="en">
4
4
 
5
5
  <head>
6
- <title>Code coverage report for components/MlGeoJsonLayer</title>
6
+ <title>Code coverage report for src/components/MlGeoJsonLayer</title>
7
7
  <meta charset="utf-8" />
8
- <link rel="stylesheet" href="../../prettify.css" />
9
- <link rel="stylesheet" href="../../base.css" />
10
- <link rel="shortcut icon" type="image/x-icon" href="../../favicon.png" />
8
+ <link rel="stylesheet" href="../../../prettify.css" />
9
+ <link rel="stylesheet" href="../../../base.css" />
10
+ <link rel="shortcut icon" type="image/x-icon" href="../../../favicon.png" />
11
11
  <meta name="viewport" content="width=device-width, initial-scale=1" />
12
12
  <style type='text/css'>
13
13
  .coverage-summary .sorter {
14
- background-image: url(../../sort-arrow-sprite.png);
14
+ background-image: url(../../../sort-arrow-sprite.png);
15
15
  }
16
16
  </style>
17
17
  </head>
@@ -19,34 +19,34 @@
19
19
  <body>
20
20
  <div class='wrapper'>
21
21
  <div class='pad1'>
22
- <h1><a href="../../index.html">All files</a> components/MlGeoJsonLayer</h1>
22
+ <h1><a href="../../../index.html">All files</a> src/components/MlGeoJsonLayer</h1>
23
23
  <div class='clearfix'>
24
24
 
25
25
  <div class='fl pad1y space-right2'>
26
- <span class="strong">68.85% </span>
26
+ <span class="strong">68.18% </span>
27
27
  <span class="quiet">Statements</span>
28
- <span class='fraction'>42/61</span>
28
+ <span class='fraction'>45/66</span>
29
29
  </div>
30
30
 
31
31
 
32
32
  <div class='fl pad1y space-right2'>
33
- <span class="strong">56% </span>
33
+ <span class="strong">57.14% </span>
34
34
  <span class="quiet">Branches</span>
35
- <span class='fraction'>28/50</span>
35
+ <span class='fraction'>32/56</span>
36
36
  </div>
37
37
 
38
38
 
39
39
  <div class='fl pad1y space-right2'>
40
- <span class="strong">85.71% </span>
40
+ <span class="strong">87.5% </span>
41
41
  <span class="quiet">Functions</span>
42
- <span class='fraction'>6/7</span>
42
+ <span class='fraction'>7/8</span>
43
43
  </div>
44
44
 
45
45
 
46
46
  <div class='fl pad1y space-right2'>
47
- <span class="strong">67.24% </span>
47
+ <span class="strong">66.12% </span>
48
48
  <span class="quiet">Lines</span>
49
- <span class='fraction'>39/58</span>
49
+ <span class='fraction'>41/62</span>
50
50
  </div>
51
51
 
52
52
 
@@ -80,17 +80,17 @@
80
80
  </thead>
81
81
  <tbody><tr>
82
82
  <td class="file medium" data-value="MlGeoJsonLayer.js"><a href="MlGeoJsonLayer.js.html">MlGeoJsonLayer.js</a></td>
83
- <td data-value="68.85" class="pic medium">
83
+ <td data-value="68.18" class="pic medium">
84
84
  <div class="chart"><div class="cover-fill" style="width: 68%"></div><div class="cover-empty" style="width: 32%"></div></div>
85
85
  </td>
86
- <td data-value="68.85" class="pct medium">68.85%</td>
87
- <td data-value="61" class="abs medium">42/61</td>
88
- <td data-value="56" class="pct medium">56%</td>
89
- <td data-value="50" class="abs medium">28/50</td>
90
- <td data-value="85.71" class="pct high">85.71%</td>
91
- <td data-value="7" class="abs high">6/7</td>
92
- <td data-value="67.24" class="pct medium">67.24%</td>
93
- <td data-value="58" class="abs medium">39/58</td>
86
+ <td data-value="68.18" class="pct medium">68.18%</td>
87
+ <td data-value="66" class="abs medium">45/66</td>
88
+ <td data-value="57.14" class="pct medium">57.14%</td>
89
+ <td data-value="56" class="abs medium">32/56</td>
90
+ <td data-value="87.5" class="pct high">87.5%</td>
91
+ <td data-value="8" class="abs high">7/8</td>
92
+ <td data-value="66.12" class="pct medium">66.12%</td>
93
+ <td data-value="62" class="abs medium">41/62</td>
94
94
  </tr>
95
95
 
96
96
  </tbody>
@@ -101,17 +101,17 @@
101
101
  <div class='footer quiet pad2 space-top1 center small'>
102
102
  Code coverage generated by
103
103
  <a href="https://istanbul.js.org/" target="_blank" rel="noopener">istanbul</a>
104
- at Sat Dec 04 2021 10:55:55 GMT+0000 (Coordinated Universal Time)
104
+ at Wed Dec 15 2021 17:14:00 GMT+0000 (Coordinated Universal Time)
105
105
  </div>
106
106
  </div>
107
- <script src="../../prettify.js"></script>
107
+ <script src="../../../prettify.js"></script>
108
108
  <script>
109
109
  window.onload = function () {
110
110
  prettyPrint();
111
111
  };
112
112
  </script>
113
- <script src="../../sorter.js"></script>
114
- <script src="../../block-navigation.js"></script>
113
+ <script src="../../../sorter.js"></script>
114
+ <script src="../../../block-navigation.js"></script>
115
115
  </body>
116
116
  </html>
117
117
 
@@ -3,15 +3,15 @@
3
3
  <html lang="en">
4
4
 
5
5
  <head>
6
- <title>Code coverage report for components/MlImageMarkerLayer/MlImageMarkerLayer.js</title>
6
+ <title>Code coverage report for src/components/MlImageMarkerLayer/MlImageMarkerLayer.js</title>
7
7
  <meta charset="utf-8" />
8
- <link rel="stylesheet" href="../../prettify.css" />
9
- <link rel="stylesheet" href="../../base.css" />
10
- <link rel="shortcut icon" type="image/x-icon" href="../../favicon.png" />
8
+ <link rel="stylesheet" href="../../../prettify.css" />
9
+ <link rel="stylesheet" href="../../../base.css" />
10
+ <link rel="shortcut icon" type="image/x-icon" href="../../../favicon.png" />
11
11
  <meta name="viewport" content="width=device-width, initial-scale=1" />
12
12
  <style type='text/css'>
13
13
  .coverage-summary .sorter {
14
- background-image: url(../../sort-arrow-sprite.png);
14
+ background-image: url(../../../sort-arrow-sprite.png);
15
15
  }
16
16
  </style>
17
17
  </head>
@@ -19,13 +19,13 @@
19
19
  <body>
20
20
  <div class='wrapper'>
21
21
  <div class='pad1'>
22
- <h1><a href="../../index.html">All files</a> / <a href="index.html">components/MlImageMarkerLayer</a> MlImageMarkerLayer.js</h1>
22
+ <h1><a href="../../../index.html">All files</a> / <a href="index.html">src/components/MlImageMarkerLayer</a> MlImageMarkerLayer.js</h1>
23
23
  <div class='clearfix'>
24
24
 
25
25
  <div class='fl pad1y space-right2'>
26
- <span class="strong">79.06% </span>
26
+ <span class="strong">79.54% </span>
27
27
  <span class="quiet">Statements</span>
28
- <span class='fraction'>34/43</span>
28
+ <span class='fraction'>35/44</span>
29
29
  </div>
30
30
 
31
31
 
@@ -44,9 +44,9 @@
44
44
 
45
45
 
46
46
  <div class='fl pad1y space-right2'>
47
- <span class="strong">80.95% </span>
47
+ <span class="strong">81.39% </span>
48
48
  <span class="quiet">Lines</span>
49
- <span class='fraction'>34/42</span>
49
+ <span class='fraction'>35/43</span>
50
50
  </div>
51
51
 
52
52
 
@@ -173,8 +173,7 @@
173
173
  <a name='L108'></a><a href='#L108'>108</a>
174
174
  <a name='L109'></a><a href='#L109'>109</a>
175
175
  <a name='L110'></a><a href='#L110'>110</a>
176
- <a name='L111'></a><a href='#L111'>111</a>
177
- <a name='L112'></a><a href='#L112'>112</a></td><td class="line-coverage quiet"><span class="cline-any cline-neutral">&nbsp;</span>
176
+ <a name='L111'></a><a href='#L111'>111</a></td><td class="line-coverage quiet"><span class="cline-any cline-neutral">&nbsp;</span>
178
177
  <span class="cline-any cline-neutral">&nbsp;</span>
179
178
  <span class="cline-any cline-neutral">&nbsp;</span>
180
179
  <span class="cline-any cline-neutral">&nbsp;</span>
@@ -183,8 +182,6 @@
183
182
  <span class="cline-any cline-neutral">&nbsp;</span>
184
183
  <span class="cline-any cline-yes">8x</span>
185
184
  <span class="cline-any cline-yes">8x</span>
186
- <span class="cline-any cline-neutral">&nbsp;</span>
187
- <span class="cline-any cline-neutral">&nbsp;</span>
188
185
  <span class="cline-any cline-yes">8x</span>
189
186
  <span class="cline-any cline-yes">8x</span>
190
187
  <span class="cline-any cline-yes">8x</span>
@@ -260,6 +257,7 @@
260
257
  <span class="cline-any cline-neutral">&nbsp;</span>
261
258
  <span class="cline-any cline-yes">4x</span>
262
259
  <span class="cline-any cline-yes">4x</span>
260
+ <span class="cline-any cline-yes">4x</span>
263
261
  <span class="cline-any cline-no">&nbsp;</span>
264
262
  <span class="cline-any cline-no">&nbsp;</span>
265
263
  <span class="cline-any cline-neutral">&nbsp;</span>
@@ -293,14 +291,12 @@ import { MapContext } from "@mapcomponents/react-core";
293
291
  const MlImageMarkerLayer = (props) =&gt; {
294
292
  // Use a useRef hook to reference the layer object to be able to access it later inside useEffect hooks
295
293
  const mapRef = useRef(null);
296
- const componentId = useRef(
297
- (props.idPrefix ? <span class="branch-0 cbranch-no" title="branch not covered" >props.idPrefix </span>: "MlOsmLayer-") + uuidv4()
298
- );
294
+ const componentId = useRef((props.idPrefix ? <span class="branch-0 cbranch-no" title="branch not covered" >props.idPrefix </span>: "MlImageMarkerLayer-") + uuidv4());
299
295
  const mapContext = useContext(MapContext);
300
296
  const layerInitializedRef = useRef(false);
301
297
  const idSuffixRef = useRef(props.idSuffix || new Date().getTime());
302
298
  const imageIdRef = useRef(props.imageId || "img_" + new Date().getTime());
303
- const layerId = useRef((props.layerId || "MlImageMarkerLayer-") + idSuffixRef.current);
299
+ const layerId = useRef(props.layerId || componentId.current);
304
300
  &nbsp;
305
301
  useEffect(() =&gt; {
306
302
  let _componentId = componentId.current;
@@ -369,6 +365,7 @@ const MlImageMarkerLayer = (props) =&gt; {
369
365
  &nbsp;
370
366
  layerInitializedRef.current = true;
371
367
  &nbsp;
368
+ console.log(props.imgSrc);
372
369
  if (props.imgSrc) {
373
370
  mapRef.current.loadImage(props.imgSrc, <span class="fstat-no" title="function not covered" >fu</span>nction (error, image) {
374
371
  <span class="cstat-no" title="statement not covered" > if (error) <span class="cstat-no" title="statement not covered" >throw error;</span></span>
@@ -403,17 +400,17 @@ export default MlImageMarkerLayer;
403
400
  <div class='footer quiet pad2 space-top1 center small'>
404
401
  Code coverage generated by
405
402
  <a href="https://istanbul.js.org/" target="_blank" rel="noopener">istanbul</a>
406
- at Sat Dec 04 2021 10:55:55 GMT+0000 (Coordinated Universal Time)
403
+ at Wed Dec 15 2021 17:14:00 GMT+0000 (Coordinated Universal Time)
407
404
  </div>
408
405
  </div>
409
- <script src="../../prettify.js"></script>
406
+ <script src="../../../prettify.js"></script>
410
407
  <script>
411
408
  window.onload = function () {
412
409
  prettyPrint();
413
410
  };
414
411
  </script>
415
- <script src="../../sorter.js"></script>
416
- <script src="../../block-navigation.js"></script>
412
+ <script src="../../../sorter.js"></script>
413
+ <script src="../../../block-navigation.js"></script>
417
414
  </body>
418
415
  </html>
419
416
 
@@ -3,15 +3,15 @@
3
3
  <html lang="en">
4
4
 
5
5
  <head>
6
- <title>Code coverage report for components/MlImageMarkerLayer</title>
6
+ <title>Code coverage report for src/components/MlImageMarkerLayer</title>
7
7
  <meta charset="utf-8" />
8
- <link rel="stylesheet" href="../../prettify.css" />
9
- <link rel="stylesheet" href="../../base.css" />
10
- <link rel="shortcut icon" type="image/x-icon" href="../../favicon.png" />
8
+ <link rel="stylesheet" href="../../../prettify.css" />
9
+ <link rel="stylesheet" href="../../../base.css" />
10
+ <link rel="shortcut icon" type="image/x-icon" href="../../../favicon.png" />
11
11
  <meta name="viewport" content="width=device-width, initial-scale=1" />
12
12
  <style type='text/css'>
13
13
  .coverage-summary .sorter {
14
- background-image: url(../../sort-arrow-sprite.png);
14
+ background-image: url(../../../sort-arrow-sprite.png);
15
15
  }
16
16
  </style>
17
17
  </head>
@@ -19,13 +19,13 @@
19
19
  <body>
20
20
  <div class='wrapper'>
21
21
  <div class='pad1'>
22
- <h1><a href="../../index.html">All files</a> components/MlImageMarkerLayer</h1>
22
+ <h1><a href="../../../index.html">All files</a> src/components/MlImageMarkerLayer</h1>
23
23
  <div class='clearfix'>
24
24
 
25
25
  <div class='fl pad1y space-right2'>
26
- <span class="strong">79.06% </span>
26
+ <span class="strong">79.54% </span>
27
27
  <span class="quiet">Statements</span>
28
- <span class='fraction'>34/43</span>
28
+ <span class='fraction'>35/44</span>
29
29
  </div>
30
30
 
31
31
 
@@ -44,9 +44,9 @@
44
44
 
45
45
 
46
46
  <div class='fl pad1y space-right2'>
47
- <span class="strong">80.95% </span>
47
+ <span class="strong">81.39% </span>
48
48
  <span class="quiet">Lines</span>
49
- <span class='fraction'>34/42</span>
49
+ <span class='fraction'>35/43</span>
50
50
  </div>
51
51
 
52
52
 
@@ -80,17 +80,17 @@
80
80
  </thead>
81
81
  <tbody><tr>
82
82
  <td class="file medium" data-value="MlImageMarkerLayer.js"><a href="MlImageMarkerLayer.js.html">MlImageMarkerLayer.js</a></td>
83
- <td data-value="79.06" class="pic medium">
83
+ <td data-value="79.54" class="pic medium">
84
84
  <div class="chart"><div class="cover-fill" style="width: 79%"></div><div class="cover-empty" style="width: 21%"></div></div>
85
85
  </td>
86
- <td data-value="79.06" class="pct medium">79.06%</td>
87
- <td data-value="43" class="abs medium">34/43</td>
86
+ <td data-value="79.54" class="pct medium">79.54%</td>
87
+ <td data-value="44" class="abs medium">35/44</td>
88
88
  <td data-value="62.85" class="pct medium">62.85%</td>
89
89
  <td data-value="35" class="abs medium">22/35</td>
90
90
  <td data-value="87.5" class="pct high">87.5%</td>
91
91
  <td data-value="8" class="abs high">7/8</td>
92
- <td data-value="80.95" class="pct high">80.95%</td>
93
- <td data-value="42" class="abs high">34/42</td>
92
+ <td data-value="81.39" class="pct high">81.39%</td>
93
+ <td data-value="43" class="abs high">35/43</td>
94
94
  </tr>
95
95
 
96
96
  </tbody>
@@ -101,17 +101,17 @@
101
101
  <div class='footer quiet pad2 space-top1 center small'>
102
102
  Code coverage generated by
103
103
  <a href="https://istanbul.js.org/" target="_blank" rel="noopener">istanbul</a>
104
- at Sat Dec 04 2021 10:55:55 GMT+0000 (Coordinated Universal Time)
104
+ at Wed Dec 15 2021 17:14:00 GMT+0000 (Coordinated Universal Time)
105
105
  </div>
106
106
  </div>
107
- <script src="../../prettify.js"></script>
107
+ <script src="../../../prettify.js"></script>
108
108
  <script>
109
109
  window.onload = function () {
110
110
  prettyPrint();
111
111
  };
112
112
  </script>
113
- <script src="../../sorter.js"></script>
114
- <script src="../../block-navigation.js"></script>
113
+ <script src="../../../sorter.js"></script>
114
+ <script src="../../../block-navigation.js"></script>
115
115
  </body>
116
116
  </html>
117
117