world map

This commit is contained in:
Benjamin Takats
2022-12-15 22:52:06 +01:00
parent 683fcc1543
commit 133d2b2df8
5 changed files with 50 additions and 1 deletions

View File

@@ -15,6 +15,7 @@
media="screen"/>
<script src="https://unpkg.com/jquery"></script>
<script src="{{ asset('vendor/jvector/jquery-jvectormap-2.0.5.min.js') }}"></script>
<script src="{{ asset('vendor/jvector/maps/world-mill.js') }}"></script>
<script src="{{ asset('vendor/jvector/maps/europe-merc.js') }}"></script>
<script src="{{ asset('vendor/jvector/maps/de.js') }}"></script>
<script src="{{ asset('vendor/jvector/maps/at.js') }}"></script>

View File

@@ -15,6 +15,7 @@
media="screen"/>
<script src="https://unpkg.com/jquery"></script>
<script src="{{ asset('vendor/jvector/jquery-jvectormap-2.0.5.min.js') }}"></script>
<script src="{{ asset('vendor/jvector/maps/world-mill.js') }}"></script>
<script src="{{ asset('vendor/jvector/maps/europe-merc.js') }}"></script>
<script src="{{ asset('vendor/jvector/maps/de.js') }}"></script>
<script src="{{ asset('vendor/jvector/maps/at.js') }}"></script>

View File

@@ -18,7 +18,6 @@
x-data="{
init() {
let markers = {{ Js::from($markers) }};
console.log(markers);
$('#map').vectorMap({
zoomButtons : false,
@@ -52,6 +51,43 @@
</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
wire:ignore
class="w-full flex justify-center"
x-data="{
init() {
let markers = {{ Js::from($allMarkers) }};
$('#mapworld').vectorMap({
zoomButtons : false,
zoomOnScroll: true,
map: 'world_mill',
backgroundColor: 'transparent',
markers: markers.map(function(h){ return {name: h.name, latLng: h.coords} }),
{{-- onMarkerClick: function(event, index) {--}}
{{-- $wire.call('filterByMarker', markers[index].id)--}}
{{-- },--}}
markerStyle: {
initial: {
image: '{{ asset('img/btc.png') }}',
}
},
regionStyle: {
initial: {
fill: '#151515'
},
hover: {
'fill-opacity': 1,
cursor: 'default'
},
}
});
}
}"
>
<div id="mapworld" style="width: 100%; height: 400px"></div>
</div>
</div>
</section>
{{-- FOOTER --}}