add maps

resources/views/livewire/meetup/meetup-table.blade.php

@@ -3,6 +3,33 @@
     <livewire:frontend.header :country="$country"/>
     {{-- MAIN --}}
     <section class="w-full mb-12">
+        <div
+            class="w-full flex justify-center"
+            x-data="{
+                    init() {
+                        let markers = [{name: 'VAK', coords: [50.0091294, 9.0371812], status: 'closed', offsets: [0, 2]}];
+
+                        $('#map').vectorMap({
+                            zoomButtons : false,
+                            zoomOnScroll: false,
+                            map: '{{ $country->code }}_merc',
+                            backgroundColor: 'transparent',
+                            // markers: markers.map(function(h){ return {name: h.name, latLng: h.coords} }),
+                            regionStyle: {
+                                initial: {
+                                    fill: '#151515'
+                                },
+                                hover: {
+                                    'fill-opacity': 1,
+                                    cursor: 'default'
+                                },
+                            }
+                        });
+                    }
+                }"
+        >
+            <div id="map" style="width: 600px; height: 400px"></div>
+        </div>
         <div class="max-w-screen-2xl mx-auto px-2 sm:px-10 space-y-4" id="table">
             <livewire:tables.meetup-table :country="$country->code"/>
         </div>