# GeolocateControl

扩展事件

一个GeolocateControl控件提供了使用浏览器的地理位置API,以在地图上定位用户的按钮。使用Map#addControl将此控件添加到地图。

并非所有浏览器都支持地理定位,一些用户可能会禁用该功能。对包括 Chrome 在内的现代浏览器的地理定位支持要求站点通过 HTTPS 提供服务。如果地理定位支持不可用,则 GeolocateControl 将显示为禁用。

应用的缩放级别将取决于设备提供的地理位置的准确性。

GeolocateControl 有两种模式。如果trackUserLocationfalse(默认),则控件充当按钮,按下按钮时会将地图的相机设置为定位用户位置。如果用户移动,地图将不会更新。这最适合桌面。如果trackUserLocationtrue,控制作为一个拨动按钮活性当用户的位置被主动监视更改。在这种模式下 GeolocateControl 具有三种交互状态:

  • active - 随着用户位置的变化,地图的相机会自动更新,将位置点保持在中心。初始状态和单击GeolocateControl按钮时。
  • 被动 - 用户的位置点会自动更新,但地图的相机不会。在用户启动地图移动时发生。
  • 禁用 - 如果地理位置不可用、禁用或被拒绝,则会发生。

这些交互状态不能以编程方式控制,而是根据用户交互设置。

# Parameters

  • options Object?
    • options.positionOptions **Object**地理定位 API PositionOptions目的。(可选,默认{enableHighAccuracy:false,timeout:6000}
    • options.fitBoundsOptions **Object**一个Map#fitBounds选项对象,当地图被平移和缩放到用户的位置时使用。默认值是使用maxZoom15 来限制地图为非常准确的位置放大的距离。(可选,默认{maxZoom:15}
    • options.trackUserLocation **Object**如果trueGeolocate Control 变成一个切换按钮,并且当它处于活动状态时,地图将随着用户位置的变化接收更新。(可选,默认false
    • options.showAccuracyCircle **Object**默认情况下,如果 showUserLocation 为true,则会在用户位置周围绘制一个透明圆圈,指示用户位置的准确性(95% 置信度)。设置false为禁用。当 showUserLocation 为 时始终禁用false。(可选,默认true
    • options.showUserLocation **Object**默认情况下,用户所在位置的地图上将显示一个点。设置false为禁用。(可选,默认true

# Examples

map.addControl(new vjmap.GeolocateControl({
    positionOptions: {
        enableHighAccuracy: true
    },
    trackUserLocation: true
}));
1
2
3
4
5
6

# trigger

以编程方式请求地图并将其移动到用户的位置。

# Examples

// Initialize the geolocate control.
var geolocate = new vjmap.GeolocateControl({
 positionOptions: {
   enableHighAccuracy: true
 },
 trackUserLocation: true
});
// Add the control to the map.
map.addControl(geolocate);
map.on('load', function() {
  geolocate.trigger();
});
1
2
3
4
5
6
7
8
9
10
11
12

返回**boolean**返回false如果之前控制被添加到地图叫,否则返回true

# geolocate

在每次成功返回的 Geolocation API 位置更新上触发。

# Properties

  • data **位置**返回的位置 ``Geolocation.getCurrentPosition()回调中的对象 ``或Geolocation.watchPosition().

# Examples

// Initialize the geolocate control.
var geolocate = new vjmap.GeolocateControl({
  positionOptions: {
      enableHighAccuracy: true
  },
  trackUserLocation: true
});
// Add the control to the map.
map.addControl(geolocate);
// Set an event listener that fires
// when a geolocate event occurs.
geolocate.on('geolocate', function() {
  console.log('A geolocate event has occurred.')
});
1
2
3
4
5
6
7
8
9
10
11
12
13
14

# error

在作为错误返回的每个 Geolocation API 位置更新时触发。

# Properties

  • data **位置误差**返回的PositionError ``Geolocation.getCurrentPosition()回调中的对象 ``或Geolocation.watchPosition().

# Examples

// Initialize the geolocate control.
var geolocate = new vjmap.GeolocateControl({
  positionOptions: {
      enableHighAccuracy: true
  },
  trackUserLocation: true
});
// Add the control to the map.
map.addControl(geolocate);
// Set an event listener that fires
// when an error event occurs.
geolocate.on('error', function() {
  console.log('An error event has occurred.')
});
1
2
3
4
5
6
7
8
9
10
11
12
13
14

# outofmaxbounds

在每个 Geolocation API 位置更新时触发,该位置更新返回成功,但用户位置超出地图 maxBounds。

# Properties

  • data **位置**返回的位置 ``Geolocation.getCurrentPosition()回调中的对象 ``或Geolocation.watchPosition().

# Examples

// Initialize the geolocate control.
var geolocate = new vjmap.GeolocateControl({
  positionOptions: {
      enableHighAccuracy: true
  },
  trackUserLocation: true
});
// Add the control to the map.
map.addControl(geolocate);
// Set an event listener that fires
// when an outofmaxbounds event occurs.
geolocate.on('outofmaxbounds', function() {
  console.log('An outofmaxbounds event has occurred.')
});
1
2
3
4
5
6
7
8
9
10
11
12
13
14

# trackuserlocationstart

当 Geolocate Control 更改为活动锁定状态时触发,该状态发生在第一次为用户成功获取 Geolocation API 位置时(随后将发生 geolocate 事件),或者用户在使用最后一个的后台状态时单击 geolocate 按钮已知位置重新定位地图并进入活动锁定状态(除非用户的位置发生变化,否则不会发生地理定位事件)。

# Examples

// Initialize the geolocate control.
var geolocate = new vjmap.GeolocateControl({
  positionOptions: {
      enableHighAccuracy: true
  },
  trackUserLocation: true
});
// Add the control to the map.
map.addControl(geolocate);
// Set an event listener that fires
// when a trackuserlocationstart event occurs.
geolocate.on('trackuserlocationstart', function() {
  console.log('A trackuserlocationstart event has occurred.')
});
1
2
3
4
5
6
7
8
9
10
11
12
13
14

# trackuserlocationend

当 Geolocate Control 更改为后台状态时触发,当用户在活动位置锁定期间更改相机时会发生这种情况。这仅在 trackUserLocation 为 true 时适用。在后台状态下,地图上的点会随着位置更新而更新,但相机不会。

# Examples

// Initialize the geolocate control.
var geolocate = new vjmap.GeolocateControl({
  positionOptions: {
      enableHighAccuracy: true
  },
  trackUserLocation: true
});
// Add the control to the map.
map.addControl(geolocate);
// Set an event listener that fires
// when a trackuserlocationend event occurs.
geolocate.on('trackuserlocationend', function() {
  console.log('A trackuserlocationend event has occurred.')
});
1
2
3
4
5
6
7
8
9
10
11
12
13
14