Maps Javascript APIs
eKMap PlatformMaps Javascript APIsJavascript APIPicker Control

Picker Control

Picker Control sử dụng các dịch vụ eKMap Platform API cung cấp giúp bạn tích hợp dịch vụ truy vấn thông tin địa điểm một cách nhanh chóng và dễ dàng nhất.

Place Picker

Place Picker tích hợp dịch vụ truy vấn vị trí địa điểm bằng cách chọn trên bản đồ.

new ekmapplf.placePicker(options: Object)

Parameters

Thuộc tínhKiểuMô tả
apiKeystringKey này sẽ được đưa vào trong tất cả các yêu cầu của dịch vụ
mapstring hoặc HTMLElement hoặc Map)Hàm thêm PlacePicker vào một vùng chứa. Vùng chứa có thể là một maplibregl.Map, một HTMLElement hoặc một CSS selector
locationarray
default: null		Tọa độ vị trí sẽ được sử dụng làm tâm bản đồ
zoomnumber
default: null		Mức zoom trong khoảng (0-24). Giá trị mức zoom của bản đồ
searchboolean
default: true		Cung cấp lựa chọn dịch vụ tìm kiếm địa chỉ
callbackfunctionHàm trả về sau khi lựa chọn địa điểm
closeBtnboolean
default: false		Cung cấp lựa chọn đóng Place Picker ( gồm thanh công cụ phía trên có tìm kiếm và thanh công cụ phía dưới có nút "Chọn")
closeBtn_callbackfunctionHàm trả về khi người dùng click vào 'x' ở thanh công cụ phía trên

Methods

Phương thứcGiá trị trả vềMô tả
remove()Hàm loại bỏ dịch vụ Place Picker
setLocation(array)Hàm đặt giá trị tọa độ vị trí tâm bản đồ
getLocation()arrayHàm gọi lấy giá trị tọa độ vị trí tâm bản đồ
setZoom(number)Hàm đặt giá trị mức zoom của bản đồ
getZoom()numberHàm gọi lấy giá trị mức zoom của bản đồ
getDetails(function)Đặt hàm trả về sau khi lựa chọn địa điểm

Example

<!DOCTYPE html>
<html lang="en">
 
<head>
<meta charset="utf-8" />
<script src="https://files.ekgis.vn/sdks/v2.0.0/ekmap-platform.min.js"></script>
<link href="https://files.ekgis.vn/sdks/v2.0.0/ekmap-platform.min.css" rel='stylesheet' />
<title>Place Picker</title>
<style>
.map {
width: 100%;
height: calc(100vh - 15px);
}
body {
overflow: hidden;
}
</style>
</head>
 
<body>
<div style="width: 100%;">
<div id="divMapId" class="map"></div>
</div>
<script>
var apiKey = 'YOUR_API_KEY' // "Nhập khóa API eKMap Platform của bạn"
var map = new maplibregl.Map({
container: 'divMapId',
center: [105, 17],
zoom: 4,
});
/*Khởi tạo Place Picker*/
var options = {
apiKey: apiKey,
map: map,
callback: callback_method,
};
var picker = new ekmapplf.placePicker(options);
function callback_method(response) {
console.log(response);
alert(JSON.stringify(response));
}
</script>
</body>
 
</html>