การอ้างอิงรูปแบบ API ของแผนที่

คุณสามารถใช้ตัวเลือกรูปแบบเพื่อปรับแต่งการนำเสนอมาตรฐาน Google Maps คุณสามารถเปลี่ยนลักษณะขององค์ประกอบ เช่น ถนน สวนสาธารณะ ธุรกิจ และสถานที่ท่องเที่ยวอื่นๆ นอกจากการเปลี่ยน คุณลักษณะแผนที่เหล่านี้ คุณยังสามารถซ่อนคุณลักษณะแผนที่ทั้งหมดได้ด้วย วิธีนี้ช่วยให้ เพื่อทำสิ่งต่างๆ เช่น เน้นองค์ประกอบที่เจาะจงของแผนที่ หรือทำให้แผนที่ ช่วยเสริมรูปแบบของหน้าเว็บโดยรอบ

ตัวอย่าง

การประกาศรูปแบบ JSON ต่อไปนี้จะเปลี่ยนฟีเจอร์แผนที่ทั้งหมดเป็นสีเทา จากนั้น สีเรขาคณิตของถนนเส้นหลักเป็นสีน้ำเงิน และซ่อนป้ายชื่อแนวนอน ทั้งหมด:

[
  {
    "featureType": "all",
    "stylers": [
      { "color": "#C0C0C0" }
    ]
  },{
    "featureType": "road.arterial",
    "elementType": "geometry",
    "stylers": [
      { "color": "#CCFFFF" }
    ]
  },{
    "featureType": "landscape",
    "elementType": "labels",
    "stylers": [
      { "visibility": "off" }
    ]
  }
]

ออบเจ็กต์ JSON

การประกาศรูปแบบ JSON ประกอบด้วยองค์ประกอบต่อไปนี้

• featureType (ไม่บังคับ) - ฟีเจอร์ที่จะเลือก สำหรับการแก้ไขรูปแบบนี้ สถานที่คือลักษณะทางภูมิศาสตร์ใน แผนที่ รวมทั้งถนน สวนสาธารณะ แหล่งน้ำ และอื่นๆ หากคุณไม่ระบุ ฟีเจอร์ ฟีเจอร์ทั้งหมดจะถูกเลือก
• elementType (ไม่บังคับ) - คุณสมบัติขององค์ประกอบ ฟีเจอร์ที่ระบุให้เลือก องค์ประกอบคือส่วนย่อยของจุดสนใจ ซึ่งรวมถึง และเรขาคณิต หากคุณไม่ระบุองค์ประกอบ องค์ประกอบทั้งหมดของ องค์ประกอบ
• stylers - กฎที่จะใช้กับองค์ประกอบที่เลือกและ จากองค์ประกอบเหล่านี้ เครื่องมือจัดสไตล์จะระบุสี การแสดงผล และน้ำหนักของฟีเจอร์ คุณสามารถใช้ตัวจัดรูปแบบอย่างน้อย 1 รายการกับฟีเจอร์ได้

หากต้องการระบุรูปแบบ คุณต้องรวมชุดของ featureType และ ตัวเลือก elementType รายการและ stylers ของคุณลงในสไตล์ อาร์เรย์ คุณจะกำหนดเป้าหมายชุดค่าผสมของฟีเจอร์ใดก็ได้ในอาร์เรย์เดียว อย่างไรก็ตาม จำนวนรูปแบบที่คุณสามารถใช้พร้อมกันได้จะมีจำกัด หากสไตล์ของคุณ มีอักขระเกินจำนวนสูงสุด จึงไม่มีการใช้รูปแบบ

เนื้อหาที่เหลือในหน้านี้จะมีข้อมูลเพิ่มเติมเกี่ยวกับฟีเจอร์ องค์ประกอบ และ ตัวจัดรูปแบบ

featureType

ข้อมูลโค้ด JSON ต่อไปนี้เลือกถนนทั้งหมดบนแผนที่

{
  "featureType": "road"
}

สถานที่หรือประเภทของสถานที่ คือลักษณะทางภูมิศาสตร์บนแผนที่ รวมทั้งถนน สวนสาธารณะ แหล่งน้ำ ธุรกิจ และอื่นๆ

ฟีเจอร์ต่างๆ จะทําให้เกิดโครงสร้างหมวดหมู่ โดยมี all เป็นราก หากคุณไม่ระบุฟีเจอร์ ระบบจะเลือกฟีเจอร์ทั้งหมด การระบุฟีเจอร์ของ all จะมีผลเหมือนกัน

ฟีเจอร์บางอย่างจะมีฟีเจอร์ย่อยที่คุณระบุโดยใช้จุด เช่น landscape.natural หรือ road.local หากคุณระบุเฉพาะฟีเจอร์หลัก เช่น road สไตล์ที่คุณระบุให้กับรายการหลักจะใช้กับ รายการย่อยทั้งหมด เช่น road.local และ road.highway

โปรดทราบว่าฟีเจอร์หลักอาจมีองค์ประกอบบางอย่างที่ไม่ได้รวมไว้ ในฟีเจอร์ย่อยทั้งหมด

ฟีเจอร์ที่ใช้ได้มีดังนี้

• all (ค่าเริ่มต้น) เลือกฟีเจอร์ทั้งหมด
• administrative เลือกเขตบริหารทั้งหมด การจัดรูปแบบ มีผลเฉพาะกับป้ายกำกับของเขตบริหาร โดยไม่ส่งผลทางภูมิศาสตร์ เส้นขอบหรือสีเติม
  • administrative.country เลือกประเทศ
  • administrative.land_parcel เลือกแปลงที่ดิน
  • administrative.locality จะเลือกย่าน
  • administrative.neighborhood เลือกย่านใกล้เคียง
  • administrative.province เลือกจังหวัด
• landscape เลือกภาพทิวทัศน์ทั้งหมด
  • landscape.man_made เลือกองค์ประกอบที่มนุษย์สร้างขึ้น เช่น สิ่งปลูกสร้างและอื่นๆ เหล่านี้
  • landscape.natural เลือกองค์ประกอบทางธรรมชาติ เช่น ภูเขา แม่น้ำ ทะเลทราย และธารน้ำแข็ง
  • landscape.natural.landcover เลือกองค์ประกอบสิ่งปกคลุมดิน ซึ่งก็คือวัสดุที่จับต้องได้ ที่ปกคลุมพื้นผิวโลก เช่น ป่า ทุ่งหญ้า พื้นที่ชุ่มน้ำ และพื้นราบ
  • landscape.natural.terrain เลือกลักษณะภูมิประเทศของพื้นผิวดิน เช่น ระดับความสูง ความชัน และการวางแนว
• poi เลือกจุดที่น่าสนใจทั้งหมด
  • poi.attraction เลือกสถานที่ท่องเที่ยว
  • poi.business เลือกธุรกิจ
  • poi.government เลือกอาคารหน่วยงานราชการ
  • poi.medical เลือกบริการช่วยเหลือฉุกเฉิน รวมถึง โรงพยาบาล ร้านขายยา ตำรวจ แพทย์ และอื่นๆ
  • poi.park เลือกสวนสาธารณะ
  • poi.place_of_worship เลือกศาสนสถาน รวมถึง โบสถ์ วัด มัสยิด และอื่นๆ
  • poi.school เลือกโรงเรียน
  • poi.sports_complex เลือกศูนย์กีฬา
• road เลือกถนนทุกสาย
  • road.arterial เลือกถนนสายหลัก
  • road.highway เลือกทางหลวง
  • road.highway.controlled_access เลือกทางหลวงที่มี ที่ควบคุมการเข้าถึง
  • road.local เลือกโลคัลโร้ด
• transit เลือกสถานีขนส่งและสายทั้งหมด
  • transit.line จะเลือกเส้นทางขนส่งสาธารณะ
  • transit.station เลือกสถานีขนส่งทั้งหมด
  • transit.station.airport เลือกสนามบิน
  • transit.station.bus เลือกป้ายรถประจำทาง
  • transit.station.rail เลือกสถานีรถไฟ
• water เลือกน้ำ

elementType

ข้อมูลโค้ด JSON ต่อไปนี้จะเลือกป้ายกำกับสำหรับโลคัลโร้ดทั้งหมด

{
  "featureType": "road.local",
  "elementType": "labels"
}

องค์ประกอบคือการแยกย่อยของสถานที่ ถนน เช่น ประกอบด้วยเส้นกราฟิก (เรขาคณิต) บนแผนที่ และข้อความ ที่แสดงถึงชื่อ (ป้ายกำกับ)

มีองค์ประกอบต่อไปนี้ให้ใช้งาน แต่โปรดทราบว่าฟีเจอร์บางอย่าง อาจไม่สนับสนุนองค์ประกอบบางอย่าง บางส่วน หรือทั้งหมด:

• all (ค่าเริ่มต้น) เลือกองค์ประกอบทั้งหมดของฟีเจอร์ที่ระบุ
• geometry เลือกองค์ประกอบทางเรขาคณิตทั้งหมดของที่ระบุ
  • geometry.fill เลือกเฉพาะการเติมสีองค์ประกอบ เรขาคณิต
  • geometry.stroke เลือกเฉพาะเส้นโครงร่างของ เรขาคณิต
• labels เลือกป้ายกำกับข้อความที่เชื่อมโยงกับ ฟีเจอร์ที่ระบุ
  • labels.icon จะเลือกเฉพาะไอคอนที่แสดงภายใน ของฟีเจอร์
  • labels.text จะเลือกเฉพาะข้อความของป้ายกำกับ
  • labels.text.fill จะเลือกเฉพาะการเติมป้ายกำกับ ปกติ ที่เติมป้ายกำกับจะแสดงเป็นเค้าร่างสี ล้อมรอบข้อความป้ายกำกับ
  • labels.text.stroke จะเลือกเฉพาะเส้นโครงร่างของป้ายกำกับ ข้อความ

stylers

เครื่องมือจัดรูปแบบคือตัวเลือกการจัดรูปแบบที่คุณสามารถใช้กับคุณลักษณะแผนที่และ จากองค์ประกอบเหล่านี้

ข้อมูลโค้ด JSON ต่อไปนี้แสดงฟีเจอร์เป็นสีเขียวสดใสโดยใช้ ค่า RGB:

"stylers": [
  { "color": "#99FF33" }
]

ข้อมูลโค้ดนี้จะตัดความเข้มทั้งหมดออกจากสีของสถานที่ โดยไม่คำนึงถึง เป็นสีเริ่มต้น เอฟเฟ็กต์คือการแสดงภาพจุดสนใจในโทนสีเทา

"stylers": [
  { "saturation": -100 }
]

ข้อมูลโค้ดนี้จะซ่อนฟีเจอร์ทั้งหมด

    "stylers": [
      { "visibility": "off" }
    ]

ระบบรองรับตัวเลือกรูปแบบดังต่อไปนี้

• hue (สตริงฐานสิบหก RGB ของรูปแบบ #RRGGBB) หมายถึงสีพื้นฐาน

  หมายเหตุ: ตัวเลือกนี้จะกำหนดโทนสีโดยที่ยังคงความอิ่มตัวและความสว่างไว้ ตามสไตล์เริ่มต้นของ Google (หรือในตัวเลือกรูปแบบอื่นๆ ที่ระบุบนแผนที่) สีที่ได้จะสัมพันธ์กับรูปแบบของ แผนที่ฐาน ถ้า Google ทำการเปลี่ยนแปลงใดๆ กับรูปแบบแผนที่ฐาน การเปลี่ยนแปลงนั้น ส่งผลต่อสถานที่ในแผนที่ของคุณที่จัดรูปแบบด้วย hue คุณควร ใช้เครื่องมือจัดรูปแบบ color สัมบูรณ์ หากทำได้

• lightness (ค่าทศนิยมระหว่าง -100 และ 100) ระบุเปอร์เซ็นต์การเปลี่ยนแปลงความสว่างของ ค่าลบจะเพิ่มความมืด (โดยที่ -100 จะระบุสีดำ) ขณะที่ค่าบวกจะเพิ่มความสว่าง (โดยที่ +100 ระบุเป็นสีขาว)

  หมายเหตุ: ตัวเลือกนี้จะตั้งค่าความสว่างโดยคงความอิ่มตัวและโทนสี ตามสไตล์เริ่มต้นของ Google (หรือในตัวเลือกรูปแบบอื่นๆ ที่ระบุบนแผนที่) สีที่ได้จะสัมพันธ์กับรูปแบบของ แผนที่ฐาน ถ้า Google ทำการเปลี่ยนแปลงใดๆ กับรูปแบบแผนที่ฐาน การเปลี่ยนแปลงนั้น ส่งผลต่อสถานที่ในแผนที่ของคุณที่จัดรูปแบบด้วย lightness ดีกว่า เพื่อใช้เครื่องมือจัดรูปแบบ color สัมบูรณ์ หากทำได้

• saturation (ค่าทศนิยมระหว่าง -100 และ 100) ระบุเปอร์เซ็นต์การเปลี่ยนแปลงความเข้มของ สีพื้นฐานเพื่อนำไปใช้กับองค์ประกอบ

  หมายเหตุ: ตัวเลือกนี้จะตั้งค่าความอิ่มตัวของสีโดยที่ยังคงโทนสีและความสว่างไว้ ตามสไตล์เริ่มต้นของ Google (หรือในตัวเลือกรูปแบบอื่นๆ ที่ระบุบนแผนที่) สีที่ได้จะสัมพันธ์กับรูปแบบของ แผนที่ฐาน ถ้า Google ทำการเปลี่ยนแปลงใดๆ กับรูปแบบแผนที่ฐาน การเปลี่ยนแปลงนั้น ส่งผลต่อสถานที่ในแผนที่ของคุณที่จัดรูปแบบด้วย saturation ตอนนี้ ควรใช้รูปแบบสัมบูรณ์ของ color หากเป็นไปได้

• gamma (ค่าทศนิยมระหว่าง 0.01 ถึง 10.0 โดยที่ 1.0 ไม่มีการแก้ไข) ปริมาณการแก้ไขแกมมาที่จะนำไปใช้กับองค์ประกอบ การแก้ไขค่าแกมมา ปรับความสว่างของสีได้แบบไม่เป็นเชิงเส้น ในขณะที่ไม่ส่งผลกระทบต่อ เป็นสีขาวหรือสีดำ การแก้ไขค่า Gamma มักใช้เพื่อแก้ไขค่า คอนทราสต์ขององค์ประกอบที่หลากหลาย เช่น สามารถแก้ไขแกมมาเป็น เพิ่มหรือลดคอนทราสต์ระหว่างขอบและภายในของ จากองค์ประกอบเหล่านี้

  หมายเหตุ: ตัวเลือกนี้จะปรับความสว่างตามค่าเริ่มต้นของ Google โดยใช้เส้นโค้งแกมมา ถ้า Google ทำการเปลี่ยนแปลงใดๆ กับแผนที่ฐาน การเปลี่ยนแปลงจะส่งผลต่อสถานที่ในแผนที่ของคุณ ซึ่งมีการจัดรูปแบบด้วย gamma ขอแนะนำให้ใช้ color สัมบูรณ์ ได้

• invert_lightness (หากเป็น true) จะกลับค่าความสว่างเดิม ซึ่งจะเป็นประโยชน์ เช่น สำหรับ สลับเป็นแผนที่สีเข้มขึ้นพร้อมข้อความสีขาว

  หมายเหตุ: ตัวเลือกนี้จะสลับรูปแบบเริ่มต้นของ Google หาก Google ดำเนินการเปลี่ยนแปลงใดๆ กับรูปแบบแผนที่ฐาน การเปลี่ยนแปลงนั้นจะส่งผลต่อ สถานที่สไตล์ invert_lightness ตอนนี้ ควรใช้รูปแบบสัมบูรณ์ของ color หากเป็นไปได้

• visibility (on, off หรือ simplified) ระบุว่าองค์ประกอบจะปรากฏขึ้นหรือไม่และอย่างไร แผนที่ ระดับการเข้าถึง simplified จะนำฟีเจอร์ด้านรูปแบบบางรายการออก ฟีเจอร์ที่ได้รับผลกระทบ เช่น ถนนจะเล็กลง เส้นที่ไม่มีเส้นขอบ ขณะที่สวนสาธารณะสูญเสียข้อความป้ายกำกับ แต่ยังคงรักษารหัสไว้ ไอคอนป้ายกำกับ
• color (สตริงฐานสิบหก RGB ของรูปแบบ #RRGGBB) กำหนดสีขององค์ประกอบ
• weight (ค่าจำนวนเต็มที่มากกว่าหรือเท่ากับ 0) น้ำหนักของฟีเจอร์ หน่วยเป็นพิกเซล การตั้งค่าน้ำหนักเป็นค่าสูงอาจ ส่งผลให้เกิดการตัดทอนใกล้ขอบของชิ้นส่วนแผนที่

กฎรูปแบบจะถูกนำไปใช้ตามลำดับที่คุณระบุ ไม่รวม หลายรายการให้เป็นการดำเนินการรูปแบบเดียว แต่ให้ระบุแต่ละองค์ประกอบ โดยเป็นรายการแยกต่างหากในอาร์เรย์รูปแบบ

หมายเหตุ: ลำดับเป็นสิ่งสำคัญ เนื่องจากการดำเนินการบางอย่างอาจไม่เปลี่ยนแปลง ฟีเจอร์ และ/หรือองค์ประกอบที่ได้รับการแก้ไขผ่านการดำเนินการรูปแบบ (โดยปกติ) อยู่แล้ว มีรูปแบบที่มีอยู่แล้ว การดำเนินการจะดำเนินการกับสไตล์ที่มีอยู่เหล่านั้น หากมี

โมเดลโทนสี ความอิ่มตัว และความสว่าง

แผนที่ที่มีการจัดรูปแบบจะใช้โทนสี โมเดลความอิ่มตัว ความสว่าง (HSL) เพื่อแสดงสีภายในตัวจัดรูปแบบ การดำเนินงาน โทนสีหมายถึงสีพื้นฐาน ความอิ่มตัว บ่งบอกความเข้มของสีนั้น และความสว่างจะระบุถึง ปริมาณสัมพัทธ์ของสีขาวหรือสีดำในสีส่วนประกอบ

แกมมา การแก้ไข จะปรับความสว่างเหนือพื้นที่สี โดยทั่วไป เพื่อเพิ่มหรือลดคอนทราสต์ นอกจากนี้ โมเดล HSL จะกำหนดสี ภายในพื้นที่พิกัดที่ hue ระบุการวางแนว ภายในวงล้อสี ขณะที่ความอิ่มตัวและความสว่างแสดงถึงแอมพลิจูด ไปตามแกนต่างๆ ระบบจะวัดโทนสีภายในพื้นที่สี RGB ซึ่งคล้ายกับพื้นที่สี RGB ส่วนใหญ่ ยกเว้นเฉดสีขาวและ ไม่มีสีดำ

แม้ว่า hue จะใช้ค่าสีแบบเลขฐาน 16 ของ HTML แต่จะใช้ค่านี้เท่านั้น เพื่อกำหนดสีพื้นฐาน กล่าวคือ การวางแนวรอบสี ไม่ใช่ความอิ่มตัวหรือความสว่าง ระบุแยกต่างหากเป็นเปอร์เซ็นต์การเปลี่ยนแปลง

ตัวอย่างเช่น คุณสามารถกำหนดโทนสีสำหรับสีเขียวบริสุทธิ์เป็น hue:0x00ff00 หรือ hue:0x000100 เฉดสีทั้ง 2 แบบ เหมือนกัน ทั้ง 2 ค่าจะชี้ไปยังสีเขียวบริสุทธิ์ในโมเดลสี HSL

วงล้อสี RGB

ค่า RGB hue ซึ่งประกอบด้วยสีแดง เขียว และน้ำเงินส่วนที่เท่ากัน ไม่ระบุโทนสี เนื่องจากค่าเหล่านั้นไม่ได้บ่งบอกถึงการวางแนวใน พื้นที่พิกัด HSL เช่น "#000000" (สีดำ), "#FFFFFF" (สีขาว) และเฉดสีเทาที่แท้จริง หากต้องการระบุว่าเป็นภาพสีดํา ขาว หรือเทา คุณต้อง นำ saturation ทั้งหมดออก (ตั้งค่าเป็น -100) และ ให้ปรับ lightness แทน

นอกจากนี้ เมื่อแก้ไขสถานที่ที่มีอยู่ซึ่งมีสีอยู่แล้ว สคีม การเปลี่ยนค่า เช่น hue จะไม่เปลี่ยนแปลงค่าที่มีอยู่ saturationหรือlightness