---
title: "การสร้าง District Object บนแผนที่"
description: "ตัวอย่างนี้จะแสดงวิธีการสร้าง District Object บนแผนที่ Longdo Map โดยใช้ Geocode"
canonical_url: "https://map.longdo.com/docs/v3/javascript/geometry/district-object/"
last_updated: "2026-09-16T19:39:20.053Z"
---

# การสร้าง District Object บนแผนที่

District Object ใช้วาดขอบเขตการปกครองที่ Longdo จัดเตรียมไว้ให้ ไม่ว่าจะเป็นจังหวัด อำเภอ หรือตำบล เป็น overlay แบบพื้นทึบหรือเส้นขอบบนแผนที่ โดยอ้างอิงด้วย geocode เหมาะสำหรับทำแผนที่ choropleth, dashboard ระดับภูมิภาค หรือใช้ไฮไลต์พื้นที่ใดพื้นที่หนึ่งเป็นการเฉพาะ โดยไม่ต้องเตรียมหรือดูแลข้อมูลขอบเขต polygon เอง

<map-demo preset="v3-district-object-1">



</map-demo>

## วิธีการสร้าง District Object

ตัวอย่างนี้จะแสดงขอบเขตของกรุงเทพมหานคร เนื่องจากมี geocode คือ `10`

```javascript
var object1 = new longdo.Overlays.Object('10', 'IG');
map.Overlays.load(object1); // สร้างขอบเขตของกรุงเทพมหานคร
```

> **หมายเหตุ:** id `'10'` คือ geocode ของเขตการปกครองที่ต้องการแสดง สามารถดาวน์โหลดรายการ geocode ทั้งหมดของจังหวัด อำเภอ และตำบลได้ [ที่นี่](https://map.longdo.com/download/geocode.csv)

## ตัวอย่างอื่น ๆ

### จังหวัดในภาคตะวันออก

จังหวัดในภาคตะวันออกมี geocode ขึ้นต้นด้วย `2`

```javascript
var object2 = new longdo.Overlays.Object('2_', 'IG');
map.Overlays.load(object2);
```

### เขตในกรุงเทพมหานคร

ขอบเขตของเขตต่าง ๆ ในกรุงเทพมหานคร (geocode 4 หลัก ขึ้นต้นด้วย `10`)

```javascript
var object3 = new longdo.Overlays.Object('10__', 'IG');
map.Overlays.load(object3);
```

### รวมหลายเขตการปกครอง

โหลดหลายขอบเขตพร้อมกันได้โดยคั่น geocode ด้วยเครื่องหมาย `;`

```javascript
var object4 = new longdo.Overlays.Object('610604;610607;610703;610704;610802', 'IG', {
  combine: true,
  simplify: 0.00005,
  ignorefragment: false
});
map.Overlays.load(object4);
```

- `combine` : รวมหลาย geocode ให้เป็น Object เดียว
- `simplify` : ระดับความละเอียดของขอบเขต ตั้งแต่ `0.00005` (ละเอียด) ถึง `0.001` (หยาบ)
- `ignorefragment` : ข้ามการโหลดชิ้นส่วนเล็ก ๆ ของ Object

> **ดูเพิ่มเติม:** [Overlays.Object Documentation](https://api.longdo.com/map3/doc.html#Overlays.Object)

### ใส่ option ต่าง ๆ ได้ โดยจะเหมือนกับ option ในการสร้าง Polygon

```javascript
var object5 = new longdo.Overlays.Object('12', 'IG', {
  title: 'นนทบุรี',
  label: 'นนทบุรี', // ข้อความบน object
  lineColor: '#888', // สีของเส้น
  fillColor: null // สีพื้นหลัง
});
map.Overlays.load(object5);
```

> **ดูเพิ่มเติม:** [GeometryOptions Documentation](https://api.longdo.com/map3/doc.html#GeometryOptions)

## ขั้นตอนการลบ Object Overlay

```javascript
map.Overlays.unload(object1);
```

<code-section src="/snippet/v3/javascript/geometry/district-object/script.js">



</code-section>