GeoJSON
Geometry Types
GeoJSON 支援以下幾種幾何類型:
- Point (點)
- LineString (線)
- Polygon (多邊形)
- MultiPoint (多點)
- MultiLineString (多線)
- MultiPolygon (多多邊形)
- GeometryCollection (幾何集合)
使用 https://geojson.io/ 來視覺化 GeoJSON
- Point (點)
{
"type": "FeatureCollection",
"features": [
{
"type": "Feature",
"geometry": {
"type": "Point",
"coordinates": [
121.5654,
25.033
]
},
"properties": {
"name": "台北 101"
}
}
]
}
- LineString (線)
{
"type": "FeatureCollection",
"features": [
{
"type": "Feature",
"geometry": {
"type": "LineString",
"coordinates": [
[
121.5169,
25.0479
],
[
121.5177,
25.0346
],
[
121.5186,
25.021
]
]
},
"properties": {
"name": "捷運路線片段"
}
}
]
}
- Polygon (多邊形)
{
"type": "FeatureCollection",
"features": [
{
"type": "Feature",
"geometry": {
"type": "Polygon",
"coordinates": [
[
[
121.5169,
25.0479
],
[
121.5177,
25.0346
],
[
121.53,
25.035
],
[
121.528,
25.049
],
[
121.5169,
25.0479
]
]
]
},
"properties": {
"name": "北車附近"
}
}
]
}
- MultiPoint (多點)
{
"type": "FeatureCollection",
"features": [
{
"type": "Feature",
"geometry": {
"type": "MultiPoint",
"coordinates": [
[
121.5654,
25.033
],
[
121.5455,
25.042
],
[
121.5762,
25.029
]
]
},
"properties": {
"name": "多個景點"
}
}
]
}
- MultiLineString (多線)
{
"type": "FeatureCollection",
"features": [
{
"type": "Feature",
"geometry": {
"type": "MultiLineString",
"coordinates": [
[
[
121.517,
25.048
],
[
121.528,
25.049
],
[
121.538,
25.051
]
],
[
[
121.5177,
25.0346
],
[
121.525,
25.037
],
[
121.53,
25.039
]
]
]
},
"properties": {
"name": "台北捷運多條線路",
"lines": [
"紅線部分(非精確)",
"藍線部分(非精確)"
]
}
}
]
}
- MultiPolygon (多多邊形)
{
"type": "FeatureCollection",
"features": [
{
"type": "Feature",
"geometry": {
"type": "MultiPolygon",
"coordinates": [
[
[
[
121.517,
25.048
],
[
121.528,
25.049
],
[
121.53,
25.035
],
[
121.517,
25.048
]
]
],
[
[
[
121.55,
25.06
],
[
121.56,
25.065
],
[
121.565,
25.055
],
[
121.55,
25.06
]
]
]
]
},
"properties": {
"name": "台北市多個行政區",
"districts": [
"北車附近",
"松山機場附近"
]
}
}
]
}
- GeometryCollection (幾何集合)
{
"type": "FeatureCollection",
"features": [
{
"type": "Feature",
"geometry": {
"type": "GeometryCollection",
"geometries": [
{
"type": "Point",
"coordinates": [
121.5654,
25.033
]
},
{
"type": "LineString",
"coordinates": [
[
121.5654,
25.033
],
[
121.5177,
25.0346
]
]
},
{
"type": "Polygon",
"coordinates": [
[
[
121.53,
25.035
],
[
121.538,
25.051
],
[
121.55,
25.06
],
[
121.53,
25.035
]
]
]
}
]
},
"properties": {
"name": "台北市觀光資訊",
"description": "包含景點、路線和區域"
}
}
]
}
GeoJSON 的 TypeScript 定義
// 座標系統：經度、緯度（可選高度）
type Position =
| [longitude: number, latitude: number]
| [longitude: number, latitude: number, altitude: number];
// 幾何類型
interface Point {
type: "Point";
coordinates: Position;
bbox?: number[];
}
interface LineString {
type: "LineString";
coordinates: Position[];
bbox?: number[];
}
interface Polygon {
type: "Polygon";
coordinates: Position[][];
bbox?: number[];
}
interface MultiPoint {
type: "MultiPoint";
coordinates: Position[];
bbox?: number[];
}
interface MultiLineString {
type: "MultiLineString";
coordinates: Position[][];
bbox?: number[];
}
interface MultiPolygon {
type: "MultiPolygon";
coordinates: Position[][][];
bbox?: number[];
}
interface GeometryCollection {
type: "GeometryCollection";
geometries: Geometry[];
bbox?: number[];
}
type Geometry =
| Point
| LineString
| Polygon
| MultiPoint
| MultiLineString
| MultiPolygon
| GeometryCollection;
// 特徵屬性
interface GeoJsonProperties {
[key: string]: any;
}
// Feature 物件
interface Feature {
type: "Feature";
geometry: Geometry | null;
properties: GeoJsonProperties | null;
id?: string | number | null;
bbox?: number[];
}
// FeatureCollection 物件
interface FeatureCollection {
type: "FeatureCollection";
features: Feature[];
bbox?: number[];
}
// GeoJSON 總型別
type GeoJSON = Geometry | Feature | FeatureCollection;