- inizio di modifiche all'editor di Pagine Web

src/components/CMapUsers/CMapUsers.vue

@@ -1,44 +1,35 @@
 <template>
-  <div>
-    <div v-if="arrprovince" id="map" :style="`height:${myheight()}px; width:99%`">
-    </div>
-
-    <!--
-    <div :style="`height:${myheight()}px; width:99%`">
-      <l-map
-        v-model="zoom"
-        v-model:zoom="zoom"
-        :center="[42.71, 12.934]"
-        @move="log('move')"
-        @click="getCoordinates"
-      >
-        <l-tile-layer
-          url="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png"
-        ></l-tile-layer>
-        <l-control-layers />
-        <span v-for="provincia in arrprovince" :key="provincia.nome">
-          <l-marker-cluster :options="clusterOptions">
-            <l-marker
-              v-if="provincia.userCount > 0"
-              :lat-lng="[provincia.lat, provincia.long]"
-            >
-              <l-popup
-                >{{ provincia.descr }}:
-                {{ provincia.userCount }} utenti</l-popup
-              >
-            </l-marker>
-          </l-marker-cluster>
-        </span>
-
-      </l-map>
-      <button @click="changeIcon">New kitten icon</button>
-    </div>
-    -->
+  <div class="map-container">
+    <div id="map" style="height: 500px;"></div>
   </div>
 </template>
-<script lang="ts" src="./CMapUsers.ts">
+
+<script lang="ts">
+import { defineComponent, onMounted } from 'vue'
+import { tools } from '@tools'
+import { useGlobalStore } from 'app/src/store'
+
+export default defineComponent({
+  name: 'CMapUsers',
+  setup() {
+    const globalStore = useGlobalStore()
+
+    onMounted(() => {
+      // Initialize map logic here
+      /*tools.initUserMap('map', {
+        center: { lat: 45.4642, lng: 9.1900 }, // Default to Milan coordinates
+        zoom: 6
+      })*/
+    })
+
+    return { tools, globalStore }
+  }
+})
 </script>
 
-<style lang="scss" scoped>
-@import './CMapUsers.scss';
+<style scoped>
+.map-container {
+  width: 100%;
+  height: 100%;
+}
 </style>