Bắt đầu nhanh API Nhúng Maps

Đặt một bản đồ tương tác hoặc ảnh toàn cảnh Chế độ xem đường phố trên trang web của bạn bằng một yêu cầu HTTP đơn giản mà không cần JavaScript.

Chi phí

Tất cả các yêu cầu Maps Embed API đều được cung cấp miễn phí và không giới hạn số lần sử dụng. Tuy nhiên, tất cả các yêu cầu vẫn cần có một khoá API Google Cloud hợp lệ. Để biết thêm thông tin, hãy xem phần Mức sử dụng và thanh toán.

Trước khi bắt đầu

Để tạo một bản đồ được nhúng trên trang web, hãy hoàn tất các bước thiết lập bắt buộc bằng cách nhấp vào các thẻ sau:

Bước 1

Giao diện dòng lệnh

  1. Trong Google Cloud Console, trên trang chọn dự án, hãy nhấp vào Tạo dự án để bắt đầu tạo một dự án Cloud mới.

    Chuyển đến trang chọn dự án

  2. Đảm bảo bạn đã bật tính năng thanh toán cho dự án trên Cloud. Xác nhận rằng bạn đã bật tính năng thanh toán cho dự án của mình.

    Google Cloud cung cấp bản dùng thử không tính phí. Thời gian dùng thử sẽ kết thúc sau 90 ngày hoặc sau khi tài khoản tích luỹ được khoản phí trị giá 3.000.000 VND, tuỳ theo điều kiện nào đến trước. Huỷ bất cứ lúc nào. Để biết thêm thông tin, hãy xem bài viết Khoản tín dụng trong tài khoản thanh toán và Thanh toán.

SDK đám mây

gcloud projects create "PROJECT"

Đọc thêm về Google Cloud SDK, quy trình cài đặt Cloud SDK và các lệnh sau:

Bước 2

Để sử dụng Nền tảng Google Maps, bạn phải bật các API hoặc SDK mà bạn dự định sử dụng cho dự án của mình.

Giao diện dòng lệnh

Bật Maps Embed API

SDK đám mây

gcloud services enable \
    --project "PROJECT" \
    "maps-embed-backend.googleapis.com"

Đọc thêm về Google Cloud SDK, quy trình cài đặt Cloud SDK và các lệnh sau:

Bước 3

Bước này chỉ hướng dẫn quy trình tạo Khoá API. Nếu sử dụng Khoá API trong quá trình phát hành chính thức, bạn nên hạn chế Khoá API của mình. Bạn có thể tìm thêm thông tin trên trang Sử dụng khoá API dành riêng cho sản phẩm.

Khoá API là một giá trị nhận dạng duy nhất xác thực các yêu cầu liên kết với dự án của bạn cho mục đích sử dụng và thanh toán. Bạn phải có ít nhất một khoá API được liên kết với dự án của mình.

Cách tạo khoá API:

Giao diện dòng lệnh

  1. Chuyển đến trang Nền tảng Google Maps > Thông tin đăng nhập.

    Chuyển đến trang Thông tin đăng nhập

  2. Trên trang Thông tin xác thực, hãy nhấp vào Tạo thông tin xác thực > Khoá API.
    Hộp thoại Khoá API đã tạo sẽ hiển thị khoá API mới tạo.
  3. Nhấp vào Đóng.
    Khoá API mới sẽ xuất hiện trên trang Thông tin xác thực trong phần Khoá API.
    (Hãy nhớ hạn chế API trước khi sử dụng khoá này trong quá trình phát hành công khai.)

SDK đám mây

gcloud services api-keys create \
    --project "PROJECT" \
    --display-name "DISPLAY_NAME"

Đọc thêm về Google Cloud SDK, quy trình cài đặt Cloud SDK và các lệnh sau:

Tạo iframe

Nhấp vào các lựa chọn sau đây và thêm vị trí cũng như khoá API để tạo iframe cho trang web của bạn. Để biết thêm các thông số và lựa chọn, hãy xem phần Nhúng bản đồ.

Kiểm thử iframe

Cách xem iframe trong cửa sổ trình duyệt HTML:

  1. Mở trình chỉnh sửa văn bản mặc định. Theo mặc định, bạn nên cài đặt các trình chỉnh sửa văn bản như TextEdit hoặc Microsoft Windows Notepad trên thiết bị.
  2. Tạo một tệp HTML và đặt tên là index.html.

  3. Thêm đoạn mã sau vào iframe bạn đã tạo ở trên:

    <html>
  <!-- Replace this code comment with your iframe. -->
</html>

  4. Lưu tệp HTML index.html.

  5. Tải tệp HTML trong trình duyệt web bằng cách kéo tệp đó từ máy tính sang trình duyệt; ngoài ra, bạn có thể nhấp đúp vào tệp trên hầu hết các hệ điều hành.

Xin chúc mừng! Bạn vừa thiết lập và tạo một bản đồ bằng Maps Embed API.

Dọn dẹp

Bạn có thể xoá dự án của mình trên Google Cloud để ngừng tính phí cho tất cả tài nguyên đã dùng trong dự án đó.

  1. Trong bảng điều khiển Google Cloud, hãy chuyển đến trang Quản lý tài nguyên:

    Chuyển đến trang Quản lý tài nguyên

  2. Nếu dự án mà bạn dự định xoá được đính kèm vào một tổ chức, hãy chọn và mở rộng danh sách tổ chức ở đầu trang.
  3. Trong danh sách dự án, hãy chọn dự án mà bạn muốn xoá rồi nhấp vào Xoá.
  4. Trong hộp thoại, hãy nhập mã dự án rồi nhấp vào Tắt để xoá dự án.

Các bước tiếp theo