Bản đồ được tạo mẫu

Tuỳ chỉnh bản trình bày của bản đồ Google tiêu chuẩn bằng cách áp dụng kiểu của riêng bạn khi sử dụng API tĩnh của Maps. Bạn có thể thay đổi hình ảnh hiển thị của các tính năng như đường, công viên, khu vực đã xây dựng và các địa điểm yêu thích khác. Hãy thay đổi màu sắc hoặc kiểu để làm nổi bật nội dung cụ thể, bổ sung cho nội dung xung quanh trên trang hoặc thậm chí ẩn hoàn toàn các tính năng.

Nếu bạn muốn dễ dàng cập nhật cùng một kiểu trên nhiều ứng dụng, hãy tìm hiểu cách tuỳ chỉnh trên đám mây có trong Google Cloud Console. Bạn sẽ cần tạo và thêm mã bản đồ để sử dụng tính năng tuỳ chỉnh trên đám mây. Bạn không nên kết hợp tính năng tuỳ chỉnh trên đám mây và định kiểu được mã hoá cứng trong cùng một ứng dụng, để tránh những xung đột có thể xảy ra trong tương lai.

Ví dụ

Ví dụ sau đây cho thấy bản đồ Brooklyn, Hoa Kỳ, với kiểu tô màu đường địa phương màu xanh lục sáng và màu đen của khu dân cư. Tùy chọn này cũng đảo ngược độ sáng của nhãn để nhãn nổi bật hơn trên nền tối. Xin lưu ý rằng ví dụ hoạt động này sử dụng phương thức mã hoá URL:

https://maps.googleapis.com/maps/api/staticmap?size=512x512&zoom=15&center=Brooklyn&style=feature:road.local%7Celement:geometry%7Ccolor:0x00ff00&style=feature:landscape%7Celement:geometry.fill%7Ccolor:0x000000&style=element:labels%7Cinvert_lightness:true&style=feature:road.arterial%7Celement:labels%7Cinvert_lightness:false&key=YOUR_API_KEY&signature=YOUR_SIGNATURE

Phần mẫu có thể không được cung cấp ở khu vực của bạn.

Ví dụ sau đây sử dụng các thao tác định kiểu và đơn giản hoá để lấy gần đúng hình dạng của tập bản đồ đường phố ở Hoa Kỳ:

https://maps.googleapis.com/maps/api/staticmap?size=512x512&zoom=12&center=Chicago&format=png&style=feature:road.highway%7Celement:geometry%7Cvisibility:simplified%7Ccolor:0xc280e9&style=feature:transit.line%7Cvisibility:simplified%7Ccolor:0xbababa&style=feature:road.highway%7Celement:labels.text.stroke%7Cvisibility:on%7Ccolor:0xb06eba&style=feature:road.highway%7Celement:labels.text.fill%7Cvisibility:on%7Ccolor:0xffffff&key=YOUR_API_KEY&signature=DITIGAL_SIGNATURE

Phần mẫu có thể không được cung cấp ở khu vực của bạn.

Cú pháp kiểu

Để tạo bản đồ được tạo kiểu tuỳ chỉnh, hãy bao gồm một hoặc nhiều tham số style trong URL yêu cầu.

Mỗi khai báo style có thể chứa các đối số sau, được phân tách bằng các ký tự sổ thẳng ("|"):

• feature (không bắt buộc) cho biết các tính năng cần chọn để sửa đổi kiểu này. Các tính năng bao gồm những nội dung trên bản đồ, chẳng hạn như đường đi, công viên hoặc các địa điểm yêu thích khác. Nếu không có đối số feature, kiểu đã chỉ định sẽ áp dụng cho tất cả các tính năng.
• element (không bắt buộc) cho biết(các) phần tử của đối tượng được chỉ định cần chọn cho quy trình sửa đổi kiểu này. Phần tử là các đặc điểm của một đối tượng, chẳng hạn như hình học hoặc nhãn. Nếu không có đối số element, kiểu này sẽ áp dụng cho mọi phần tử của tính năng được chỉ định.
• Một tập hợp quy tắc kiểu (bắt buộc) áp dụng cho (các) tính năng và phần tử được chỉ định. API áp dụng các quy tắc theo thứ tự xuất hiện trong nội dung khai báo style. Bạn có thể thêm số lượng quy tắc bất kỳ trong các giới hạn độ dài URL thông thường của API tĩnh của Maps.

Lưu ý: phần khai báo style phải chỉ định các đối số trên theo thứ tự đã nêu. Ví dụ sau đây cung cấp cú pháp chính xác để lựa chọn một tính năng và phần tử bằng hai quy tắc:

style=feature:myFeatureArgument|element:myElementArgument|myRule1:myRule1Argument|myRule2:myRule2Argument

Tính năng

Nội dung khai báo style sau đây sẽ tô màu tất cả các con đường trên bản đồ:

style=feature:road|color:0xffffff

Dưới đây là một số lựa chọn tính năng phổ biến:

• feature:all (mặc định) chọn tất cả các đối tượng địa lý của bản đồ.
• feature:road chọn tất cả các con đường trên bản đồ.
• feature:road.local chọn tất cả các con đường địa phương.

Đối tượng địa lý hoặc loại đối tượng là những đặc điểm địa lý trên bản đồ, bao gồm đường, công viên, sông nước, doanh nghiệp và các đặc điểm khác.

Các tính năng này tạo thành một cây danh mục, với all là gốc. Nếu bạn không chỉ định một đối tượng, tất cả các đối tượng sẽ được chọn. Việc chỉ định một tính năng của all cũng có tác động tương tự.

Một số tính năng chứa các tính năng con mà bạn chỉ định bằng cách sử dụng ký hiệu dấu chấm. Ví dụ: landscape.natural hoặc road.local. Nếu bạn chỉ chỉ định tính năng mẹ, chẳng hạn như road, thì các kiểu bạn chỉ định cho thành phần mẹ sẽ áp dụng cho tất cả tính năng con, chẳng hạn như road.local và road.highway.

Xin lưu ý rằng các tính năng mẹ có thể bao gồm một số phần tử không có trong tất cả các tính năng con của chúng.

Có các tính năng sau:

• all (mặc định) chọn tất cả tính năng.
• administrative chọn tất cả các khu vực hành chính. Việc tạo kiểu chỉ ảnh hưởng đến nhãn của khu vực hành chính, chứ không ảnh hưởng đến đường viền địa lý hoặc màu nền.
  • administrative.country chọn quốc gia.
  • administrative.land_parcel chọn các lô đất.
  • administrative.locality chọn các khu vực.
  • administrative.neighborhood chọn vùng lân cận.
  • administrative.province chọn tỉnh.
• landscape chọn tất cả hướng ngang.
  • landscape.man_made chọn các tính năng nhân tạo, chẳng hạn như toà nhà và các cấu trúc khác.
  • landscape.natural chọn các đặc điểm tự nhiên như núi, sông, sa mạc và sông băng.
  • landscape.natural.landcover chọn các tính năng của lớp phủ đất, vật chất vật lý bao phủ bề mặt trái đất, chẳng hạn như rừng, đồng cỏ, đầm lầy và đất trống.
  • landscape.natural.terrain chọn các đặc điểm địa hình của một bề mặt đất, chẳng hạn như độ cao, độ dốc và hướng.
• poi chọn tất cả các địa điểm yêu thích.
  • poi.attraction chọn các điểm tham quan du lịch.
  • poi.business chọn các doanh nghiệp.
  • poi.government chọn các toà nhà chính phủ.
  • poi.medical chọn các dịch vụ khẩn cấp, bao gồm bệnh viện, hiệu thuốc, cảnh sát, bác sĩ và nhiều dịch vụ khác.
  • poi.park chọn công viên.
  • poi.place_of_worship chọn các địa điểm thờ cúng, bao gồm nhà thờ, đền thờ, nhà thờ Hồi giáo và các địa điểm khác.
  • poi.school chọn trường học.
  • poi.sports_complex chọn các khu phức hợp thể thao.
• road chọn tất cả các con đường.
  • road.arterial chọn các đường chính.
  • road.highway chọn đường cao tốc.
  • road.highway.controlled_access chọn đường cao tốc có quyền ra vào có kiểm soát.
  • road.local chọn các đường địa phương.
• transit chọn tất cả các đường và trạm phương tiện công cộng.
  • transit.line chọn các đường chuyển tuyến.
  • transit.station chọn tất cả các trạm phương tiện công cộng.
  • transit.station.airport chọn các sân bay.
  • transit.station.bus chọn trạm xe buýt.
  • transit.station.rail chọn các trạm xe lửa.
• water chọn vùng nước.

Các phần tử

Nội dung khai báo style sau đây sẽ tô màu nhãn cho tất cả các con đường địa phương:

style=feature:road.local|element:labels|color:0xffffff

Phần tử là các phân mục của một đối tượng. Ví dụ: một con đường bao gồm đường đồ hoạ (hình học) trên bản đồ, cũng như văn bản biểu thị tên của đường đó (một nhãn).

Có các phần tử sau đây, nhưng lưu ý rằng một tính năng cụ thể có thể không hỗ trợ, một số hoặc tất cả phần tử:

• all (mặc định) chọn tất cả các phần tử của đối tượng đã chỉ định.
• geometry chọn tất cả phần tử hình học của đối tượng đã chỉ định.
  • geometry.fill chỉ chọn màu nền cho hình dạng của đối tượng.
  • geometry.stroke chỉ chọn nét vẽ cho hình dạng của đối tượng.
• labels chọn các nhãn văn bản liên kết với tính năng được chỉ định.
  • labels.icon chỉ chọn biểu tượng hiển thị trong nhãn của tính năng.
  • labels.text chỉ chọn văn bản của nhãn.
  • labels.text.fill chỉ chọn màu nền của nhãn. Vùng tô màu của nhãn thường được hiển thị dưới dạng đường viền màu xung quanh văn bản nhãn.
  • labels.text.stroke chỉ chọn nét vẽ của văn bản nhãn.

Quy tắc về kiểu

Quy tắc kiểu là những tuỳ chọn định dạng được áp dụng cho các tính năng và phần tử được chỉ định trong mỗi nội dung khai báo style.

Đoạn khai báo style sau đây áp dụng hai quy tắc kiểu cho các đường trên bản đồ. Quy tắc đầu tiên sẽ áp dụng màu cho đường. Quy tắc thứ hai đơn giản hoá cách hiển thị đường, vì vậy, đường viền sẽ có các đường mỏng hơn mà không có đường viền:

style=feature:road|color:0xffffff|visibility:simplified

Mỗi khai báo style phải chứa một hoặc nhiều thao tác được phân tách bằng ký tự dấu sổ thẳng ("|"). Mỗi toán tử chỉ định giá trị đối số của nó bằng cách sử dụng ký tự dấu hai chấm (":"), và tất cả các phép toán đều áp dụng cho lựa chọn theo thứ tự mà bạn chỉ định.

Các tuỳ chọn kiểu sau được hỗ trợ:

• hue (một chuỗi hệ lục phân RGB có định dạng #RRGGBB) cho biết màu cơ bản.

  Lưu ý: Tuỳ chọn này sẽ đặt màu sắc mà vẫn giữ độ bão hoà và độ sáng được chỉ định trong kiểu Google mặc định (hoặc trong các tuỳ chọn kiểu khác mà bạn xác định trên bản đồ). Màu kết quả sẽ tương ứng với kiểu của bản đồ cơ sở. Nếu Google thực hiện bất kỳ thay đổi nào đối với kiểu bản đồ cơ sở, những thay đổi đó sẽ ảnh hưởng đến các đối tượng của bản đồ được tạo kiểu bằng hue. Bạn nên sử dụng trình tạo kiểu color tuyệt đối nếu có thể.

• lightness (một giá trị dấu phẩy động từ -100 đến 100) cho biết tỷ lệ phần trăm thay đổi về độ sáng của phần tử. Giá trị âm làm tăng độ tối (trong đó -100 chỉ định màu đen) trong khi giá trị dương làm tăng độ sáng (trong đó +100 chỉ định màu trắng).

  Lưu ý: Tuỳ chọn này sẽ đặt độ sáng mà vẫn giữ độ bão hoà và màu sắc được chỉ định theo kiểu mặc định của Google (hoặc trong các tuỳ chọn kiểu khác mà bạn xác định trên bản đồ). Màu kết quả sẽ tương ứng với kiểu của bản đồ cơ sở. Nếu Google thực hiện bất kỳ thay đổi nào đối với kiểu bản đồ cơ sở, những thay đổi đó sẽ ảnh hưởng đến các đối tượng của bản đồ được tạo kiểu bằng lightness. Bạn nên sử dụng trình tạo kiểu color tuyệt đối nếu có thể.

• saturation (một giá trị dấu phẩy động từ -100 đến 100) cho biết tỷ lệ phần trăm thay đổi về cường độ của màu cơ bản để áp dụng cho phần tử.

  Lưu ý: Tuỳ chọn này sẽ đặt độ bão hoà mà vẫn giữ màu sắc và độ sáng được chỉ định trong kiểu mặc định của Google (hoặc trong các tuỳ chọn kiểu khác mà bạn xác định trên bản đồ). Màu kết quả sẽ tương ứng với kiểu của bản đồ cơ sở. Nếu Google thực hiện bất kỳ thay đổi nào đối với kiểu bản đồ cơ sở, những thay đổi đó sẽ ảnh hưởng đến các đối tượng của bản đồ được tạo kiểu bằng saturation. Bạn nên sử dụng trình tạo kiểu color tuyệt đối nếu có thể.

• gamma (một giá trị dấu phẩy động từ 0.01 đến 10.0, trong đó 1.0 không áp dụng giá trị chỉnh sửa nào) cho biết lượng nội dung chỉnh sửa gamma cần áp dụng cho phần tử. Hiệu chỉnh gamma sửa đổi độ sáng của màu theo cách phi tuyến tính, trong khi không ảnh hưởng đến các giá trị màu trắng hoặc đen. Hiệu chỉnh Gamma thường dùng để điều chỉnh độ tương phản của nhiều thành phần. Ví dụ: bạn có thể sửa đổi gamma để tăng hoặc giảm độ tương phản giữa các cạnh và bên trong các phần tử.

  Lưu ý: Tuỳ chọn này điều chỉnh độ sáng theo kiểu mặc định của Google, bằng cách sử dụng đường cong gamma. Nếu Google thực hiện bất kỳ thay đổi nào đối với kiểu bản đồ cơ sở, những thay đổi đó sẽ ảnh hưởng đến các đối tượng của bản đồ được tạo kiểu bằng gamma. Bạn nên sử dụng trình tạo kiểu color tuyệt đối nếu có thể.

• invert_lightness (nếu true) đảo ngược độ sáng hiện tại. Điều này rất hữu ích, ví dụ: việc chuyển nhanh sang bản đồ tối hơn có văn bản màu trắng.

  Lưu ý: Tùy chọn này chỉ đảo ngược kiểu Google mặc định. Nếu Google thực hiện bất kỳ thay đổi nào đối với kiểu bản đồ cơ sở, những thay đổi đó sẽ ảnh hưởng đến các đối tượng của bản đồ được tạo kiểu bằng invert_lightness. Bạn nên sử dụng trình tạo kiểu color tuyệt đối nếu có thể.

• visibility (on, off hoặc simplified) cho biết phần tử có xuất hiện trên bản đồ hay không và xuất hiện như thế nào. Chế độ hiển thị simplified sẽ xoá một số đặc điểm kiểu khỏi các vị trí bị ảnh hưởng; ví dụ: đường được đơn giản hoá thành các đường mỏng hơn mà không có đường viền, trong khi các công viên sẽ mất văn bản nhãn nhưng vẫn giữ lại biểu tượng nhãn.
• color (một chuỗi hệ lục phân RGB có định dạng #RRGGBB) sẽ đặt màu của đối tượng.
• weight (một giá trị số nguyên, lớn hơn hoặc bằng 0) đặt độ đậm của tính năng, tính bằng pixel. Việc đặt trọng số thành giá trị cao có thể dẫn đến việc bị cắt gần đường viền ô.

Quy tắc kiểu được áp dụng theo thứ tự mà bạn chỉ định. Không kết hợp nhiều thao tác thành một thao tác kiểu. Thay vào đó, hãy xác định từng thao tác là một mục riêng biệt trong mảng kiểu.

Lưu ý: Thứ tự rất quan trọng vì một số phép toán không có tính giao hoán. Các tính năng và/hoặc phần tử được sửa đổi thông qua các thao tác tạo kiểu (thường) đã có sẵn kiểu. Các thao tác sẽ hoạt động trên các kiểu hiện có đó, nếu có.

Mô hình màu sắc, độ bão hoà, độ sáng

Lưu ý: Hiệu ứng của các chế độ cài đặt màu sắc, độ bão hoà, độ sáng và gamma có liên quan đến kiểu của bản đồ cơ sở. Nếu Google thực hiện bất kỳ thay đổi nào đối với kiểu bản đồ cơ sở, thì những thay đổi đó sẽ ảnh hưởng đến các đối tượng của bản đồ được tạo kiểu bằng các tuỳ chọn này. Bạn nên sử dụng trình tạo kiểu color tuyệt đối nếu có thể.

Các bản đồ được tạo kiểu sử dụng mô hình màu sắc, độ bão hoà, độ sáng (HSL) để biểu thị màu sắc trong các thao tác của trình tạo kiểu. Hue biểu thị màu cơ bản, độ bão hoà biểu thị độ đậm của màu đó và độ sáng biểu thị lượng trắng hoặc đen tương đối trong màu tạo nên.

Tính năng Hiệu chỉnh Gamma điều chỉnh độ sáng trên hệ màu, thường để tăng hoặc giảm độ tương phản. Ngoài ra, mô hình HSL xác định màu trong một không gian toạ độ, trong đó hue cho biết hướng trong một bánh xe màu, còn độ bão hoà và độ sáng cho biết biên độ dọc theo các trục. Sắc thái được đo trong hệ màu RGB, tương tự như hầu hết các hệ màu RGB, ngoại trừ việc không có các sắc độ của màu trắng và đen.

Mặc dù hue lấy giá trị màu hex HTML, nhưng chỉ sử dụng giá trị này để xác định màu cơ bản, nghĩa là hướng xung quanh bánh xe màu chứ không phải độ bão hoà hoặc độ sáng. Giá trị này được biểu thị riêng dưới dạng phần trăm thay đổi.

Ví dụ: bạn có thể xác định màu sắc cho màu xanh lục thuần khiết là hue:0x00ff00 hoặc hue:0x000100. Cả hai màu sắc giống hệt nhau. Cả hai giá trị đều trỏ đến màu xanh lục thuần trong mô hình màu HSL.

Một bánh xe màu RGB

Các giá trị hue RGB bao gồm các phần màu đỏ, xanh lục và xanh lam bằng nhau không biểu thị màu sắc, vì không có giá trị nào trong số đó biểu thị một hướng trong không gian toạ độ HSL. Ví dụ như "#000000" (đen), "#FFFFFF" (trắng) và tất cả các sắc xám thuần tuý. Để biểu thị màu đen, trắng hoặc xám, bạn phải xoá tất cả saturation (đặt giá trị thành -100) rồi điều chỉnh lightness.

Ngoài ra, khi sửa đổi các tính năng hiện có đã có bảng phối màu, việc thay đổi một giá trị như hue sẽ không làm thay đổi saturation hoặc lightness hiện có.