เผยแพร่แผนที่

เมื่อคุณสร้างรูปแบบแผนที่ และสร้างรูปแบบการแสดงผลข้อมูลของคุณได้เรียบร้อยแล้ว ต้องการนำไปใช้นำเสนอหรือสร้างแผนที่เว็บไซต์ สามารถใช้ประโยชน์จากการบริการ API Services ของ Map Style ได้ ซึ่งมีบริการ API Services หลากหลายรูปแบบ ดังต่อไปนี้

รูปแบบ API Service ที่เรียกใช้งานได้

• Get Style : ข้อมูลที่ได้รับจาก API Services เป็นข้อมูล JSON ซึ่งมีโครงสร้างตาม Maplibre Expression นักพัฒนาสามารถใช้ Map Style Services นำไปสร้างแผนที่เว็บไซต์ ให้สามารถมีปฏิสัมพันธ์ (Interactive) กับผู้ใช้งาน และประยุกต์ใช้กับการนำเสนอข้อมูลเชิงพื้นที่รูปต่างๆ ได้อย่างยืดหยุ่นและมีประสิทธิภาพ

• HTML : เมื่อทำการเรียก API Services ในส่วนของ HTML ผู้ใช้งานจะได้รับไฟล์ HTML ของแผนที่ที่ทำการสร้างขึ้น

• WMS : การบริการข้อมูลแผนที่ เพื่อให้ผู้ใช้เรียกดูแผนที่ได้ผ่านทางเว็บเบราเซอร์ หรือโปรแกรมภูมิสารสนเทศที่รองรับ เช่น Qgis ซึ่งจะได้ภาพแผนที่กลับมาในรูปแบบไฟล์ภาพ .png

• WMTS : การบริการข้อมูลแผนที่ ที่แสดงแสดงผลในรูปแบบไทล์ (Tiles) สามารถเรียกดูได้จากเว็บเบราเซอร์ หรือโปรแกรมภูมิสารสนเทศที่รองรับ เช่น Qgis เมื่อผู้ใช้ต้องการดูแผนที่ในบริเวณใด WMTS จะทำการเรียกใช้ไทล์ที่ต้องการเท่านั้น เพื่อมาประกอบกันเป็นภาพแผนที่

• TMS การบริการข้อมูลแผนที่ เมื่อผู้ใช้งานต้องการดูแผนที่ในบริเวณใด ระบบจะนำไทล์ที่เกี่ยวข้องมาประกอบกันเป็นภาพแผนที่ให้เราเห็น ซึ่งสามารถเรียกดูได้ผ่านเว็บเบราเซอร์ หรือโปรแกรมภูมิสารสนเทศ เช่น Qgis

• Map Embed : บริการแผนที่เว็บไซต์ที่สามารถนำไปแสดงผลบนเว็บไซต์ได้

ความแตกต่างของ Services

Services Name	ความแตกต่างของ Services
WMS	สร้างภาพแผนที่ทั้งภาพในแต่ละครั้งที่เรียกขอ เหมาะสำหรับแผนที่ขนาดเล็ก
WMTS	แบ่งแผนที่ออกเป็นไทล์ (Tiles) ขนาดเล็กๆ เมื่อมีการร้องขอแผนที่ เซิร์ฟเวอร์จะนำไทล์ที่เกี่ยวข้องมาประกอบกัน
TMS	ข้อมูลราสเตอร์ไทล์ (Raster Tiles) มีลักษณะคล้ายกับ WMTS เป็นการแบ่งแผนที่ออกเป็นไทล์ (Tiles) ขนาดเล็กๆ โครงสร้างข้อมูลค่อนข้างง่าย เหมาะสำหรับแผนที่ที่มีข้อมูลจำนวนมาก

ขั้นตอนการรับ API Service

เมื่อผู้ใช้งานมี API Key แล้วสามารถทำการแบ่งปัน API Services ของ Map Style ในรูปแบบต่างๆ ซึ่งสามารถดำเนินการได้ ดังต่อไปนี้

Map Studio> Style > Select Style > Share Style

1. คลิกที่ปุ่มจุด 3 จุด หรือคลิกที่ตัว Style ที่ต้องการเรียกใช้ API Service
2. เลือกที่ปุ่ม Share your style
3. เลือก API Keys สำหรับการ Share
4. ทำการคัดลอก API Service ที่ต้องการนำไปใช้

ขั้นตอนการเรียกใช้ JSON Style เบื้องต้น

เมื่อทำการคัดลอก Services URL สามารถนำไปเรียกใช้งานได้ โดยจากตัวอย่างเป็น HTML Text อย่างง่ายที่มีการใช้งานร่วมกับ MapLibre library ซึ่งจะเห็นได้ว่าที่ฟิลด์ style มีการกำหนด JSON Style Services พร้อมกับ API Key กำหนดตำแหน่งแสดงของแผนที่่ และค่าต่างๆ ได้อย่างง่าย

ตัวอย่างการเรียกใช้ Map Style

map-style.json showLineNumbers

<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8" />
  <title>Display a map</title>
  <meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no" />
  <script src="https://unpkg.com/[email protected]/dist/maplibre-gl.js"></script>
  <link href="https://unpkg.com/[email protected]/dist/maplibre-gl.css" rel="stylesheet" />
  <style>
    body {
      margin: 0;
      padding: 0;
    }

    #map {
      position: absolute;
      top: 0;
      bottom: 0;
      width: 100%;
    }
  </style>
</head>

<body>
  <div id="map"></div>
  <script>
    var map = new maplibregl.Map({
      container: "map", // container id
      style: "https://va-cdn-02.vallarismaps.com/core/api/styles/1.0-beta/styles/6731c530ae78b6d2972e1dd3?api_key={YOUR_API_KEY}", // style URL
      center: [0, 0], // starting position [lng, lat]
      zoom: 1 // starting zoom
    });
    map.addControl(new maplibregl.NavigationControl());
  </script>

</body>

</html>

ขั้นตอนการเรียกใช้ Services บน QGIS

เรียกใช้ WMS/WMTS นำไปแสดงผลบน QGIS

WMS/WMTS เป็นการเรียกแผนที่ฐานจาก Map Style Service ของ Vallaris Map Platform ที่มีมาตรฐานของ OGC ให้สามารถแสดงผลผ่านซอฟต์แวร์QGIS ได้

ผู้ใช้งานสามารถเรียกใช้ WMS หรือ WMTS ได้เมื่อทำการสร้าง Style เรียบร้อยแล้ว โดยบน QGIS มีวิธีการเชื่อมต่อดังต่อไปนี้

1. ไปที่แถบเมนู WMS/WMTS ที่อยู่ใน Panel Browser
2. คลิกขวาที่แถบ WMS/WMTS จากนั้นทำการคลิกที่แถบ New Connection
3. ตั้งชื่อการเชื่อมต่อ และนำ Service ที่ได้ทำการคัดลอกจาก Vallaris Maps Platfrom มาวางที่ URL
4. คลิกที่ปุ่ม OK
5. เมื่อทำการเชื่อมต่อ WMS/WMTS เรียบร้อยแล้วผู้ใช้งานสามารถคลิกขวาจากนั้นคลิกที่แถบเมนู Add Layer to Project หรือสามารถลากไปที่ Panel Layer ได้

เรียกใช้ Tiles Map Services (TMS) แสดงผลบน Qgis

ผู้ใช้งานสามารถทำการเรียกใช้ TMS Service ได้หลังจากทำการสร้าง Style แผนที่เรียบร้อยแล้ว โดยบน QGIS ผู้ใช้งานสามารถดำเนินการได้ดังนี้

1. ไปที่แถบเมนู XYZ Tiles ที่อยู่ใน Panel Browser
2. คลิกขวาที่แถบ XYZ Tiles จากนั้นทำการคลิกที่แถบ New Connection
3. ตั้งชื่อการเชื่อมต่อ และนำ Service ที่ได้ทำการคัดลอกจาก Vallaris Maps Platfrom มาวางที่ URL
4. ตั้งค่าระดับการซูมในการแสดงผลของ Tiles
5. คลิกที่ปุ่ม OK
6. เมื่อทำการเชื่อมต่อ XYZ Tiles เรียบร้อยแล้วผู้ใช้งานสามารถ คลิกขวาจากนั้นคลิกที่แถบเมนู Add Layer to Project หรือสามารถลากไปที่ Panel Layer ได้

tip

แถบ Browser บน QGIS สามารถเปิดได้ที่เมนู View > Panel > Browser