ตัวเลือกรูปแบบช่วยให้คุณปรับแต่งการนำเสนอรูปแบบแผนที่ Google มาตรฐานโดยเปลี่ยนการแสดงภาพของสถานที่ต่างๆ เช่น ถนน สวนสาธารณะ ธุรกิจ และสถานที่น่าสนใจอื่นๆ นอกจากการเปลี่ยนรูปแบบของฟีเจอร์เหล่านี้แล้ว คุณยังซ่อนฟีเจอร์ทั้งหมดได้ ซึ่งหมายความว่าคุณสามารถเน้นองค์ประกอบบางอย่างของแผนที่ หรือทำให้แผนที่ช่วยเสริมสไตล์ของหน้ารอบๆ ได้
ตัวอย่าง
การประกาศรูปแบบ 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
ไม่มีการแก้ไข) ระบุจำนวนการแก้ไขแกมมาที่จะใช้กับองค์ประกอบ การแก้ไขแกมมาจะปรับความสว่างของสีในรูปแบบที่ไม่เป็นเชิงเส้น โดยไม่ส่งผลต่อค่าสีขาวหรือสีดำ โดยทั่วไปแล้ว การแก้ไขค่าแกมมาจะใช้เพื่อแก้ไขคอนทราสต์ขององค์ประกอบหลายรายการ เช่น คุณอาจแก้ไขแกมมาเพื่อเพิ่มหรือลดคอนทราสต์ระหว่างขอบและภายในขององค์ประกอบได้หมายเหตุ: ตัวเลือกนี้จะปรับความสว่างให้สัมพันธ์กับสไตล์เริ่มต้นของ 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
ที่มีอยู่