@vcmap/ui 5.3.7 → 6.0.0-rc.10

package/config/base.config.json

@@ -89,10 +89,10 @@
           }
         },
         "MyImpressum": {
-          "content": "![image](https://vc.systems/wp-content/uploads/2020/07/vcs_logo.png)<br>**Firmierung:** <br>Musterfirma GmbH<br><br>**Sitz:**<br>Musterstadt<br><br>**Adresse:**<br>Musterstraße 1 a<br>12345 Musterstadt<br>Deutschland<br><br> **Telefon:** +49 (0) 00 . 0000 . 000 . 00<br> **Telefax:** +49 (0) 00 . 0000 . 000 . 00<br> **E-Mail:** [info@musterfirma.de](mailto:info@musterfirma.de)<br><br>**Geschäftsführer:**<br>- Max Mustermann<br><br>**Registergericht:**<br>Musterstadt 1234567<br><br>**Steuernummer:**<br>11/222/33333<br><br>**Umsatzsteuer-ID:**<br>DE1234567890<br><br>**Copyright:**<br>Alle Rechte vorbehalten. Sämtliche Inhalte (Texte, Bilder, Grafiken, Animationen) sind urheberrechtlich geschützt. Sie dürfen ohne Zustimmung der Musterfirma GmbH zu kommerziellen Zwecken weder kopiert, verbreitet noch verändert werden.<br>(Copyright 2023 Musterfirma GmbH)<br><br>**Inhalte:**<br>Trotz sorgfältiger Bearbeitung kann die Musterfirma GmbH für die Fehlerfreiheit und Genauigkeit der angebotenen Informationen auf [www.musterfirma.de](http://www.musterfirma.de) nicht garantieren. Jegliche Haftung für Schäden, die direkt oder indirekt aus der Benutzung von [www.musterfirma.de](http://www.musterfirma.de) entstehen und nicht auf Vorsatz oder grober Fahrlässigkeit der Musterfirma GmbH beruhen, ist ausgeschlossen. Für die Inhalte von mit [www.musterfirma.de](http://www.musterfirma.de) verlinkter Websites ist grundsätzlich jede Haftung ausgeschlossen.<br><br>**Datenschutz:**<br>Die Musterfirma GmbH nimmt den Schutz Ihrer persönlichen Daten sehr ernst. Wir halten uns strikt an die Regeln der Datenschutzgesetze. Personenbezogene Daten werden auf dieser Webseite nur im technisch notwendigen Umfang erhoben. In keinem Fall werden die erhobenen Daten verkauft oder aus anderen Gründen an Dritte weitergegeben. Unsere vollständige Datenschutzerklärung können Sie [hier](#) nachlesen.<br>"
+          "content": "![image](https://vc.systems/wp-content/uploads/2020/07/vcs_logo.png)\n\n**Firmierung:** \nMusterfirma GmbH\n\n**Sitz:**\nMusterstadt\n\n**Adresse:**\nMusterstraße 1 a\n12345 Musterstadt\nDeutschland\n\n **Telefon:** +49 (0) 00 . 0000 . 000 . 00\n\n **Telefax:** +49 (0) 00 . 0000 . 000 . 00\n\n **E-Mail:** [info&commat;musterfirma.de](mailto:info&commat;musterfirma.de)\n\n**Geschäftsführer:**\nMax Mustermann\n\n**Registergericht:**\nMusterstadt 1234567\n\n**Steuernummer:**\n11/222/33333\n\n**Umsatzsteuer-ID:**\nDE1234567890\n\n**Copyright:**\n\nAlle Rechte vorbehalten. Sämtliche Inhalte (Texte, Bilder, Grafiken, Animationen) sind urheberrechtlich geschützt. Sie dürfen ohne Zustimmung der Musterfirma GmbH zu kommerziellen Zwecken weder kopiert, verbreitet noch verändert werden.\n\n(Copyright 2023 Musterfirma GmbH)\n\n**Inhalte:**\n\nTrotz sorgfältiger Bearbeitung kann die Musterfirma GmbH für die Fehlerfreiheit und Genauigkeit der angebotenen Informationen auf [www.musterfirma.de](http://www.musterfirma.de) nicht garantieren. Jegliche Haftung für Schäden, die direkt oder indirekt aus der Benutzung von [www.musterfirma.de](http://www.musterfirma.de) entstehen und nicht auf Vorsatz oder grober Fahrlässigkeit der Musterfirma GmbH beruhen, ist ausgeschlossen. Für die Inhalte von mit [www.musterfirma.de](http://www.musterfirma.de) verlinkter Websites ist grundsätzlich jede Haftung ausgeschlossen.\n\n**Datenschutz:**\n\nDie Musterfirma GmbH nimmt den Schutz Ihrer persönlichen Daten sehr ernst. Wir halten uns strikt an die Regeln der Datenschutzgesetze. Personenbezogene Daten werden auf dieser Webseite nur im technisch notwendigen Umfang erhoben. In keinem Fall werden die erhobenen Daten verkauft oder aus anderen Gründen an Dritte weitergegeben. Unsere vollständige Datenschutzerklärung können Sie [hier](#) nachlesen.\n"
         },
         "MyCustomScreen": {
-          "content": "![image](https://vc.systems/wp-content/uploads/2020/07/vcs_logo.png)\n\n<br/>Projekt: \n--------\n\nErste Schritte\n\nZusammenfassung:\n--------\nDies ist ein <em> Beispieltext</em>, der Ihnen den Einstieg erleichtern soll. **Marked** wird verwendet, um Ihren Text <u>von Markdown nach HTML</u> zu konvertieren. Um mehr über die <u><em>korrekte Syntax</em></u> zu erfahren, besuchen Sie bitte diesen [Link](https://marked.js.org/demo/) für eine Demo.  \n \nInhalt:\n-------\nLorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.\n \nDuis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.\n \nHow to add lists:\n-----------------\n\n<br/>1. Enumeration, lorem ipsum dolor sit amet.\n2. Enumeration, lorem ipsum dolor sit amet.\n\n\n- Punkt 1: einer Liste mit Aufzählungspunkten.\n- Punkt 2: einer Liste mit Aufzählungspunkten.\n\n<br/>Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis.",
+          "content": "![image](https://vc.systems/wp-content/uploads/2020/07/vcs_logo.png)\n\nProjekt: \n--------\n\nErste Schritte\n\nZusammenfassung:\n--------\nDies ist ein **Beispieltext**, der Ihnen den Einstieg erleichtern soll. **Marked** wird verwendet, um Ihren Text _von Markdown nach HTML_ zu konvertieren. Um mehr über die __*korrekte Syntax*__ zu erfahren, besuchen Sie bitte diesen [Link](https://marked.js.org/demo/) für eine Demo.  \n \nInhalt:\n-------\nLorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.\n \nDuis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.\n \nHow to add lists:\n-----------------\n\n\n\n1. Enumeration, lorem ipsum dolor sit amet.\n2. Enumeration, lorem ipsum dolor sit amet.\n\n\n- Punkt 1: einer Liste mit Aufzählungspunkten.\n- Punkt 2: einer Liste mit Aufzählungspunkten.\n\n\n\nDuis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis.",
           "name": "Meine benutzerdefinierte Anzeige",
           "title": "Meine benutzerdefinierte Anzeige"
         }
@@ -116,10 +116,10 @@
           }
         },
         "MyImpressum": {
-          "content": "![image](https://vc.systems/wp-content/uploads/2020/07/vcs_logo.png)<br>**Company name:** <br>Musterfirma GmbH<br><br>**Company headquarters:**<br>Musterstadt<br><br>**Address:**<br>Musterstraße 1 a<br>12345 Musterstadt<br>Germany<br><br> **Phone:** +49 (0) 00 . 0000 . 000 . 00<br> **Fax:** +49 (0) 00 . 0000 . 000 . 00<br> **E-Mail:** [info@musterfirma.de](mailto:info@musterfirma.de)<br><br>**Managing Director:**<br>- Max Mustermann<br><br>**Registry court:**<br>Musterstadt 1234567<br><br>**Tax number:**<br>11/222/33333<br><br>**VAT ID:**<br>DE1234567890<br><br>**Copyright:**<br>All rights reserved. All contents (texts, images, graphics, animations) are protected by copyright. They may not be copied, distributed or modified for commercial purposes without the consent of Musterfirma GmbH.<br>(Copyright 2023 Musterfirma GmbH)<br><br>**Contents:**<br>Despite careful editing, Musterfirma GmbH cannot guarantee the correctness and accuracy of the information provided on [www.musterfirma.de](http://www.musterfirma.de). Any liability for damages arising directly or indirectly from the use of [www.musterfirma.de](http://www.musterfirma.de) and which are not based on intent or gross negligence on the part of Musterfirma GmbH is excluded. No liability is accepted for the content of websites linked to [www.musterfirma.de](http://www.musterfirma.de).<br><br>**Data protection:**<br>Musterfirma GmbH takes the protection of your personal data very seriously. We adhere strictly to the rules of the data protection laws. Personal data is only collected on this website to the extent that is technically necessary. Under no circumstances will the data collected be sold or passed on to third parties for other reasons. You can read our complete privacy policy [here](#).<br>"
+          "content": "![image](https://vc.systems/wp-content/uploads/2020/07/vcs_logo.png)\n\n**Company name:** \n\nMusterfirma GmbH\n\n**Company headquarters:**\n\nMusterstadt\n\n\n\n**Address:**\n\nMusterstraße 1 a\n\n12345 Musterstadt\n\nGermany\n\n **Phone:** +49 (0) 00 . 0000 . 000 . 00\n\n **Fax:** +49 (0) 00 . 0000 . 000 . 00\n\n **E-Mail:** [info@musterfirma.de](mailto:info@musterfirma.de)\n\n\n\n**Managing Director:**\n\n- Max Mustermann\n\n\n\n**Registry court:**\n\nMusterstadt 1234567\n\n\n\n**Tax number:**\n\n11/222/33333\n\n\n\n**VAT ID:**\n\nDE1234567890\n\n\n\n**Copyright:**\n\nAll rights reserved. All contents (texts, images, graphics, animations) are protected by copyright. They may not be copied, distributed or modified for commercial purposes without the consent of Musterfirma GmbH.\n\n(Copyright 2023 Musterfirma GmbH)\n\n\n\n**Contents:**\n\nDespite careful editing, Musterfirma GmbH cannot guarantee the correctness and accuracy of the information provided on [www.musterfirma.de](http://www.musterfirma.de). Any liability for damages arising directly or indirectly from the use of [www.musterfirma.de](http://www.musterfirma.de) and which are not based on intent or gross negligence on the part of Musterfirma GmbH is excluded. No liability is accepted for the content of websites linked to [www.musterfirma.de](http://www.musterfirma.de).\n\n\n\n**Data protection:**\n\nMusterfirma GmbH takes the protection of your personal data very seriously. We adhere strictly to the rules of the data protection laws. Personal data is only collected on this website to the extent that is technically necessary. Under no circumstances will the data collected be sold or passed on to third parties for other reasons. You can read our complete privacy policy [here](#).\n\n"
         },
         "MyCustomScreen": {
-          "content": "![image](https://vc.systems/wp-content/uploads/2020/07/vcs_logo.png)\n\n<br/>Project: \n--------\n\nGetting started\n\nSummary:\n--------\nThis is a sample text to help you get started. **Marked** is used to convert your text <u>from Markdown to HTML</u>. To learn more about the <u><em>correct syntax</em></u>, please visit this [link](https://marked.js.org/demo/) for a demo.\n \nContent:\n-------\nLorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.\n \nDuis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.\n \nHow to add lists:\n-----------------\n\n<br/>1. Enumeration, lorem ipsum dolor sit amet.\n2. Enumeration, lorem ipsum dolor sit amet.\n\n\n- Bullet Point 1: Lorem ipsum dolor sit amet.\n- Bullet Point 2: Lorem ipsum dolor sit amet.\n\n<br/>Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis.",
+          "content": "![image](https://vc.systems/wp-content/uploads/2020/07/vcs_logo.png)\n\n\n\nProject: \n--------\n\nGetting started\n\nSummary:\n--------\nThis is a sample text to help you get started. **Marked** is used to convert your text _from Markdown to HTML_. To learn more about the __*correct syntax*__, please visit this [link](https://marked.js.org/demo/) for a demo.\n \nContent:\n-------\nLorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.\n \nDuis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.\n \nHow to add lists:\n-----------------\n\n\n\n1. Enumeration, lorem ipsum dolor sit amet.\n2. Enumeration, lorem ipsum dolor sit amet.\n\n\n- Bullet Point 1: Lorem ipsum dolor sit amet.\n- Bullet Point 2: Lorem ipsum dolor sit amet.\n\n\n\nDuis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis.",
           "name": "My Custom Screen",
           "title": "My Custom Screen"
         }
@@ -571,7 +571,8 @@
       "name": "tableAllWithTemplateHeader",
       "keyMapping": {
         "roofType": "codeLists.keys.roofType",
-        "function": "codeLists.keys.function"
+        "function": "codeLists.keys.function",
+        "featureId": "Feature ID"
       },
       "valueMapping": {
         "roofType": "codeLists.values.roofType.${value}",
@@ -649,7 +650,9 @@
       "name": "Oblique Map",
       "showObliqueImageName": true,
       "obliqueImageNameTemplate": "Oblique Image Name : {0}",
-      "type": "ObliqueMap"
+      "type": "ObliqueMap",
+      "maintainViewpointOnCollectionChange": true,
+      "fallbackToCurrentMap": true
     }
   ],
   "layers": [
@@ -666,7 +669,7 @@
       "activeOnStartup": false,
       "allowPicking": false,
       "properties": {
-        "title": "WFS Layer (next to Groningen)",
+        "title": "WFS Layer (next to Groningen in the Netherlands)",
         "featureInfo": "tableAll"
       }
     },
@@ -679,7 +682,8 @@
       "screenSpaceError": 16,
       "screenSpaceErrorMobile": 32,
       "tilesetOptions": {
-        "skipLevelOfDetail": true
+        "skipLevelOfDetail": true,
+        "enableCollision": true
       },
       "exclusiveGroups": ["bldg"],
       "properties": {
@@ -728,8 +732,8 @@
     {
       "name": "osmBuildingFootprints",
       "type": "VectorTileLayer",
-      "minLevel": 15,
-      "maxLevel": 21,
+      "minLevel": 18,
+      "maxLevel": 18,
       "zIndex": 11,
       "tileProvider": {
         "baseLevels": [14],
@@ -739,10 +743,12 @@
         "url": "https://www.virtualcitymap.de/datasource-data/BerlinFootprintsMVT/{z}/{x}/{y}.pbf"
       },
       "activeOnStartup": false,
+      "debug": false,
       "properties": {
         "featureInfo": "addressBalloon",
         "title": "layers.osmBuildingFootprints.title",
-        "tooltip": "OpenStreetMap Building Polygons"
+        "tooltip": "OpenStreetMap Building Polygons",
+        "availableStyles": ["Transparentbuildings"]
       }
     },
     {
@@ -938,6 +944,7 @@
       "name": "building.texturedBuildings",
       "layerName": "buildings",
       "type": "LayerContentTreeItem",
+      "tooltip": "Textured buildings",
       "onActivate": [
         {
           "type": "DeactivateLayersCallback",
@@ -1073,7 +1080,12 @@
       "name": "reasonableLayerGroup",
       "type": "LayerGroupContentTreeItem",
       "layerNames": ["buildings", "Bäume", "GermanyBaseTerrain.4"],
-      "title": "Buildings - Trees - Terrain. A Layer Group Item"
+      "title": "Buildings - Trees - Terrain. A Layer Group Item",
+      "availableStyles": [
+        "MeasuredHeightGreen",
+        "MeasuredHeightBrown",
+        "MeasuredHeightBlue"
+      ]
     },
     {
       "name": "berlin_obliques",
@@ -1110,11 +1122,7 @@
       }
     }
   ],
-  "plugins": [
-    {
-      "name": "@vcmap-show-case/theme-changer",
-      "entry": "plugins/@vcmap-show-case/theme-changer/index.js"
-    },
+  "plugins2": [
     {
       "name": "@vcmap/create-link",
       "entry": "plugins/@vcmap/create-link/index.js"

package/config/dev.config.json

@@ -92,6 +92,153 @@
     }
   ],
   "layers": [
+    {
+      "name": "testGeojsonVectorTile",
+      "type": "VectorTileLayer",
+      "minLevel": 18,
+      "maxLevel": 18,
+      "zIndex": 11,
+      "tileProvider": {
+        "baseLevels": [14],
+        "idProperty": "id",
+        "useSpatialIndex": false,
+        "type": "StaticGeoJSONTileProvider",
+        "url": "exampleData/perFeature.json"
+      },
+      "activeOnStartup": false,
+      "debug": false,
+      "renderer": "primitive",
+      "properties": {
+        "title": "Test GeoJSON VectorTile",
+        "featureInfo": "markdownFeatureInfo",
+        "legend": [
+          {
+            "type": "StyleLegendItem",
+            "rows": [
+              {
+                "type": "StrokeLegendRow",
+                "title": "Line",
+                "stroke": {
+                  "color": [0, 0, 0, 1],
+                  "width": 1.2
+                }
+              },
+              {
+                "type": "StrokeLegendRow",
+                "title": "Line blue",
+                "stroke": {
+                  "color": [118, 165, 204, 1],
+                  "width": 1.2
+                }
+              },
+              {
+                "type": "FillLegendRow",
+                "title": "Polygon no fill",
+                "fill": false,
+                "stroke": {
+                  "color": [0, 0, 0, 1],
+                  "width": 1.2
+                }
+              },
+              {
+                "type": "FillLegendRow",
+                "title": "Polygon blue",
+                "fill": {
+                  "color": [118, 165, 204, 1]
+                },
+                "stroke": {
+                  "color": [68, 68, 68, 1],
+                  "width": 2
+                }
+              },
+              {
+                "type": "FillLegendRow",
+                "title": "Polygon white",
+                "tooltip": "Extruded polygons by height or storey",
+                "fill": {
+                  "color": [255, 255, 255, 0.4]
+                },
+                "stroke": {
+                  "color": [51, 153, 204, 1],
+                  "width": 1.25
+                }
+              },
+              {
+                "type": "CircleLegendRow",
+                "title": "Point Circle",
+                "image": {
+                  "radius": 8,
+                  "scale": 4,
+                  "fill": {
+                    "color": "rgba(255, 0, 0, 1)"
+                  },
+                  "stroke": {
+                    "color": "#00FF00",
+                    "width": 2
+                  }
+                }
+              },
+              {
+                "type": "CircleLegendRow",
+                "title": "Point Default",
+                "image": {
+                  "radius": 5,
+                  "scale": 1,
+                  "fill": {
+                    "color": [255, 255, 255, 0.4]
+                  },
+                  "stroke": {
+                    "color": [0, 0, 0, 1],
+                    "width": 1
+                  }
+                }
+              },
+              {
+                "type": "IconLegendRow",
+                "title": "Icon",
+                "tooltip": "An exemplary icon",
+                "image": {
+                  "src": "data:image/png;base64,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",
+                  "scale": 0.2
+                }
+              },
+              {
+                "type": "RegularShapeLegendRow",
+                "title": "Rhombus Shape",
+                "image": {
+                  "radius": 8,
+                  "points": 4,
+                  "angle": 1.5707963267948966,
+                  "scale": 4,
+                  "fill": {
+                    "color": [255, 0, 255, 0.8]
+                  },
+                  "stroke": {
+                    "color": "#000000",
+                    "width": 2
+                  }
+                }
+              },
+              {
+                "type": "TextLegendRow",
+                "title": "Text",
+                "text": {
+                  "font": "italic bold 32px Courier New, monospace",
+                  "fill": {
+                    "color": "#73D9D1"
+                  },
+                  "stroke": {
+                    "color": "#000000",
+                    "width": 2
+                  }
+                },
+                "label": "Test!"
+              }
+            ]
+          }
+        ]
+      }
+    },
     {
       "name": "testGeojson",
       "type": "GeoJSONLayer",
@@ -511,18 +658,26 @@
     {
       "name": "flight",
       "flightName": "FlightExampleBerlin",
-      "type": "FlightContentTreeItem"
+      "type": "FlightContentTreeItem",
+      "title": "this flight has a very long name. You can find the rest in the tooltip",
+      "icon": "mdi-airplane"
     },
     {
       "name": "flight2",
       "flightName": "FlightExampleBerlin2",
-      "type": "FlightContentTreeItem"
+      "type": "FlightContentTreeItem",
+      "tooltip": "This is a flight. Its flight 2, actually."
     },
     {
       "name": "geojson",
       "layerName": "testGeojson",
       "type": "LayerContentTreeItem"
     },
+    {
+      "name": "geojson vector tile",
+      "layerName": "testGeojsonVectorTile",
+      "type": "LayerContentTreeItem"
+    },
     {
       "name": "czmlPoint",
       "layerName": "czmlPoint",
@@ -547,6 +702,7 @@
       "name": "building.myTest",
       "type": "ContentTreeItem",
       "title": "test SwitchMapCallback Test",
+      "icon": "mdi-toggle-switch",
       "onClick": [
         {
           "type": "ActivateLayersCallback",
@@ -642,14 +798,6 @@
       "name": "vector-properties-example",
       "entry": "plugins/@vcmap-show-case/vector-properties-example/index.js"
     },
-    {
-      "name": "@vcmap/print",
-      "entry": "plugins/@vcmap/print/index.js"
-    },
-    {
-      "name": "@vcmap/search-nominatim",
-      "entry": "plugins/@vcmap/search-nominatim/index.js"
-    },
     {
       "name": "switch-map-callback-example",
       "entry": "plugins/@vcmap-show-case/switch-map-callback-example/index.js"
@@ -662,6 +810,22 @@
       "name": "@vcmap-show-case/hello-world",
       "entry": "plugins/@vcmap-show-case/hello-world/index.js",
       "showComponent": false
+    },
+    {
+      "name": "@vcmap-show-case/search-example",
+      "entry": "plugins/@vcmap-show-case/search-example/index.js"
+    },
+    {
+      "name": "@vcmap-show-case/custom-icons-example",
+      "entry": "plugins/@vcmap-show-case/custom-icons-example/index.js"
+    },
+    {
+      "name": "@vcmap/print",
+      "entry": "plugins/@vcmap/print/index.js"
+    },
+    {
+      "name": "@vcmap/search-nominatim",
+      "entry": "plugins/@vcmap/search-nominatim/index.js"
     }
   ],
   "uiConfig": [

package/config/projects.config.json

@@ -22,7 +22,9 @@
       "modules": [
         "config/dev.config.json",
         "config/codes.config.json",
-        "config/graphFeatureInfo.config.json"
+        "config/graphFeatureInfo.config.json",
+        "config/splashscreen.config.json",
+        "config/theming.config.json"
       ]
     }
   ]

package/config/solar.config.json

@@ -0,0 +1,65 @@
+{
+  "name": "Solar",
+  "i18n": [
+    {
+      "name": "Demo",
+      "de": {
+        "solarLayer": {
+          "solar": "Vorberechnete Solardaten"
+        }
+      },
+      "en": {
+        "solarLayer": {
+          "solar": "Precalculated solardata"
+        }
+      }
+    }
+  ],
+  "layers": [
+    {
+      "type": "CesiumTilesetLayer",
+      "name": "Solar Buildings Berlin",
+      "activeOnStartup": true,
+      "url": "https://www.virtualcitymap.de/datasource-data/32bae501-7f69-4d3f-b807-f606009fdd0a/tileset.json",
+      "extent": {
+        "coordinates": [
+          13.331909136005015, 52.48718257333008, 13.42529294872331,
+          52.54760738995393
+        ],
+        "projection": {
+          "type": "Projection",
+          "epsg": "EPSG:4326"
+        },
+        "type": "Extent"
+      },
+      "exclusiveGroups": ["3D"],
+      "properties": {
+        "title": "solarLayer.solar",
+        "properties": "tableAll"
+      },
+      "tilesetOptions": {
+        "useSRGBColorFactors": true
+      },
+      "zIndex": 0
+    }
+  ],
+  "plugins": [
+    {
+      "name": "@vcmap/solar-revenue",
+      "entry": "plugins/@vcmap/solar-revenue/index.js",
+      "adminOptions": {
+        "germanPowerMix": 0.5
+      },
+      "globalSettings": {
+        "isVcSolar": true
+      }
+    }
+  ],
+  "contentTree": [
+    {
+      "type": "LayerContentTreeItem",
+      "name": "berlin.solar",
+      "layerName": "Solar Buildings Berlin"
+    }
+  ]
+}

package/config/splashscreen.config.json

@@ -0,0 +1,45 @@
+{
+  "name": "SplashScreen Examples",
+  "uiConfig": [
+    {
+      "name": "splashScreen",
+      "value": {
+        "name": "MyCustomScreen.name",
+        "title": "MyCustomScreen.tooltip",
+        "icon": "mdi-information-slab-circle-outline",
+        "content": "![image](https://vc.systems/wp-content/uploads/2020/07/vcs_logo.png)\nSplash Screen Template\n-------------------\nErste Schritte\n-------------------\n\nDies ist ein <em> Beispieltext</em>, der Ihnen den Einstieg erleichtern soll. **Marked** wird verwendet, um Ihren Text <u>von Markdown nach HTML</u> zu konvertieren. Um mehr über die <u><em>korrekte Syntax</em></u>zu erfahren, besuchen Sie bitte diesen [Link](https://marked.js.org/demo/) für eine Demo.  \n\nWie man Listen hinzufügt\n\n1. Punkt 1 einer Aufzählung\n2. Punkt 2 einer Aufzählung.\n\nWenn Sie Aufzählungen nicht mögen, wie wäre es mit Aufzählungspunkten?  \n- Punkt 1: einer Liste mit Aufzählungspunkten. \n- Punkt 2: einer Aufzählungsliste.",
+        "acceptInput": true,
+        "menuEntry": false,
+        "checkBoxText": "components.splashScreen.checkBoxText",
+        "buttonTitle": "components.splashScreen.buttonTitle",
+        "position": {
+          "width": "800px",
+          "height": "500px",
+          "maxWidth": "800px",
+          "maxHeight": "500px"
+        }
+      },
+      "properties": {
+        "title": "appConfigurator.editors.uiConfig.splashScreen"
+      }
+    },
+    {
+      "name": "customScreen",
+      "value": {
+        "content": "![image](https://vc.systems/wp-content/uploads/2020/07/vcs_logo.png)\n\n<br/>Projekt: \n--------\n\nErste Schritte\n\nZusammenfassung:\n--------\nDies ist ein <em> Beispieltext</em>, der Ihnen den Einstieg erleichtern soll. **Marked** wird verwendet, um Ihren Text <u>von Markdown nach HTML</u> zu konvertieren. Um mehr über die <u><em>korrekte Syntax</em></u>zu erfahren, besuchen Sie bitte diesen [Link](https://marked.js.org/demo/) für eine Demo.  \n \nInhalt:\n-------\nLorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.\n \nDuis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.\n \nHow to add lists:\n-----------------\n\n<br/>1. Enumeration, lorem ipsum dolor sit amet.\n2. Enumeration, lorem ipsum dolor sit amet.\n\n\n- Punkt 1: einer Liste mit Aufzählungspunkten.\n- Punkt 2: einer Liste mit Aufzählungspunkten.\n\n<br/>Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis.",
+        "icon": "mdi-information",
+        "name": "MyCustomScreen.name",
+        "title": "MyCustomScreen.tooltip",
+        "windowPosition": {
+          "left": "30%",
+          "right": "30%",
+          "top": "10%",
+          "bottom": "20%"
+        }
+      },
+      "properties": {
+        "title": "appConfigurator.editors.uiConfig.customScreen"
+      }
+    }
+  ]
+}

package/config/theming.config.json

@@ -0,0 +1,68 @@
+{
+  "name": "Theming Examples",
+  "plugins": [
+    {
+      "name": "@vcmap-show-case/theming-example",
+      "entry": "plugins/@vcmap-show-case/theming-example/index.js"
+    }
+  ],
+  "uiConfig": [
+    {
+      "name": "vuetifyTheme",
+      "value": {
+        "light": {
+          "colors": {
+            "base": "#9E9E9E",
+            "base-lighten-5": "#FFFFFF",
+            "base-lighten-4": "#F8F8F8",
+            "base-lighten-3": "#EBEBEB",
+            "base-lighten-2": "#D0D0D0",
+            "base-lighten-1": "#B8B8B8",
+            "base-darken-1": "#858585",
+            "base-darken-2": "#6B6B6B",
+            "base-darken-3": "#525252",
+            "base-darken-4": "#383838",
+            "warning": "#FFCE00",
+            "error": "#AA0000",
+            "info": "#2196F3",
+            "success": "#4CAF50",
+            "surface-light": "#ffffff"
+          },
+          "variables": {
+            "hover-opacity": 0.16,
+            "high-emphasis-opacity": 1,
+            "medium-emphasis-opacity": 1,
+            "vcs-font-size": "14px",
+            "vcs-font-family": "Times New Roman"
+          }
+        },
+        "dark": {
+          "colors": {
+            "base": "#9E9E9E",
+            "base-lighten-5": "#FFFFFF",
+            "base-lighten-4": "#383838",
+            "base-lighten-3": "#525252",
+            "base-lighten-2": "#6B6B6B",
+            "base-lighten-1": "#858585",
+            "base-darken-1": "#B8B8B8",
+            "base-darken-2": "#D0D0D0",
+            "base-darken-3": "#EBEBEB",
+            "base-darken-4": "#F8F8F8",
+            "warning": "#FFCE00",
+            "error": "#FF5252",
+            "info": "#2196F3",
+            "success": "#4CAF50",
+            "surface-light": "#222222"
+          },
+          "variables": {
+            "hover-opacity": 0.16,
+            "high-emphasis-opacity": 1,
+            "medium-emphasis-opacity": 1,
+            "vcs-font-size": "14px",
+            "vcs-font-family": "Times New Roman"
+          }
+        }
+      }
+    }
+  ]
+}