写给小白学习的地理信息的表示法GeoJSON

更新时间：2023年05月15日 11:25:01 作者：uccs

这篇文章主要为大家介绍了写给小白学习的地理信息的表示法GeoJSON的详细实例，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪

目录

简介

举例

空间行状

FeatureCollection
Feature

几何对象

Point
MultiPoint
LineString
MultiLineString
Polygon
MultiPolygon
GeometryCollection

可选属性

其他

coordinate
坐标参考系
在 ts 中使用

简介

GeoJSON 是一种使用 JSON 来编码各种地理数据结构的格式，是一种轻量级的数据交换格式，可以用来表示几何对象、属性数据、空间参考系统等信息

由两种对象组成：Geometry（几何对象）和 Feature（空间行状）

几何对象用来描述地理空间中的点、线、面等几何形状
空间行状用来描述一个有界的实体，包括几何对象和其他属性信息

几何对象类型有：

点：Point
多点：MultiPoint
线：LineString
多线：MultiLineString
面：Polygon
多面：MultiPolygon
几何集合：GeometryCollection

空间行状类型有：

空间行状：Feature
空间形状集合：FeatureCollection

举例

几何对象和空间行状可以相互嵌套

const GeoJSON = {
  type: "FeatureCollection",
  features: [
    {
      type: "Feature",
      geometry: { type: "Point", coordinates: [121.4737, 31.2304] },
      properties: { id: 1 },
    },
    {
      type: "Feature",
      geometry: { type: "Point", coordinates: [121.4837, 31.2504] },
      properties: { id: 2 },
    },
  ],
};

空间行状

FeatureCollection

FeatureCollection 是 Feature 对象的集合，用来表示一组 Feature 对象

由 type 和 features 两个属性组成：

type 属性的值为 FeatureCollection
features 属性的值为 Feature 对象的数组

const FeatureCollectionJSON = {
  type: "FeatureCollection",
  features: [feature],
};

Feature

Feature 对象用来表示几何对象的属性信息

由 type、geometry 和 properties 三个属性组成：

type 属性的值为 Feature，
geometry 属性的值为 Geometry 几何对象
properties 属性的值为属性对象（可选）

const FeatureJSON = {
  type: "Feature",
  geometry: { type: "Point", coordinates: [121.4737, 31.2304] },
  properties: { id: 1 },
};

几何对象

Point

Point 用来表示一个点

由 type 和 coordinates 两个属性组成：

type 属性的值为 Point
coordinates 属性的值为一个数组，数组的第一个元素为经度，第二个元素为纬度

const PointJSON = {
  type: "Point",
  coordinates: [121.4737, 31.2304],
};

MultiPoint

MultiPoint 用来表示多个点

由 type 和 coordinates 两个属性组成：

type 属性的值为 MultiPoint
coordinates 属性的值为一个数组，数组的每个元素都是一个点的坐标

const MultiPointJSON = {
  type: "MultiPoint",
  coordinates: [
    [121.4737, 31.2304],
    [121.4837, 31.2504],
  ],
};

LineString

LineString 用来表示一条线

由 type 和 coordinates 两个属性组成：

type 属性的值为 LineString
coordinates 属性的值为一个数组，数组的每个元素都是一个点的坐标

const LineStringJSON = {
  type: "LineString",
  coordinates: [
    [121.4737, 31.2304],
    [121.4837, 31.2504],
  ],
};

MultiLineString

MultiLineString 用来表示多条线

由 type 和 coordinates 两个属性组成：

type 属性的值为 MultiLineString
coordinates 属性的值为一个数组，数组的每个元素都是一个线的坐标数组

const MultiLineStringJSON = {
  type: "MultiLineString",
  coordinates: [
    [
      [121.4737, 31.2304],
      [121.4837, 31.2504],
    ],
    [
      [121.4727, 31.2314],
      [121.4827, 31.2514],
    ],
  ],
};

Polygon

Polygon 用来表示一个面

由 type 和 coordinates 两个属性组成：

type 属性的值为 Polygon
coordinates 属性的值为一个数组，数组的第一个元素为外环的坐标数组，后面的元素为内环的坐标数组

polygon 的坐标数组的第一个元素和最后一个元素是相同的，表示闭合

const PolygonJSON = {
  type: "Polygon",
  coordinates: [
    [
      [121.4737, 31.2304],
      [121.4837, 31.2504],
      [121.4937, 31.2304],
      [121.4737, 31.2304],
    ],
    [
      [121.4717, 31.2314],
      [121.4827, 31.2524],
      [121.4937, 31.2334],
      [121.4757, 31.2344],
    ],
  ],
};

MultiPolygon

MultiPolygon 用来表示多个面

由 type 和 coordinates 两个属性组成：

type 属性的值为 MultiPolygon
coordinates 属性的值为一个数组，数组的每个元素都是一个面的坐标数组

const MultiPolygonJSON = {
  type: "MultiPolygon",
  coordinates: [
    [
      [
        [121.4737, 31.2304],
        [121.4837, 31.2504],
        [121.4937, 31.2304],
        [121.4737, 31.2304],
      ],
      [
        [121.4737, 31.2304],
        [121.4837, 31.2504],
        [121.4937, 31.2304],
        [121.4737, 31.2304],
      ],
    ],
    [
      [
        [121.4737, 31.2304],
        [121.4837, 31.2504],
        [121.4937, 31.2304],
        [121.4737, 31.2304],
      ],
      [
        [121.4737, 31.2304],
        [121.4837, 31.2504],
        [121.4937, 31.2304],
        [121.4737, 31.2304],
      ],
    ],
  ],
};

GeometryCollection

GeometryCollection 用来表示几何对象的集合

由 type 和 geometries 两个属性组成：

type 属性的值为 GeometryCollection
geometries 属性的值为几何对象的数组

const GeometryCollectionJSON = {
  type: "GeometryCollection",
  geometries: [
    { type: "Point", coordinates: [121.4737, 31.2304] },
    {
      type: "LineString",
      coordinates: [
        [121.4737, 31.2304],
        [121.4837, 31.2504],
      ],
    },
  ],
};

可选属性

这些属性都是 GeoJSON 的扩展属性，不是 GeoJSON 规范的一部分

id 属性，用来描述 FeatureCollection 的唯一标识
bbox 属性，用来描述 FeatureCollection 的边界框
- 四至坐标，一般用来做数据裁剪
- 这是一组左上角和右下角的坐标，示例：[minLon, minLat, maxLon, maxLat]
properties 属性，用来描述 FeatureCollection 的属性
crs 属性，用来描述坐标参考系

其他

coordinate

coordinate 是一个数组，表示一个点的坐标，数组的长度表示坐标的维度，一般是 2 维或 3 维

2 维：[lon, lat]
3 维：[lon, lat, height]

coordinate 的第一个元素表示经度，第二个元素表示纬度，第三个元素表示高度

坐标顺序是 [lon, lat]，这个是推荐顺序，可由 crs 属性指定

coordinates 是多维数组：

点：[lon, lat]
线：[[lon, lat], [lon, lat]]
面：[[[lon, lat], [lon, lat]]]
多面：[[[[lon, lat], [lon, lat]]]]

坐标参考系

最常使用的坐标系是 EPSG:4326 和 EPSG:3857：

EPSG:4326 是 WGS84（CGCS2000，大地）坐标系，是 GeoJSON 规范的默认坐标系
EPSG:3857 是 Web Mercator（墨卡托）坐标系，是 OpenLayers 的默认坐标系

它们的区别：

EPSG:4326 是经纬度坐标系，EPSG:3857 是投影坐标系
EPSG:4326 的坐标范围是 [-180, -90, 180, 90]，EPSG:3857 的坐标范围是 [-20037508.342789244, -20037508.342789244, 20037508.342789244, 20037508.342789244]
EPSG:4326 的坐标单位是度，EPSG:3857 的坐标单位是米
EPSG:4326 的坐标原点是 [0, 0]，EPSG:3857 的坐标原点是 [-20037508.342789244, -20037508.342789244]
EPSG:4326 的坐标轴方向是 [x, y]，EPSG:3857 的坐标轴方向是 [x, -y]

在 ts 中使用

为了在 ts 使用 GeoJSON 能够有类型约束，我整理整理了一些 GeoJSON 的 ts 类型定义和创建 GeoJSON 的方法：

举例：

表示一个点和多个点的 GeoJSON 集合：

使用geojson.d.ts

type PointType = FeatureCollection<Point | MultiPoint, GeoJsonProperties<T>>;
const point2Geojson: PointType<{ id: string; name?: string }> = {
  type: "FeatureCollection",
  features: [
    {
      type: "Feature",
      geometry: {
        type: "Point",
        coordinates: [120.4737, 31.2304],
      },
      properties: { id: "12", name: "uccs" },
    },
    {
      type: "Feature",
      geometry: {
        type: "MultiPoint",
        coordinates: [
          [121.4737, 31.2304],
          [111.4737, 31.2204],
        ],
      },
      properties: { id: "1" },
    },
  ],
};

创建一个几何对象

使用geojson.helper.ts

const pointGeometry = point<{ id: string }>([120.4737, 31.2304], {
  id: "1",
});
const featureGeoJSON = feature<Point>(pointGeometry);

参考

以上就是写给小白的地理信息的表示法GeoJSON的详细内容，更多关于GeoJSON地理信息表示法的资料请关注脚本之家其它相关文章！

您可能感兴趣的文章:

相关文章

XML的代替者----JSON
XML的代替者----JSON...
2007-07-07
JS对象与JSON格式数据相互转换
最近遇到这个问题，JS对象和JSON格式数据的相互转换。其实，也就是两个问题：JS对象转换成为JSON格式数据、JSON格式数据转换成为JS对象
2012-02-02
简明json介绍
不要认为JSON是种新的应用，其实JSON就是javascript支持的一种对象直接量。
2008-09-09
如何实现json数据可视化详解
最近在工作中开发一个内部功能时碰到的一个需求，要把json数据在页面上展示出来，平时浏览器会安装jsonView这样的扩展来看json数据，但是程序要用到的话该怎么办呢？今天在网上搜索的时候，发现了这个小技巧，分享给大家，有需要的朋友们可以参考借鉴，下面来一起看看吧
2016-11-11
json的前台操作和后台操作实现代码
通常情况下,json的在项目中的应用都是在后台把数据传到前台,然后前台再获取json中的数据.
2012-01-01
使用JSON作为函数的参数的优缺点
这篇文章主要介绍了使用JSON作为函数的参数的优缺点,需要的朋友可以参考下
2016-10-10
深入浅析同源与跨域,jsonp(函数封装),CORS原理
这篇文章主要介绍了同源与跨域,jsonp(函数封装),CORS原理，从同源政策中Ajax限制，到跨域问题以及跨域问题的解决方法帮大家更加深入的去了解其中原理
2021-08-08
javascript表单域与json数据间的交互
找了几个javascript的框架，都没有找到我想要的：提供函数，把某个表单的所有域封装成json数据格式的对象，唯有自己实现一个。
2008-10-10
JSON 数据格式详解
JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式。JSON采用完全独立于语言的文本格式，这些特性使JSON成为理想的数据交换语言。易于人阅读和编写，同时也易于机器解析和生成
2017-09-09
Jquery+asp.net后台数据传到前台js进行解析的方法
我们经常用jquery读取后台数据，后台返回数据。后台数据格式就有很多了，但是js里面没有什么类型之分
2014-05-05

最新评论