Trong tài liệu này, bạn sẽ tìm hiểu cách sử dụng API Tìm kiếm lân cận (Mới) để xây dựng một giải pháp đơn giản và tiết kiệm chi phí
trải nghiệm khám phá địa phương.
Trải nghiệm khám phá địa phương cho người dùng thấy các địa điểm quan trọng mà họ quan tâm ở gần vị trí bạn chỉ định khi tìm kiếm khách sạn hoặc bất động sản. Mô hình này thường bao gồm một bản đồ tương tác, có thêm một bảng điều khiển chứa trình chọn địa điểm và thư viện ảnh. Bạn sẽ được giới thiệu về các sản phẩm và chức năng khác nhau của Nền tảng Google Maps để nâng cao trải nghiệm nhờ tính tương tác.
Trường hợp Sử dụng
Bây giờ, hãy tìm hiểu những yếu tố nào của hoạt động tích hợp khám phá cục bộ thúc đẩy giá trị người dùng:
Khám phá – Cung cấp cho người dùng thông tin tổng quan về những gì xung quanh một vị trí duy nhất bằng cách hiển thị các địa điểm có liên quan thuộc nhiều loại vị trí.
Tính tương tác – Cho phép người dùng chọn một địa điểm và tự động làm mới dữ liệu
liên quan đến địa điểm đó.
Hình ảnh trực quan – Cung cấp bài đánh giá, ảnh về địa điểm
cũng như thời gian đi bộ và quãng đường để người dùng nhanh chóng hiểu được liệu nó có phù hợp với nhu cầu của họ hay không.
Cấu trúc tham chiếu
Khám phá địa phương
Có nhiều cách để tạo ra trải nghiệm khám phá địa phương. Nội dung tích hợp sau đây là ví dụ tuỳ chỉnh về trải nghiệm người dùng tận dụng các API Nền tảng Google Maps nổi tiếng cũng như một số tính năng mới thú vị. Nếu muốn có một phương pháp theo mẫu để khám phá cục bộ, bạn có thể sử dụng Thành phần web.
Ứng dụng mẫu
Hướng dẫn từng bước về mẫu
Bạn sẽ thấy trong bảng dưới đây, ứng dụng mẫu được chia thành các bước cùng với nội dung mô tả về cách triển khai kỹ thuật với API Nền tảng Google Maps.
1. Tìm kiếm vị trí với vị trí Tự động hoàn thành Tìm kiếm
- Tải API JavaScript của Maps.
- Truy vấn Tự động hoàn thành địa điểm hoặc chọn vị trí trên bản đồ.
2. Hiển thị các địa điểm yêu thích tại địa phương bằng API Tìm kiếm lân cận (Mới)
- Thứ hạng mức độ phổ biến (kết quả có liên quan hơn) hoặc thứ hạng theo khoảng cách.
includedTypes
,excludedTypes
; nếu là khách sạn, bạn có thể loại trừ loại "nhà nghỉ" và chỉ thêm các loại phù hợp, ví dụ: "nhà hàng, quán cà phê, công viên, tourit_attraction".- Tận dụng
includedPrimaryTypes
,excludedPrimaryTypes
để kiểm soát nhiều hơn nữa kết quả. - `hạn chế vị trí để tránh không đủ số lượng kết quả hoặc vị trí quá xa ; trong trường hợp kết quả ZERO, hãy mở rộng kích thước hình tròn / hình chữ nhật trước khi hiển thị kết quả.
Mẫu truy vấn khi đặt phòng khách sạn bằng các trường Dữ liệu đã yêu cầu:
- Cơ bản (
displayName
,types
,openingHours
,formattedAddress
) - Thông tin liên hệ (
websiteUri
,nationalPhoneNumber
,internationalPhoneNumber
) - Ưu tiên (
reviews
,priceLevel
,userRatingCount
)
{ "includedTypes": ["restaurant","cafe","park"], "excludedTypes": ["lodging","convenience_store"], "includedPrimaryTypes": ["restaurant","tourist_attraction","airport"], "excludedPrimaryTypes": ["lodging"], "maxResultCount": 20, "locationRestriction": { "circle": { "center": { "latitude": 37.7937, "longitude": -122.3965 }, "radius": 500.0 } } }
Mẫu truy vấn khi tìm kiếm bất động sản có các trường Dữ liệu được yêu cầu:
- Cơ bản (
displayName
,types
,openingHours
,formattedAddress
)
{ "includedTypes": ["school","transport","bus","convenience_store"], "excludedTypes": ["lodging"], "includedPrimaryTypes": ["restaurant","tourist_attraction","airport"], "excludedPrimaryTypes": ["lodging"], "maxResultCount": 20, "locationRestriction": { "circle": { "center": { "latitude": 37.7937, "longitude": -122.3965 }, "radius": 500.0 } } }
3. Thêm tính tương tác với API chỉ đường và bản đồ động
- Cập nhật đường đi và các bước bằng cách truy vấn API Chỉ đường. * Sử dụng thời gian trong phần tiếp theo.
4. Hiển thị thông tin chi tiết của địa điểm khi tương tác
Mô tả:
displayName
,types
,rating
,userRatingCount
,priceLevel
.Thời gian: đến từ truy vấn API Hướng dẫn trước đó.
Bài đánh giá:
reviews[i].author
,reviews[i].rating
,reviews[i].text
.Hình ảnh: trong Bản xem trước không hạn chế API Tìm kiếm lân cận (Mới), bạn sẽ phải truy vấn Thông tin chi tiết về địa điểm bằng
place.id
để lấy photo_reference rồi truy vấn lần lượt từng địa điểm trong trải nghiệm của bạn
Số lượng truy vấn và chi phí được liên kết
- API JavaScript của Maps: 1 bản đồ khi tải trải nghiệm.
- API Tự động hoàn thành theo địa điểm: 1 truy vấn cho mỗi ký tự đã nhập (nếu sử dụng Tiện ích Tự động hoàn thành), bạn có thể tuỳ chỉnh truy vấn này.
- API Tìm kiếm lân cận (Mới): 1 truy vấn cứ 20 địa điểm được hiển thị. Các phương thức thanh toán khác nhau tuỳ theo Dữ liệu địa điểm thuộc phản hồi truy vấn.
- API Chỉ đường: 1 truy vấn cho mỗi địa điểm do người dùng chọn.
- Place Photo API (API Địa điểm ảnh): 1 truy vấn cho mỗi ảnh được hiển thị.
Kết luận
Trải nghiệm khám phá địa phương là một cách hiệu quả để mang lại giá trị cho người dùng. Quá trình triển khai minh hoạ này có nhiều tính năng mà bạn có thể đưa vào khi tạo một trải nghiệm như vậy trên Nền tảng Google Maps với các tính năng đặc biệt của API Tìm kiếm lân cận (Mới) .
Các bước tiếp theo
Bạn nên đọc thêm:
- Thành phần web trong Maps JavaScript API
- Tối ưu hoá tính năng tự động hoàn thành theo địa điểm
- Dịch vụ địa điểm khác
- Hãy để lại ý kiến phản hồi bên dưới.
Người đóng góp
Tác giả chính:
Thomas Anglaret | Kỹ sư giải pháp nền tảng Google Maps