Как узнать текущее местоположение пользователя? - PullRequest
Новая
       9

Как узнать текущее местоположение пользователя?

0 голосов
/ 28 января 2019

Я настраиваю карту, на которой расположение магазинов будет ближе к текущему местоположению пользователя.Но я не могу этого сделать.Я просмотрел документацию, но не смог найти ничего полезного в отношении моей проблемы.Что я хочу Если я нажму на найти местоположение, то оно должно показать мне магазины ближе ко мне.

Я уже пытался установить статическую долготу и широту, и она работает нормально.Я хочу, чтобы он был динамическим. 

mapboxgl.accessToken = 'pk.eyJ1Ijoic3VzaGlsa29rYXRlIiwiYSI6ImNqcmVxeDVqeDA0c2c0NHNjcGM0Yzg4YmwifQ.NKebcVLWrkSssYyLp26Lnw';

// This adds the map to your page

var map = new mapboxgl.Map({
// container id specified in the HTML
  container: 'map',

   // style URL
  style: 'mapbox://styles/mapbox/light-v10',

 // initial position in [lon, lat] format
  center: [78.3430302, 17.449968],

 // initial zoom

 zoom: 14
});

В центре я хочу динамические значения долготы и широты (текущее местоположение).Так что он покажет мне магазины ближе к моему местоположению.

Ответы [ 2 ]

0 голосов
/ 29 января 2019

Другие решения хороши, но самый простой способ - использовать плагин Mapbox GeolocateControl.Вот полный пример: https://docs.mapbox.com/mapbox-gl-js/example/locate-user/

После начальной настройки это так же просто, как: 

map.addControl(new mapboxgl.GeolocateControl({
  positionOptions: {
    enableHighAccuracy: true
  },
    trackUserLocation: true
}));
0 голосов
/ 28 января 2019

Javascript имеет API геолокации, который вы можете использовать без импорта дополнительных зависимостей, который предоставит вам местоположение пользователя с точки зрения широты и долготы, вы можете проверить дополнительную информацию здесь .

Пользователь должен будет дать разрешения веб-приложению для доступа к своему местоположению.Краткий пример того, как вы можете получить координаты в вашем коде: 

if ("geolocation" in navigator) { 
    navigator.geolocation.getCurrentPosition(position => { 
        console.log(position.coords.latitude, position.coords.longitude); 
    }); 
} else { /* geolocation IS NOT available, handle it */ }

ОБНОВЛЕНИЕ: включение кода геолокации в ваш код будет выглядеть примерно так (проверьте, идет ли он как широта, долгота или наоборот): 

mapboxgl.accessToken = 'pk.eyJ1Ijoic3VzaGlsa29rYXRlIiwiYSI6ImNqcmVxeDVqeDA0c2c0NHNjcGM0Yzg4YmwifQ.NKebcVLWrkSssYyLp26Lnw';

// This adds the map to your page

if ("geolocation" in navigator) { 
    navigator.geolocation.getCurrentPosition(position => { 
        var map = new mapboxgl.Map({
        // container id specified in the HTML
          container: 'map',

           // style URL
          style: 'mapbox://styles/mapbox/light-v10',

         // initial position in [lon, lat] format
          center: [position.coords.longitude, position.coords.latitude],

         // initial zoom

         zoom: 14
        });
    }); 
} else { /* geolocation IS NOT available, handle it */ }
...