Hãy làm theo các bước sau để thiết lập điểm đánh dấu nâng cao.
Lấy khoá API và bật Maps JavaScript API
Trước khi sử dụng điểm đánh dấu nâng cao, bạn cần có một dự án trên Google Cloud có tài khoản thanh toán và đã bật API Maps JavaScript. Để tìm hiểu thêm, hãy xem bài viết Thiết lập dự án trên Google Cloud.
Tạo mã bản đồ
Để tạo mã bản đồ mới, hãy làm theo các bước trong phần Tuỳ chỉnh trên Cloud. Đặt loại Bản đồ thành JavaScript rồi chọn tuỳ chọn Vector (Vectơ) hoặc Raster (Mảng).
Cập nhật mã khởi chạy bản đồ
Bạn cần có mã bản đồ mà bạn vừa tạo. Bạn có thể tìm thấy thông tin này trên trang Quản lý Maps.
Tải thư viện điểm đánh dấu nâng cao từ bên trong hàm
async
khi cần:const { AdvancedMarkerElement } = await google.maps.importLibrary("marker") as google.maps.MarkerLibrary;
Cung cấp mã bản đồ khi bạn tạo bản sao bản đồ bằng thuộc tính
mapId
. Đây có thể là mã bản đồ mà bạn cung cấp hoặcDEMO_MAP_ID
.const map = new google.maps.Map(document.getElementById('map'), { center: {lat: -34.397, lng: 150.644}, zoom: 8, mapId: 'YOUR_MAP_ID' });
Kiểm tra các chức năng của bản đồ (không bắt buộc)
Điểm đánh dấu nâng cao yêu cầu mã bản đồ. Nếu thiếu mã bản đồ, thì bạn sẽ không thể tải điểm đánh dấu nâng cao. Để khắc phục sự cố, bạn có thể thêm trình nghe mapcapabilities_changed
để đăng ký nhận thông báo về các thay đổi về chức năng bản đồ. Bạn không bắt buộc phải sử dụng các tính năng của Bản đồ và chỉ nên sử dụng cho mục đích kiểm thử và khắc phục sự cố hoặc cho mục đích dự phòng trong thời gian chạy.
// Optional: subscribe to map capability changes. map.addListener('mapcapabilities_changed', () => { const mapCapabilities = map.getMapCapabilities(); if (!mapCapabilities.isAdvancedMarkersAvailable) { // Advanced markers are *not* available, add a fallback. } });