update: demo

zuramai · Jun 28, 2024 · dc21d5b · dc21d5b
1 parent 087b680
commit dc21d5b
Show file tree

Hide file tree

Showing 67 changed files with 1,224 additions and 0 deletions.
diff --git a/demo/account-profile.html b/demo/account-profile.html
@@ -528,6 +528,11 @@
 
                     </li>
 
+                    <li class="submenu-item  ">
+                        <a href="ui-map-openlayers.html" class="submenu-link">OpenLayers Map</a>
+
+                    </li>
+
                 </ul>
 
 

diff --git a/demo/account-security.html b/demo/account-security.html
@@ -528,6 +528,11 @@
 
                     </li>
 
+                    <li class="submenu-item  ">
+                        <a href="ui-map-openlayers.html" class="submenu-link">OpenLayers Map</a>
+
+                    </li>
+
                 </ul>
 
 

diff --git a/demo/application-chat.html b/demo/application-chat.html
@@ -528,6 +528,11 @@
 
                     </li>
 
+                    <li class="submenu-item  ">
+                        <a href="ui-map-openlayers.html" class="submenu-link">OpenLayers Map</a>
+
+                    </li>
+
                 </ul>
 
 

diff --git a/demo/application-checkout.html b/demo/application-checkout.html
@@ -528,6 +528,11 @@
 
                     </li>
 
+                    <li class="submenu-item  ">
+                        <a href="ui-map-openlayers.html" class="submenu-link">OpenLayers Map</a>
+
+                    </li>
+
                 </ul>
 
 

diff --git a/demo/application-email.html b/demo/application-email.html
@@ -530,6 +530,11 @@
 
                     </li>
 
+                    <li class="submenu-item  ">
+                        <a href="ui-map-openlayers.html" class="submenu-link">OpenLayers Map</a>
+
+                    </li>
+
                 </ul>
 
 

diff --git a/demo/application-gallery.html b/demo/application-gallery.html
@@ -528,6 +528,11 @@
 
                     </li>
 
+                    <li class="submenu-item  ">
+                        <a href="ui-map-openlayers.html" class="submenu-link">OpenLayers Map</a>
+
+                    </li>
+
                 </ul>
 
 

diff --git a/demo/assets/static/js/pages/ui-map-openlayers.js b/demo/assets/static/js/pages/ui-map-openlayers.js
@@ -0,0 +1,76 @@
+// init map
+var map = new ol.Map({
+	target: 'map',
+	layers: [
+		new ol.layer.Tile({
+			source: new ol.source.OSM()
+		})
+	],
+	view: new ol.View({
+		center: ol.proj.fromLonLat([110.3803253, -7.7945047]),
+		zoom: 12
+	})
+});
+
+// add vector layer
+var vectorLayer = new ol.layer.Vector({
+	source: new ol.source.Vector({
+		features: [
+			new ol.Feature({
+				geometry: new ol.geom.Point(ol.proj.fromLonLat([110.3647631, -7.8013849])),
+				name: 'Yogyakarta, Indonesia'
+			})
+		]
+	})
+});
+
+// set style for vector layer
+vectorLayer.setStyle(new ol.style.Style({
+	image: new ol.style.Icon({
+		anchor: [0.5, 46],
+    anchorXUnits: 'fraction',
+    anchorYUnits: 'pixels',
+		src: 'https://openlayers.org/en/latest/examples/data/icon.png'
+	})
+}));
+
+map.addLayer(vectorLayer);
+
+// popup
+const element = document.getElementById('popup');
+
+const popup = new ol.Overlay({
+  element: element,
+  positioning: 'bottom-center',
+  stopEvent: false,
+});
+map.addOverlay(popup);
+
+let popover;
+function disposePopover() {
+  if (popover) {
+    popover.dispose();
+    popover = undefined;
+  }
+}
+
+// display popup on click
+map.on('click', function (evt) {
+  const feature = map.forEachFeatureAtPixel(evt.pixel, function (feature) {
+    return feature;
+  });
+  disposePopover();
+  if (!feature) {
+    return;
+  }
+  popup.setPosition(evt.coordinate);
+  popover = new bootstrap.Popover(element, {
+    placement: 'top',
+    html: true,
+    content: feature.get('name'),
+  });
+  popover.show();
+});
+
+// scale line
+map.addControl(new ol.control.ScaleLine());
diff --git a/demo/component-accordion.html b/demo/component-accordion.html
@@ -528,6 +528,11 @@
 
                     </li>
 
+                    <li class="submenu-item  ">
+                        <a href="ui-map-openlayers.html" class="submenu-link">OpenLayers Map</a>
+
+                    </li>
+
                 </ul>
 
 

diff --git a/demo/component-alert.html b/demo/component-alert.html
@@ -528,6 +528,11 @@
 
                     </li>
 
+                    <li class="submenu-item  ">
+                        <a href="ui-map-openlayers.html" class="submenu-link">OpenLayers Map</a>
+
+                    </li>
+
                 </ul>
 
 

diff --git a/demo/component-badge.html b/demo/component-badge.html
@@ -528,6 +528,11 @@
 
                     </li>
 
+                    <li class="submenu-item  ">
+                        <a href="ui-map-openlayers.html" class="submenu-link">OpenLayers Map</a>
+
+                    </li>
+
                 </ul>
 
 

diff --git a/demo/component-breadcrumb.html b/demo/component-breadcrumb.html
@@ -528,6 +528,11 @@
 
                     </li>
 
+                    <li class="submenu-item  ">
+                        <a href="ui-map-openlayers.html" class="submenu-link">OpenLayers Map</a>
+
+                    </li>
+
                 </ul>
 
 

diff --git a/demo/component-button.html b/demo/component-button.html
@@ -528,6 +528,11 @@
 
                     </li>
 
+                    <li class="submenu-item  ">
+                        <a href="ui-map-openlayers.html" class="submenu-link">OpenLayers Map</a>
+
+                    </li>
+
                 </ul>
 
 

diff --git a/demo/component-card.html b/demo/component-card.html
@@ -528,6 +528,11 @@
 
                     </li>
 
+                    <li class="submenu-item  ">
+                        <a href="ui-map-openlayers.html" class="submenu-link">OpenLayers Map</a>
+
+                    </li>
+
                 </ul>
 
 

diff --git a/demo/component-carousel.html b/demo/component-carousel.html
@@ -528,6 +528,11 @@
 
                     </li>
 
+                    <li class="submenu-item  ">
+                        <a href="ui-map-openlayers.html" class="submenu-link">OpenLayers Map</a>
+
+                    </li>
+
                 </ul>
 
 

diff --git a/demo/component-collapse.html b/demo/component-collapse.html
@@ -528,6 +528,11 @@
 
                     </li>
 
+                    <li class="submenu-item  ">
+                        <a href="ui-map-openlayers.html" class="submenu-link">OpenLayers Map</a>
+
+                    </li>
+
                 </ul>
 
 

diff --git a/demo/component-dropdown.html b/demo/component-dropdown.html
@@ -528,6 +528,11 @@
 
                     </li>
 
+                    <li class="submenu-item  ">
+                        <a href="ui-map-openlayers.html" class="submenu-link">OpenLayers Map</a>
+
+                    </li>
+
                 </ul>
 
 

diff --git a/demo/component-list-group.html b/demo/component-list-group.html
@@ -528,6 +528,11 @@
 
                     </li>
 
+                    <li class="submenu-item  ">
+                        <a href="ui-map-openlayers.html" class="submenu-link">OpenLayers Map</a>
+
+                    </li>
+
                 </ul>
 
 

diff --git a/demo/component-modal.html b/demo/component-modal.html
@@ -528,6 +528,11 @@
 
                     </li>
 
+                    <li class="submenu-item  ">
+                        <a href="ui-map-openlayers.html" class="submenu-link">OpenLayers Map</a>
+
+                    </li>
+
                 </ul>
 
 

diff --git a/demo/component-navs.html b/demo/component-navs.html
@@ -528,6 +528,11 @@
 
                     </li>
 
+                    <li class="submenu-item  ">
+                        <a href="ui-map-openlayers.html" class="submenu-link">OpenLayers Map</a>
+
+                    </li>
+
                 </ul>
 
 

diff --git a/demo/component-pagination.html b/demo/component-pagination.html
@@ -528,6 +528,11 @@
 
                     </li>
 
+                    <li class="submenu-item  ">
+                        <a href="ui-map-openlayers.html" class="submenu-link">OpenLayers Map</a>
+
+                    </li>
+
                 </ul>
 
 

diff --git a/demo/component-placeholder.html b/demo/component-placeholder.html
@@ -528,6 +528,11 @@
 
                     </li>
 
+                    <li class="submenu-item  ">
+                        <a href="ui-map-openlayers.html" class="submenu-link">OpenLayers Map</a>
+
+                    </li>
+
                 </ul>
 
 

diff --git a/demo/component-progress.html b/demo/component-progress.html
@@ -528,6 +528,11 @@
 
                     </li>
 
+                    <li class="submenu-item  ">
+                        <a href="ui-map-openlayers.html" class="submenu-link">OpenLayers Map</a>
+
+                    </li>
+
                 </ul>
 
 

diff --git a/demo/component-spinner.html b/demo/component-spinner.html
@@ -528,6 +528,11 @@
 
                     </li>
 
+                    <li class="submenu-item  ">
+                        <a href="ui-map-openlayers.html" class="submenu-link">OpenLayers Map</a>
+
+                    </li>
+
                 </ul>
 
 

diff --git a/demo/component-toasts.html b/demo/component-toasts.html
@@ -528,6 +528,11 @@
 
                     </li>
 
+                    <li class="submenu-item  ">
+                        <a href="ui-map-openlayers.html" class="submenu-link">OpenLayers Map</a>
+
+                    </li>
+
                 </ul>
 
 

diff --git a/demo/component-tooltip.html b/demo/component-tooltip.html
@@ -528,6 +528,11 @@
 
                     </li>
 
+                    <li class="submenu-item  ">
+                        <a href="ui-map-openlayers.html" class="submenu-link">OpenLayers Map</a>
+
+                    </li>
+
                 </ul>
 
 

diff --git a/demo/extra-component-avatar.html b/demo/extra-component-avatar.html
@@ -528,6 +528,11 @@
 
                     </li>
 
+                    <li class="submenu-item  ">
+                        <a href="ui-map-openlayers.html" class="submenu-link">OpenLayers Map</a>
+
+                    </li>
+
                 </ul>
 
 

diff --git a/demo/extra-component-comment.html b/demo/extra-component-comment.html
@@ -528,6 +528,11 @@
 
                     </li>
 
+                    <li class="submenu-item  ">
+                        <a href="ui-map-openlayers.html" class="submenu-link">OpenLayers Map</a>
+
+                    </li>
+
                 </ul>
-Original file line number
+Diff line change
@@ Expand Up / @@ -528,6 +528,11 @@ @@
                         </li>
+                        <li class="submenu-item  ">
+                            <a href="ui-map-openlayers.html" class="submenu-link">OpenLayers Map</a>
+                        </li>
                     </ul>
@@ Expand Down @@