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

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

Ví dụ

Ví dụ sau đây cho thấy bản đồ Brooklyn, Hoa Kỳ, với kiểu để tô màu đường phố địa phương màu xanh lục tươi và khu dân cư màu đen. Phương thức này cũng đảo ngược độ sáng của nhãn để các nhãn nổi bật hơn trên nền tối. Xin lưu ý rằng ví dụ đang 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
 Bản đồ theo kiểu Brooklyn.

Ví dụ sau đây sử dụng các thao tác tạo kiểu và đơn giản hoá để đưa ra giao diện của tập bản đồ đường ở 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
 Kiểu bản đồ US Road Atlas.

Cú pháp kiểu

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

Mỗi nội dung khai báo style có thể chứa các đối số sau, được phân tách bằng ký tự dấu gạch đứ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 thông tin trên bản đồ, như đường, 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, thì 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 tính năng đã chỉ định để chọn cho việc 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 nào, thì kiểu sẽ áp dụng cho tất cả các phần tử của tính năng đã chỉ định.
  • Một bộ quy tắc kiểu (bắt buộc) để áp dụng cho (các) tính năng và (các) phần tử đã chỉ định. API áp dụng các quy tắc theo thứ tự xuất hiện trong phần khai báo style. Bạn có thể đưa vào bất kỳ số lượng quy tắc nào, trong phạm vi giới hạn về độ dài URL thông thường của API Tĩnh của Maps.
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 trên bản đồ.
  • feature:road chọn tất cả đường trên bản đồ.
  • feature:road.local chọn tất cả các đường địa phương.

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

Các tính năng tạo thành một cây danh mục, trong đó all là gốc. Nếu bạn không chỉ định một tính năng, tất cả tính năng sẽ được chọn. Việc chỉ định một tính năng của all cũng có tác dụ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 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ả thành phần 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.

Bạn có thể sử dụng các tính năng sau:

  • all (mặc định) chọn tất cả các tính năng.
  • administrative chọn tất cả khu vực hành chính. Việc tạo kiểu chỉ ảnh hưởng đến nhãn của các khu vực hành chính, chứ không ảnh hưởng đến đường viền hoặc màu nền địa lý.
    • administrative.country chọn quốc gia.
    • administrative.land_parcel chọn các lô đất.
    • administrative.locality chọn địa phương.
    • administrative.neighborhood chọn các khu vực lân cận.
    • administrative.province chọn tỉnh.
  • landscape chọn tất cả cảnh quan.
    • landscape.man_made chọn các đối tượ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 đối tượng tự nhiên như núi, sông, sa mạc và sông băng.
    • landscape.natural.landcover chọn các đặc điểm về lớp phủ đất, chất liệu thực tế phủ trên bề mặt trái đất, chẳng hạn như rừng, đồng cỏ, vùng đất ngập nước 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 điểm quan tâm.
    • poi.attraction chọn các điểm thu hút khách du lịch.
    • poi.business chọn 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 cả bệnh viện, nhà thuốc, cảnh sát, bác sĩ và các 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 khu phức hợp thể thao.
  • road chọn tất cả đường.
    • road.arterial chọn đường chính.
    • road.highway chọn đường cao tốc.
    • road.highway.controlled_access chọn đường cao tốc có kiểm soát lối ra vào.
    • road.local chọn đường địa phương.
  • transit chọn tất cả các tuyến và trạm phương tiện công cộng.
    • transit.line chọn các tuyến phương tiện công cộng.
    • transit.station chọn tất cả trạm phương tiện công cộng.
    • transit.station.airport chọn sân bay.
    • transit.station.bus chọn trạm dừng xe buýt.
    • transit.station.rail chọn các ga xe lửa.
  • water chọn vùng nước.

Thành phần

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

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

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

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

  • all (mặc định) chọn mọi phần tử của đối tượng đã chỉ định.
  • geometry chọn tất cả các phần tử hình học của đối tượng được chỉ định.
    • geometry.fill chỉ chọn màu nền của hình học đối tượng.
    • geometry.stroke chỉ chọn nét vẽ trong hình học của đối tượng.
  • labels chọn các nhãn văn bản được liên kết với tính năng đã 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 phần tô của nhãn. Màu nền của nhãn thường được hiển thị dưới dạng đường viền có màu bao quanh văn bản nhãn.
    • labels.text.stroke chỉ chọn nét của văn bản trên nhãn.

Quy tắc về kiểu

Quy tắc kiểu là các 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 phần khai báo style.

Nội dung 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 áp dụng màu cho các con đường. Quy tắc thứ hai đơn giản hoá việc hiển thị các con đường, vì vậy, các đường này có đường viền mỏng hơn mà không có đường viền: 

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

Mỗi phần 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 gạch đứng ("|"). Mỗi toán tử chỉ định giá trị đối số bằng cách sử dụng ký tự dấu hai chấm (":") và tất cả toán tử áp dụng cho lựa chọn theo thứ tự bạn chỉ định.

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

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

    Lưu ý: Tuỳ chọn này đặt sắc độ trong khi 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ả 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ở, thì các thay đổi đó sẽ ảnh hưởng đến các tính năng của bản đồ được tạo kiểu bằng hue. Bạn nên dùng bộ định 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 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 đặt độ sáng trong khi vẫn giữ độ bão hoà và sắc độ đượ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ả 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ở, thì các thay đổi đó sẽ ảnh hưởng đến các tính năng của bản đồ được tạo kiểu bằng lightness. Bạn nên dùng bộ định kiểu color tuyệt đối nếu có thể.

  • saturation (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 đặt độ bão hoà trong khi vẫn giữ nguyên sắc thái 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ả 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ở, thì các thay đổi đó sẽ ảnh hưởng đến các tính nă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 hiệu chỉnh) cho biết mức điều chỉnh 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 kiểu phi tuyến tính mà không ảnh hưởng đến các giá trị trắng hoặc đen. Hiệu chỉnh gamma thường dùng để sửa đổi độ tương phản của nhiều phần tử. 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à phần bên trong của các phần tử.

    Lưu ý: Tuỳ chọn này điều chỉnh độ sáng tương ứng với kiểu Google mặc định bằng cách sử dụng một đườ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ở, thì những thay đổi đó sẽ ảnh hưởng đến các tính nă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 có. Ví dụ: điều này rất hữu ích khi bạn muốn nhanh chóng chuyển sang bản đồ tối hơn có văn bản màu trắng.

    Lưu ý: Tuỳ 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ở, thì những thay đổi đó sẽ ảnh hưởng đến các tính nă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 liệu 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ố tính năng kiểu khỏi các tính năng bị ảnh hưởng; ví dụ: đường được đơn giản hoá thành các đường mảnh hơn mà không có đường viền, trong khi công viên mất văn bản nhãn nhưng vẫn giữ lại biểu tượng nhãn.
  • color (chuỗi thập lục phân RGB có định dạng #RRGGBB) đặ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 trọng số của đối tượng, tính bằng pixel. Việc đặt trọng số thành một giá trị cao có thể dẫn đến việc cắt bớt gần đường viền thẻ thông tin.

Các 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 duy nhất. 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 chất giao hoán. Các tính năng và/hoặc phần tử được sửa đổi thông qua thao tác kiểu (thường) đã có kiểu hiện có. Các thao tác sẽ hành độ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

Bản đồ được tạo kiểu sử dụng mô hình hue, saturation, lightness (HSL) (tông màu, độ bão hoà, độ sáng) để biểu thị màu trong các thao tác của trình tạo kiểu. Tông màu cho biết màu cơ bản, độ bão hoà cho biết cường độ của màu đó và độ sáng cho biết lượng tương đối của màu trắng hoặc màu đen trong màu thành phần.

Chỉnh sửa gamma sửa đổi độ sáng trên không gian màu, thường là để tăng hoặc giảm độ tương phản. Ngoài ra, mô hình HSL xác định màu trong không gian toạ độ, trong đó hue cho biết hướng trong 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 khác nhau. Sắc độ được đo lường trong không gian màu RGB, tương tự như hầu hết các không gian màu RGB, ngoại trừ việc không có sắc thái màu trắng và màu đen.

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

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 – tức là hướng của màu đó xung quanh bánh xe màu, chứ không phải độ bão hoà hoặc độ sáng của màu đó. Các giá trị này được chỉ báo riêng biệt dưới dạng tỷ lệ phần trăm thay đổi.

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

Bánh xe màu RGB

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

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