MM Map Snippet API

Table of Contents

 

Overview

     Longdo Map Snippet เป็น feature ของ Longdo Map ที่จะช่วยสร้างรูปภาพแผนที่เป็นนามสกุลไฟล์ .png โดยท่านสามารถกำหนดค่าต่างๆของแผนที่ได้ดังนี้

  • ขนาดความสูงและความกว้างของรูปภาพ
  • ตำแหน่งจุดกึ่งกลางของภาพแผนที่โดยระบุเป็นค่า lat และ lon
  • ชนิดของแผนที่ (แผนที่โลก หรือ แผนที่ประเทศไทย เป็นต้น)
  • โหมดแผนที่ (แผนที่ที่แสดงไอคอนสถานที่, แผนที่แสดงเฉพาะเส้นถนน, แผนที่แสดงเส้นสีจราจร, แผนที่สีเทา เป็นต้น
  • ภาษาในการแสดงชื่อสถานที่ต่างๆ บนแผนที่
  • ระยะซูมของแผนที่
  • ข้อความใน popup ที่ชี้ไปยังจุดกึ่งกลางแผนที่
  • รวมถึงตำแหน่งสถานที่/หน่วยงานของท่าน, จุดนัดพบ, เส้นสี, พื้นที่, เส้นทางการเดินทางที่ระบบแนะนำ หรือระบุข้อความลงบนแผนที่ได้

     ซึ่งท่านสามารถนำภาพแผนที่ไปแสดงบนเว็บของท่านได้ง่ายๆ เพียงนำ code HTML ไปแปะในเว็บของท่านเท่านั้น ด้วยการใช้ img tag โดยระบุ src attribute ในการบอกถึง source ของรูปภาพเป็น Longdo Map Snippet URL (ในแบบ HTTP GET Method) ของรูปแผนที่ที่ต้องการแสดง โดยมีรูปแบบดังนี้

<img src="http://mmmap15.longdo.com/mmmap/snippet/index.php?parameters">

 

URL & Parameter usage

     URL ของ Longdo Map Snippet คือ

http://mmmap15.longdo.com/mmmap/snippet/index.php

     ท่านสามารถทำการส่ง request ผ่านทาง URL request หรือ HTTP Post Method ก็ได้ โดยกำหนดค่า parameter เหล่านี้มากับ request ด้วย

 

Map Parameters

  • width - ระบุตัวเลข เพื่อกำหนดขนาดความกว้างของรูปภาพ กำหนดค่าได้ไม่เกิน 2000 (หน่วยเป็น pixel) (Default: 500)
  • height - ระบุตัวเลข เพื่อกำหนดขนา้ดความสูงของรูปภาพ กำหนดค่าได้ไม่เกิน 2000 (หน่วยเป็น pixel) (Default: 400)
  • lat - ระบุตัวเลข เพื่อกำหนดค่า latitude เป็นจุดกึ่งกลางของภาพ (*ต้องกำหนด หากไม่ระบุพารามิเตอร์ marker หรือ line หรือ polygon หรือ text หรือ route, แต่หากมีการระบุพารามิเตอร์ดังกล่าว ระบบจะกำหนดตำแหน่งกึ่งกลางให้อัตโนมัติ ถ้าท่านไม่ระบุค่า lat,long)
  • long - ระบุตัวเลข เพื่อกำหนดค่า longitude เป็นจุดกึ่งกลางของภาพ (*ต้องกำหนด หากไม่ระบุพารามิเตอร์ marker หรือ line หรือ polygon หรือ text หรือ route, แต่หากมีการระบุพารามิเตอร์ดังกล่าว ระบบจะกำหนดตำแหน่งกึ่งกลางให้อัตโนมัติ ถ้าท่านไม่ระบุค่า lat,long)
  • map - กำหนดชนิดของแผนที่ โดยมีค่าที่สามารถกำหนดได้ดังนี้
    • ms22 - แผนที่ประเทศไทย (เป็นค่า Default)
    • epsg4326 - แผนที่โลก
    • epsg3857 - แผนที่โลกที่มี scale ใกล้เคียงความเป็นจริง
  • mode - กำหนดโหมดแผนที่ โดยมีค่าที่สามารถกำหนดได้ดังนี้
    • icons - แผนที่แสดงไอคอนของสถานที่ต่างๆ (เป็นค่า Default)
    • traffic+overlay - แผนที่แสดงเส้นสีจราจร
    • gray - แผนที่สีเทา
    • political - แผนที่แสดงเฉพาะขอบเขตตำบล อำเภอ จังหวัด
    • normal - แผนที่แสดงเฉพาะขอบเขตตำบล อำเภอ จังหวัด และ เส้นถนน
    • hydro - แผนที่พื้นฐาน (โล่งๆ)
    • osm - แผนที่แบบ OpenStreetMap
    • osm_opencycle - แผนที่แบบ OpenStreetMap ที่แสดงภูมิประเทศ (OpenCycle)
  • locale - กำหนดภาษาที่แสดงสถานที่ต่างๆ บนแผนที่ โดยมีค่าที่สามารถกำหนดได้ดังนี้
    • th - แสดงแผนที่ภาษาไทย (เป็นค่า Default)
    • en - แสดงแผนที่ภาษาอังกฤษ
    • ja - แสดงแผนที่ภาษาญี่ปุ่น
  • zoom - ระบุตัวเลข เพื่อกำหนดระยะซูมแผนที่ (Default: 7, แต่หากมีการระบุพารามิเตอร์ marker หรือ line หรือ polygon หรือ text หรือ route ระบบจะกำหนดระยะซูมที่เหมาะสมให้อัตโนมัติ ถ้าท่านไม่ระบุค่า zoom) โดยมีค่าที่สามารถกำหนดได้ดังนี้
    • 1 ถึง 15 - สำหรับแผนที่ประเทศไทย
    • 1 ถึง 20 - สำหรับแผนที่โลก
  • title - กำหนด title ของ Popup บนแผนที่ (จะไม่แสดงผล หากมีการระบุพารามิเตอร์ pinmark หรือ crossmark)
  • detail - กำหนดรายละเอียดที่ต้องการแสดงใน Popup บนแผนที่ (จะไม่แสดงผล หากไม่ระบุ title หรือมีการระบุพารามิเตอร์ pinmark หรือ crossmark)
  • pinmark - ระบุ "1" เพื่อกำหนดให้ปักหมุด ในตำแหน่งกึ่งกลางแผนที่ (Default: 0)
  • crossmark - ระบุ "1" เพื่อกำหนดให้แสดงเครื่องหมายบวก ในตำแหน่งกึ่งกลางแผนที่ (Default: 0)
  • refresh - ปกติภาพ snippet จะมีการ cache ผลลัพธ์ไว้ ซึ่งหากไม่ต้องการ (เช่นในกรณีแสดงแผนที่สภาพจราจร ที่ต้องเปลี่ยนแปลงตลอดเวลา) ให้ระบุค่าเป็น "1" (Default: 0)
  • marker - ระบุพารามิเตอร์ของ Marker เพื่อกำหนดค่าสำหรับการวาดรูปภาพ/ไอคอนบนแผนที่ (ดูเพิ่มเติม)
  • line - ระบุพารามิเตอร์ของ Line เพื่อกำหนดค่าสำหรับการวาดเส้นลงบนแผนที่ (ดูเพิ่มเติม)
  • polygon - ระบุพารามิเตอร์ของ Polygon เพื่อกำหนดค่าสำหรับการวาดโพลีกอนลงบนแผนที่ (ดูเพิ่มเติม)
  • text - ระบุพารามิเตอร์ของ Text เพื่อกำหนดค่าสำหรับการเขียนข้อความลงบนแผนที่ (ดูเพิ่มเติม)
  • route - ระบุพารามิเตอร์ของ Route เพื่อกำหนดค่าสำหรับการหาและวาดเส้นทางการเดินทางลงบนแผนที่ (ดูเพิ่มเติม)
  • key - ต้องระบุ MM Map API key เมื่อมีการกำหนดพารามิเตอร์ของ Route

 

โดยใช้เครื่องหมาย "&" เป็นตัวแบ่งพารามิเตอร์แต่ละตัว และ ใช้เครื่องหมาย "=" เป็นตัวแบ่งระหว่างชื่อพารามิเตอร์และค่าที่กำหนด เช่น

http://mmmap15.longdo.com/mmmap/snippet/index.php?width=200&height=300&map=epsg3857&mode=icons&locale=en&marker=position:14.435,100.5&marker=position:14,100.4;icon:http://mmmap15.longdo.com/mmmap/images/icons_big/bank.png&line=position:13.6,100.4|13.84,100.24|14.45,100.74;linewidth:3&polygon=position:13.7,100.5|13.85,100.14|14.435,100.714;linecolor:FF00CD;linewidth:3;fillcolor:red

 

Marker Parameters

  • position - กำหนดจุดพิกัดที่ต้องการแสดงรูปภาพ marker ลงบนแผนที่ โดยใช้เครื่องหมาย "," ในการคั่นค่า latitude และ longitude และหากใช้รูปไอคอนเดียวกันในการแสดงบนแผนที่ให้ใช้เครื่องหมาย "|" (เครื่องหมาย pipe) ในการคั่นพิกัดแต่ละจุด
โดยมีรูปแบบดังนี้

position:<latitude_1>,<longitude_1>|<latitude_2>,<longitude_2>|<latitude_3>,<longitude_3>|...

เช่น

position:13.6,100.4|13.84,100.24|14.45,100.74
  • icon - กำหนด path ของรูปภาพ marker (หาก path รูปที่กำหนดไม่ถูกต้อง ระบบจะแสดงรูป Default ให้เป็น , offsetX เป็น center และ offsetY เป็น bottom )
โดยมีรูปแบบดังนี้

icon:<image path URL>

เช่น

icon:http://mmmap15.longdo.com/mmmap/images/icons_big/bank.png
  • offsetX - กำหนดตำแหน่งของภาพที่จะวางบนตำแหน่ง latitude,longitude ที่กำหนด ในด้านแกน X (ซ้าย-ขวา) (ดูเพิ่มเติม)
  • offsetY - กำหนดตำแหน่งของภาพที่จะวางบนตำแหน่ง latitude,longitude ที่กำหนด ในด้านแกน Y (บน-ล่าง) (ดูเพิ่มเติม)
  • hidden - กำหนดเป็น "true" เพื่อสั่งไม่ให้แสดง marker (ใช้กรณีที่ต้องการกำหนดขอบเขตของภาพแผนที่ และให้ระบบคำนวณหาระยะซูมที่เหมาะสม) (Default: false)

    

โดยใช้เครื่องหมาย ";" เป็นตัวแบ่งพารามิเตอร์แต่ละตัว และ ใช้เครื่องหมาย ":" เป็นตัวแบ่งระหว่างชื่อพารามิเตอร์และค่าที่กำหนด เช่น

marker=position:13.6,100.4|13.84,100.24|14.45,100.74;icon:http://mmmap15.longdo.com/mmmap/images/icons_big/bank.png;offsetX:center;offsetY:bottom

marker=position:13.6,100.4|13.84,100.24|14.45,100.74;hidden:true;

 

Line Parameters

  • position - กำหนดจุดพิกัดที่ต้องการวาดเส้่น โดยใช้เครื่องหมาย "," ในการคั่นค่า latitude และ longitude และใช้เครื่องหมาย "|" (เครืีองหมาย pipe) ในการคั่นพิกัดแต่ละจุด
โดยมีรูปแบบดังนี้

position:<latitude_1>,<longitude_1>|<latitude_2>,<longitude_2>|<latitude_3>,<longitude_3>|...
เช่น position:13.6,100.4|13.84,100.24|14.45,100.74
  • linecolor - กำหนดสีของเส้น (ดูเพิ่มเติม) (Default: black)
  • linewidth - กำหนดขนาดของเส้น (หน่วยเป็น pixel) (Default: 1)

 

โดยใช้เครื่องหมาย ";" เป็นตัวแบ่งพารามิเตอร์แต่ละตัว และ ใช้เครื่องหมาย ":" เป็นตัวแบ่งระหว่างชื่อพารามิเตอร์และค่าที่กำหนด เช่น

line=position:13.6,100.4|13.84,100.24|14.45,100.74;linecolor:FF00CD;linewidth:3

 

Polygon Parameters

  • position - กำหนดจุดพิกัดที่ต้องการวาดโพลีกอน โดยใช้เครื่องหมาย "," ในการคั่นค่า latitude และ longitude และใช้เครื่องหมาย "|" (เครืีองหมาย pipe) ในการคั่นพิกัดแต่ละจุด
โดยมีรูปแบบดังนี้

position:<latitude_1>,<longitude_1>|<latitude_2>,<longitude_2>|<latitude_3>,<longitude_3>|...

เช่น

position:13.6,100.4|13.84,100.24|14.45,100.74
  • linewidth - กำหนดขนาดของเส้นขอบ (หน่วยเป็น pixel) (Default: 1)
  • linecolor - กำหนดสีของเส้นขอบ (ดูเพิ่มเติม) (Default: black)
  • fillcolor - กำหนดสีพื้น (ดูเพิ่มเติม) (Default: black)

 

โดยใช้เครื่องหมาย ";" เป็นตัวแบ่งพารามิเตอร์แต่ละตัว และ ใช้เครื่องหมาย ":" เป็นตัวแบ่งระหว่างชื่อพารามิเตอร์และค่าที่กำหนด เช่น

polygon=position:13.6,100.4|13.84,100.24|14.45,100.74;linecolor:FF00CD;linewidth:3;fillcolor:red

 

Text Parameters

  • position - กำหนดจุดพิกัดที่ต้องการแสดงข้อความลงบนแผนที่ โดยใช้เครื่องหมาย "," ในการคั่นค่า latitude และ longitude และหากใช้ข้อความเดียวกันในการแสดงบนแผนที่ให้ใช้เครื่องหมาย "|" (เครื่องหมาย pipe) ในการคั่นพิกัดแต่ละจุด
โดยมีรูปแบบดังนี้

position:<latitude_1>,<longitude_1>|<latitude_2>,<longitude_2>|<latitude_3>,<longitude_3>|...

เช่น

position:13.6,100.4|13.84,100.24|14.45,100.74
  • msg - กำหนดข้อความที่ต้องการแสดงบนแผนที่
  • color - กำหนดสีของตัวอักษร (ดูเพิ่มเติม) (Default: black)
  • bgcolor - กำหนดสีพื้นของตัวอักษร หากไม่กำหนดจะไม่แสดงสีพื้น (ดูเพิ่มเติม)
  • bordercolor - กำหนดสีกรอบของตัวอักษร หากไม่กำหนดจะใช้สีเดียวกับสีพื้นของตัวอักษร (ดูเพิ่มเติม)
  • offsetX - กำหนดตำแหน่งของข้อความที่จะวางบนตำแหน่ง latitude,longitude ที่กำหนด ในด้านแกน X (ซ้าย-ขวา) (ดูเพิ่มเติม)
  • offsetY - กำหนดตำแหน่งของข้อความที่จะวางบนตำแหน่ง latitude,longitude ที่กำหนด ในด้านแกน Y (บน-ล่าง) (ดูเพิ่มเติม)

 

โดยใช้เครื่องหมาย ";" เป็นตัวแบ่งพารามิเตอร์แต่ละตัว และ ใช้เครื่องหมาย ":" เป็นตัวแบ่งระหว่างชื่อพารามิเตอร์และค่าที่กำหนด เช่น

text=position:13.6,100.4;msg:show text;color:black;bgcolor:yellow;bordercolor:purple;offsetX:left;offsetY:top

  

Route Parameters

  • path - กำหนดพิกัดของจุดหมายที่ต้องการหาเส้นการเดินทาง โดยใช้สัญลักษณ์ "->" แสดงจุดต้นทาง ไปยังจุดหมายจุดต่อๆไป และ ใช้เครื่องหมาย "|" (เครื่องหมาย pipe) เป็นตัวคั่นแต่ละเส้นทาง ในกรณีที่มีจุดเริ่มต้นแยกจากกัน

โดยมีรูปแบบดังนี้

path:<latitude_from_1>,<longitude_from_1>-><latitude_to_1.1>,<longitude_to_1.1>-><latitude_to_1.2>,<longitude_to_1.2>->...|<latitude_from_2>,<longitude_from_2>-><latitude_to_2.1>,<longitude_to_2.1>-><latitude_to_2.2>,<longitude_to_2.2>->...|...

เช่น หากต้องการ

- หาเส้นทางจากตำแหน่ง 18.15107,97.94312 ไปยัง 16.72039,98.5968 และไปสิ้นสุดที่ 16.75195,100.2887 และ

- หาเส้นทางจากตำแหน่ง 16.86763,101.33789 ไปสิ้นสุดที่ 16.38339,101.12366

สามารถระบุได้เป็น

path:18.15107,97.94312->16.72039,98.5968->16.75195,100.2887|16.86763,101.33789->16.38339,101.12366

  • linecolor - กำหนดสีของเส้นทาง (ดูเพิ่มเติม) โดยสามารถกำหนดเส้นสีของแต่ละพาหนะได้ดังนี้
    • road - กำหนดสีของเส้นทางที่เดินทางบนถนน (Default: gray)
    • air - กำหนดสีของเส้นทางที่เดินทางทางเครื่องบิน (Default: purple)
    • rail - กำหนดสีของเส้นทางที่เดินทางทางรถไฟ (Default: brown)
    • ferry - กำหนดสีของเส้นทางที่เดินทางทางเรือเฟอร์รี่ (Default: lightblue)
    • tollroad - กำหนดสีของเส้นทางที่เดินทางบนทางด่วน (Default: red)
    • other - กำหนดสีของเส้นทางอื่นๆ ที่นอกเหนือจากที่กำหนด (Default: black)

โดยใช้สัญลักษณ์ "[" และ "]" ครอบพารามิเตอร์ข้างต้น และ ใช้เครื่องหมาย "|" (เครื่องหมาย pipe) เป็นตัวแบ่งประเภทพาหนะแต่ละตัว และ ใช้เครื่องหมาย ":" เป็นตัวแบ่งระหว่างชื่อพารามิเตอร์และค่าที่กำหนด

มีรูปแบบดังนี้

- linecolor:<color> หรือ

- linecolor:[<type_name_1>:<color>|<type_name_2>:<color>|...]

เช่น

- linecolor:pink (กำหนดสีเส้นของทุกพาหนะเป็นสีชมพู)

- linecolor:[road:purple|ferry:pink|air:lightblue]; (กำหนดสีเส้นของเส้นทางบนถนนเป็นสีม่วง, เรือเฟอร์รี่เป็นสีชมพู, เครื่องบินเป็นสีฟ้าอ่อน, นอกนั้นเป็นสี Default)

- linecolor:[road:purple|ferry:pink|other:gray]; (กำหนดสีเส้นของเส้นทางบนถนนเป็นสีม่วง, เรือเฟอร์รี่เป็นสีชมพู, นอกนั้นเป็นสีเทา)

  • linewidth - กำหนดขนาดของเส้นทาง (หน่วยเป็น pixel) (Default: 5) โดยสามารถกำหนดขนาดของเส้นของแต่ละพาหนะได้ดังนี้
    • road - กำหนดขนาดของเส้นทางที่เดินทางบนถนน
    • air - กำหนดขนาดของเส้นทางที่เดินทางทางเครื่องบิน
    • rail - กำหนดขนาดของเส้นทางที่เดินทางทางรถไฟ
    • ferry - กำหนดขนาดของเส้นทางที่เดินทางทางเรือเฟอร์รี่
    • tollroad - กำหนดขนาดของเส้นทางที่เดินทางบนทางด่วน
    • other - กำหนดขนาดของเส้นทางอื่นๆ ที่นอกเหนือจากที่กำหนด

โดยใช้สัญลักษณ์ "[" และ "]" ครอบพารามิเตอร์ข้างต้น และ ใช้เครื่องหมาย "|" (เครื่องหมาย pipe) เป็นตัวแบ่งประเภทพาหนะแต่ละตัว และ ใช้เครื่องหมาย ":" เป็นตัวแบ่งระหว่างชื่อพารามิเตอร์และค่าที่กำหนด

มีรูปแบบดังนี้

- linewidth:<line_width> หรือ

- linewidth:[<type_name_1>:<line_width>|<type_name_2>:<line_width>|...]

เช่น

- linewidth:3 (กำหนดขนาดเส้นของทุกพาหนะเป็น 3 พิกเซล)

- linewidth:[road:3|ferry:2|air:3]; (กำหนดขนาดเส้นของเส้นทางบนถนนเป็น 3 พิกเซล, เรือเฟอร์รี่เป็น 2 พิกเซล, เครื่องบินเป็น 3 พิกเซล, นอกนั้นเป็นขนาด Default)

- linewidth:[road:3|ferry:2|other:3]; (กำหนดขนาดเส้นของเส้นทางบนถนนเป็น 3 พิกเซล, เรือเฟอร์รี่เป็น 2 พิกเซล, นอกนั้นเป็น 3 พิกเซล)

  • mode - กำหนดโหมดในการค้นหาเส้นทางการเดินทาง โดยมีค่าที่สามารถกำหนดได้ดังนี้
    • t - ค้นหาเส้นทางตามถนนหลัก โดยพยายามหลบรถติด (traffic)
    • c - ค้นหาเส้นทางตามถนนหลัก (cost)
    • d - ค้นหาเส้นทางลัดเข้าซอยเพื่อให้ได้ระยะทางที่สั้นที่สุด (distance)
  • type - ระบุตัวเลข เพื่อกำหนดประเภทพาหนะในการเดินทาง โดยมีค่าที่สามารถกำหนดได้ดังนี้
    • 1 - พาหนะที่ใช้การเดินทางบนถนน
    • 2 - เครื่องบิน
    • 4 - รถไฟ
    • 8 - เรือ
    • 16 - พาหนะที่ใช้การเดินทางบนทางด่วน
หากต้องการระบุพาหนะหลายประเภท ให้นำค่าของแต่ละประเภทมา OR กัน เช่น

- type:1 (ต้องการหาเส้นทางการเดินทางทางถนนเท่านั้น)
- type:3 (ต้องการหาเส้นทางการเดินทางทางถนนและเครื่องบินเท่านั้น คือ 1|2 = 3)
- type:17 (ต้องการหาเส้นทางการเดินทางทางถนนและทางด่วนเท่านั้น คือ 1|16 = 17)
- type:31 (ต้องการหาเส้นทางการเดินทางทุกประเภท คือ 1|2|4|8|16 = 31)

 

โดยใช้เครื่องหมาย ";" เป็นตัวแบ่งพารามิเตอร์แต่ละตัว และ ใช้เครื่องหมาย ":" เป็นตัวแบ่งระหว่างชื่อพารามิเตอร์และค่าที่กำหนด เช่น

route=path:18.15107,97.94312->16.72039,98.5968->16.75195,100.2887|16.86763,101.33789->16.38339,101.12366;linecolor:[ferry:pink|air:lightblue|rail:brown|other:black];linewidth:[road:3|tollroad:3|other:5];mode:t;type:31

หรือ

route=path:18.15107,97.94312->16.72039,98.5968->16.75195,100.2887|16.86763,101.33789->16.38339,101.12366;linecolor:FF9FEB;linewidth:3;mode:t;type:31

 

Parameter format

Color

  • ระบุรหัสสี ในรูปแบบ "RRGGBB" เช่น FFF (สีขาว), 000 (สีดำ), FFABDE (สีชมพู) เป็นต้น
  • ระบุชื่อสีได้ทั้งหมด 12 สี ดังนี้
    • red - สีแดง
    • black - สีดำ
    • lightblue - สีฟ้า
    • blue - สีน้ำเงิน
    • white - สีขาว
    • brown - สีน้ำตาล
    • yellow - สีเหลือง
    • pink - สีชมพู
    • purple - สีม่วง
    • orange - สีส้ม
    • green - สีเขียว
    • gray - สีเทา
โดยมีรูปแบบดังนี้

<parameter_name>:<color>

เช่น

linecolor:red หรือ linecolor:FF00CC หรือ linecolor:333 (= linecolor:333333) หรือ linecolor:ABC (= linecolor:AABBCC)

 

OffsetX

  • ระบุตัวเลข มีหน่วยเป็น pixel
    • -x - หากระบุค่าติดลบ marker หรือ ข้อความ จะเลื่อนจากตำแหน่งที่กำหนดไปทางขวา x พิกเซลนับจากด้านซ้าย
    • x - marker หรือ ข้อความ จะเลื่อนจากตำแหน่งที่กำหนดไปทางซ้าย x พิกเซลนับจากด้านซ้าย
  • ระบุชื่อตำแหน่งได้ดังนี้
    • left - วาง marker หรือ ข้อความ โดยให้ ด้านซ้ายของ marker หรือ ข้อความ ตรงกับตำแหน่งที่กำหนด
    • center - วาง marker หรือ ข้อความ โดยให้กึ่งกลางของ marker หรือ ข้อความในแนวนอน ตรงกับตำแหน่งที่กำหนด (เป็นค่า Default)
    • right - วาง marker หรือ ข้อความ โดยให้ด้านขวาของ marker หรือ ข้อความ ตรงกับตำแหน่งที่กำหนด
โดยมีรูปแบบดังนี้

offsetX:<offset_x>

เช่น

offsetX:5 หรือ offsetX:left

 

OffsetY

  • ระบุตัวเลข มีหน่วยเป็น pixel
    • -x - หากระบุค่าติดลบ marker หรือ ข้อความ จะเลื่อนจากตำแหน่งที่กำหนดลงมา x พิกเซลนับจากด้านบน
    • x - หากระบุค่าบวก marker หรือ ข้อความ จะเลื่อนจากตำแหน่งที่กำหนดขึ้นไป x พิกเซลนับจากด้านบน
  • ระบุชื่อตำแหน่งได้ดังนี้
    • top - วาง marker หรือ ข้อความ โดยให้ด้านบนของ marker หรือ ข้อความ ตรงกับตำแหน่งที่กำหนด
    • middle - วาง marker หรือ ข้อความ โดยให้กึ่งกลางของ marker หรือ ข้อความในแนวดิ่ง ตรงกับตำแหน่งที่กำหนด (เป็นค่า Default)
    • bottom - วาง marker หรือ ข้อความ โดยให้ด้านล่างของ marker หรือ ข้อความ ตรงกับตำแหน่งที่กำหนด
โดยมีรูปแบบดังนี้

offsetY:<offset_y>

เช่น

offsetY:5 หรือ offsetY:bottom