map fix
This commit is contained in:
parent
b4df394e29
commit
e629d598d4
|
@ -1,4 +1,4 @@
|
||||||
<script>
|
<script lang="ts">
|
||||||
import GeolocateControl from '@beyonk/svelte-mapbox/src/lib/map/controls/GeolocateControl.svelte'
|
import GeolocateControl from '@beyonk/svelte-mapbox/src/lib/map/controls/GeolocateControl.svelte'
|
||||||
import Map from './Map.svelte'
|
import Map from './Map.svelte'
|
||||||
import { navigate } from 'svelte-routing'
|
import { navigate } from 'svelte-routing'
|
||||||
|
@ -11,6 +11,8 @@
|
||||||
export let mapComponent = null
|
export let mapComponent = null
|
||||||
export let user = { lat: null, lng: null }
|
export let user = { lat: null, lng: null }
|
||||||
|
|
||||||
|
$: console.log(user)
|
||||||
|
|
||||||
let className = ''
|
let className = ''
|
||||||
export { className as class }
|
export { className as class }
|
||||||
/*;(() => {
|
/*;(() => {
|
||||||
|
@ -20,7 +22,7 @@
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
})()*/
|
})()*/
|
||||||
navigator.geolocation.getCurrentPosition((e) => {})
|
navigator.geolocation.getCurrentPosition((e) => {}) //at mapbox this is required dont know why
|
||||||
|
|
||||||
/* if (navigator.geolocation) {
|
/* if (navigator.geolocation) {
|
||||||
navigator.geolocation.watchPosition(showPosition, () => dispatch('locationFailed'))
|
navigator.geolocation.watchPosition(showPosition, () => dispatch('locationFailed'))
|
||||||
|
@ -34,16 +36,20 @@
|
||||||
}*/
|
}*/
|
||||||
|
|
||||||
const userCenter = () => {
|
const userCenter = () => {
|
||||||
|
// @ts-ignore
|
||||||
document.getElementsByClassName('mapboxgl-ctrl-geolocate')[0].click()
|
document.getElementsByClassName('mapboxgl-ctrl-geolocate')[0].click()
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<NavigationBarLayout>
|
<NavigationBarLayout>
|
||||||
{#if center}
|
{#if center}
|
||||||
<Map on:ready={() => setTimeout(() => setInterval(() => userCenter(), 1000), 100)} {center} bind:mapComponent class={className} on:move>
|
<Map on:ready={() => setTimeout(() => userCenter(), 100)} {center} bind:mapComponent class={className} on:move>
|
||||||
<slot />
|
<slot />
|
||||||
<GeolocateControl
|
<GeolocateControl
|
||||||
|
options={{ trackUserLocation: true }}
|
||||||
|
on:trackuserlocationstart={() => {}}
|
||||||
on:geolocate={(e) => {
|
on:geolocate={(e) => {
|
||||||
|
// @ts-ignore
|
||||||
const { latitude, longitude } = e.detail.coords
|
const { latitude, longitude } = e.detail.coords
|
||||||
user = { lat: latitude, lng: longitude }
|
user = { lat: latitude, lng: longitude }
|
||||||
}}
|
}}
|
||||||
|
|
|
@ -10,7 +10,6 @@
|
||||||
|
|
||||||
export let radius = false
|
export let radius = false
|
||||||
export let center: { lng: number; lat: number } = { lng: 0, lat: 0 }
|
export let center: { lng: number; lat: number } = { lng: 0, lat: 0 }
|
||||||
$: console.log(center)
|
|
||||||
|
|
||||||
/*export const geo = (e) => {
|
/*export const geo = (e) => {
|
||||||
geolocateControl.dispatchEvent('geolocate')
|
geolocateControl.dispatchEvent('geolocate')
|
||||||
|
@ -37,6 +36,7 @@
|
||||||
mapComponent.setCenter([center.lng, center.lat], 14)
|
mapComponent.setCenter([center.lng, center.lat], 14)
|
||||||
dispatch('ready')
|
dispatch('ready')
|
||||||
}}
|
}}
|
||||||
|
on:recentre={(e) => {}}
|
||||||
zoom={14}
|
zoom={14}
|
||||||
>
|
>
|
||||||
<slot />
|
<slot />
|
||||||
|
|
Loading…
Reference in New Issue