หน้าเว็บ

13 พ.ย. 2557

มาแต่ง Google Map กันเถอะ [part 1 - ลองเล่น Google Maps API Styled Map Wizard กัน]

วันนี้ไปเจอของดีของ Google มาเลยอยากจะเอามาเผยแพร่ให้สาธารณชนได้ลองใช้กัน เชื่อว่าหลายคนยังไม่รู้จัก "Google Maps API Styled Map Wizard" อร้ายยย อยากจะบอกว่าปลื้มมากกกก เบื่อหน้าตา Google Map แบบเดิมจะตายอยู่แล้ว มาลองเปลี่ยนสีสันให้เป็นไปตามรูปแบบและสไตล์ของ Map ให้เป็นไปตามเว็บของเราดีกว่า เพื่อความ Model //เกี่ยวมั้ย ^^


มาเริ่มกันเลยจ้าาา ~O~


ก่อนเริ่มตามลิ้งนี้ไปเลย >> Google Maps API Styled Map Wizard


เมื่อเปิดขึ้นมาจะพบกับหน้าตาแบบนี้






[[ ด้านซ้ายมือ Selectors เป็นเครื่องมือกำหนดลักษณะ ]]

1. Feature type - เป็นการกำหนดรูปแบบให้แผนที่ สามารถเลือกกำหนดลักษณได้เฉพาะส่วน เช่น ถนน, แม่น้ำ, สวนสาธารณะ

2. Stylers - กำหนดรูปแบบลักษณะที่แสดง ประกอบด้วย

    2.1 Visibility - เป็นการกำหนดเส้นขอบ

    2.2 Invert lightness - กลับค่าการแสดง

    2.3 Color - สี โดยกำหนดค่าเป็น RGB

    2.4 Weight - ความหนา

    2.5 Hue - ค่าสี (มันต่างจาก color ยังไงใครรู้ช่วยอธิบายเพิ่มให้ที ^^)

    2.6 Saturation - ค่าความอิ่มตัวของสี

    2.7 Lightness - ความสว่าง

    2.8 Gamma - ค่าแกมม่า

[[ด้านขาวมือ Map Style จะแสดงค่าที่เรากำหนด]]
สามารถเพิ่มและดูโค้ดได้ในรูปแบบ JSON

Before
↓↓


เมื่อกำหนดค่าต่างๆ เรียบร้อยแล้วก็จะได้ Google Map หน้าตาใหม่ที่สวยงาม

After
↓↓


สวยปะหละ(แต่งไปเรื่อยหนะ YY) ลองไปเล่นดูนะคะเผื่อจะได้ Google Map ในแบบของตนเอง 


ไม่มีความคิดเห็น: