CƠ HỘI ĐẦU TƯ TRONG LỊCH SỬ KHÔNG THỂ BỎ QUA?

HƯỚNG DẪN TOÀN TẬP ĐẦU TƯ VỚI THỊ TRƯỜNG BITCOIN 2019

>> Xem tại đây <<

Trang chủ / Lập trình Google Map / Google Map là gì? Giới thiệu về tổng quan về Google Map (Bài 1)

Google Map là gì? Giới thiệu về tổng quan về Google Map (Bài 1)

Bài viết này chúng ta sẽ cùng nhau tìm hiểu khải niệm Google Map là gì và cùng nhau tìm hiểu tổng quan về lập trình Google Map

Google Map là gì?

Google Maps là một dịch vụ lập bản đồ web miễn phí của Google cung cấp nhiều loại thông tin địa lý khác nhau. Sử dụng Google Maps, người ta có thể.

  • Tìm kiếm địa điểm hoặc nhận chỉ đường từ nơi này đến nơi khác.
  • Xem và điều hướng thông qua hình ảnh mức độ đường phố toàn cảnh ngang và dọc của các thành phố khác nhau trên thế giới.
  • Nhận thông tin cụ thể như lưu lượng truy cập tại một điểm cụ thể.

Google Maps cung cấp API sử dụng mà bạn có thể tùy chỉnh bản đồ và thông tin được hiển thị trên chúng. Phần này mình sẽ giải thích cách tải Google Map đơn giản trên trang web của bạn bằng HTML và JavaScript.

Các bước chạy Google Map trên trang web

Thực hiện theo các bước được cung cấp dưới đây để tải bản đồ trên trang web của bạn :

Bước 1 : Tạo 1 trang HTML

Tạo một trang HTML cơ bản với các thẻ head và body như hiển thị bên dưới –

Bước 2 : Chạy API Google Map

Tải hoặc bao gồm API Google Maps bằng thẻ tập lệnh như được hiển thị bên dưới –

Bước 3: Tạo Container

Để chạy bản đồ, chúng ta phải tạo một phần tử container, thường là thẻ <div> được sử dụng cho mục đích này. Tạo một phần tử div và xác định kích thước của nó như hiển thị bên dưới –

Bước 4 : Map Options

Trước khi khởi tạo bản đồ, chúng ta phải tạo một đối tượng mapOptions và đặt các giá trị cho các biến khởi tạo bản đồ. Một bản đồ có ba tùy chọn chính là centre , zoom  và maptypeid.

centre – Theo thuộc tính này, chúng tôi phải chỉ định vị trí mà chúng tôi muốn căn giữa bản đồ. Để vượt qua vị trí, chúng ta phải tạo một đối tượng LatLng bằng cách chuyển vĩ độ và kinh độ của vị trí cần thiết cho hàm tạo.

zoom  – Trong thuộc tính này, chúng tôi phải chỉ định mức thu phóng của bản đồ.

maptypeid − Theo thuộc tính này, chúng tôi phải chỉ định loại bản đồ mà chúng tôi muốn. Sau đây là các loại bản đồ được cung cấp bởi Google

  • ROADMAP (bình thường, bản đồ 2D mặc định)
  • SATELLITE (bản đồ chụp ảnh)
  • HYBRID (kết hợp hai hoặc nhiều loại khác)
  • TERRAIN (bản đồ với núi, sông, v.v.)

Trong một hàm, giả sử, loadMap(), tạo đối tượng mapOptions và đặt các giá trị bắt buộc cho centre, zoom và mapTypeId như hiển thị bên dưới.

Bước 5 : Tạo Map Object

Bạn có thể tạo bản đồ bằng cách khởi tạo lớp JavaScript có tên là Map. Trong khi khởi tạo lớp này, bạn phải truyền vào mã ID của thẻ div HTML để hiển thị bản đồ và các tùy chọn bản đồ Map Options cho bản đồ được. Tạo một đối tượng bản đồ như code dưới đây.

Bước 6 : Chạy bản đồ

Cuối cùng tải bản đồ bằng cách gọi phương thức loadMap () hoặc thêm DOM Listener

Bước 7 : Toàn bộ code hiển thị bản đồ sẽ như sau

Bản đồ được xuất ra bản đồ sẽ như sau :

Google Map là gì - Hiển thị Google Map

Kết thúc bài 1 giới thiệu về Google Map là gì và cách khởi chạy lập trình 1 ứng dụng Google Map như thế nào.

Nếu bạn có bất kỳ thắc mắc nào để lại bình luận bên dưới mình sẽ giải đáp nhé!

Good Luck!

Trả lời

Email của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *