@mapcatch/util 2.0.4 → 2.0.5-a

package/docs/Catolog.md

@@ -0,0 +1,24 @@
+## 目录
+
+catchUtil主要包括四个部分：
+
+- [工具函数](./Util.md)
+
+- [事件管理类](./Event.md)
+
+- [栅格瓦片自定义样式重渲染](./GlOptions.md)
+
+- [常量和配置项](./Constant.md)
+
+### 基本用法
+
+```js
+import {getPhotoTags, generateId} from '@mapcatch/util'
+
+// 解析jpg中的exif信息
+getPhotoTags(file).then(info => {
+  console.log(info)
+})
+// 生成随机Id
+generateId()
+```

package/docs/Constant.md

@@ -0,0 +1,92 @@
+## 常量和配置项
+
+### cameras
+
+不同数据类型对应的相机型号。
+
+```js
+import {cameras} from '@mapcatch/util'
+```
+查看源码：[src/constants/cameras.js](../src/constants/cameras.js)
+
+### layerGroups
+
+成果的默认分组信息
+
+```js
+import {layerGroups} from '@mapcatch/util'
+```
+查看源码：[src/constants/layer_groups.js](../src/constants/layer_groups.js)
+
+### bmapTypes
+
+地图底图的图层信息
+
+```js
+import {bmapTypes} from '@mapcatch/util'
+```
+查看源码：[src/constants/bmap_types.js](../src/constants/bmap_types.js)
+
+### colors
+
+dsm和温度图的色带信息
+
+```js
+import {colors} from '@mapcatch/util'
+```
+查看源码：[src/constants/colors.js](../src/constants/colors.js)
+
+### defaultLayers
+
+默认的成果图层属性
+
+```js
+import {defaultLayers} from '@mapcatch/util'
+```
+查看源码：[src/constants/default_layers.js](../src/constants/default_layers.js)
+
+
+### layerFolders
+
+不同类型图层对应的文件夹名称
+
+```js
+import {layerFolders} from '@mapcatch/util'
+```
+查看源码：[src/constants/layer_folders.js](../src/constants/layer_folders.js)
+
+### layerIcons
+
+不同类型图层对应图标
+
+```js
+import {layerIcons} from '@mapcatch/util'
+```
+查看源码：[src/constants/layer_icons.js](../src/constants/layer_icons.js)
+
+### mapViewModes
+
+地图的显示模式
+
+```js
+import {mapViewModes} from '@mapcatch/util'
+```
+查看源码：[src/constants/map_view_mode.js](../src/constants/map_view_mode.js)
+
+### taskParams
+
+任务的默认参数
+
+```js
+import {taskParams} from '@mapcatch/util'
+```
+查看源码：[src/constants/task_params.js](../src/constants/task_params.js)
+
+### tools
+
+地图标绘工具属性
+
+```js
+import {tools} from '@mapcatch/util'
+```
+查看源码：[src/constants/tools.js](../src/constants/tools.js)

package/docs/Event.md

@@ -0,0 +1,90 @@
+## 事件管理类
+
+主要用来管理自定义事件，包括事件的监听、执行、删除。
+
+基本用法：
+
+```js
+import {Event} from '@mapcatch/util'
+
+let event = new Event()
+
+event.on('on-change', (e) => {
+  console.log(e.data)
+})
+
+setTimeout(() => {
+  event.fire('on-change')
+}, 3000)
+```
+
+主要接口：
+
+### on(type, listener)
+
+监听指定类型的事件，事件发生时，自动执行listener。
+
+**参数**
+
+*type* `String` 事件类型，可以是任意字符串。
+
+*listener* `Function` 监听函数，事件发生时执行。
+
+**返回值**
+
+`Event`: Event实例，用于链式调用
+
+### off(type, listener)
+
+移除指定类型的监听函数，`listener`可以不指定，不指定则会删除该类型所有的监听函数。
+
+**参数**
+
+*type* `String` 事件类型。
+
+*listener* `Function` 需要移除的监听函数，不指定则移除该事件类型的所有监听函数。
+
+**返回值**
+
+`Event`: Event实例，用于链式调用
+
+### once(type, listener)
+
+一次性监听指定类型的事件，事件发生时，自动执行listener，执行完以后自动移除。
+
+**参数**
+
+*type* `String` 事件类型，可以是任意字符串。
+
+*listener* `Function` 监听函数，事件发生时执行。
+
+**返回值**
+
+`Event`: Event实例，用于链式调用
+
+### fire(type, data)
+
+触发指定类型的事件。
+
+**参数**
+
+*type* `String` 事件类型，可以是任意字符串。
+
+*data* `Any` 该事件附带的参数信息。
+
+**返回值**
+
+`Event`: Event实例，用于链式调用
+
+
+### listens(type)
+
+判断是否存在该事件类型的监听函数。
+
+**参数**
+
+*type* `String` 事件类型，可以是任意字符串。
+
+**返回值**
+
+`boolean`: 是否存在该事件的监听函数。

package/docs/Util.md

@@ -0,0 +1,345 @@
+## 工具函数
+
+基本用法：
+
+```js
+// 完整引入
+import * as catchUtil from '@mapcatch/util'
+// 或者按需引入
+import {getPhotoTags} from '@mapcatch/util'
+```
+
+### getPhotoTags(file)
+
+获取照片文件中的exif信息，例如GPS位置、拍摄的设备型号等。为加快解析速度，可以只截取图片的前64kB进行解析，而不用传整个文件进来解析。
+
+**参数**
+
+*file* `File` 需要解析的文件，必须是HTML5的File对象
+
+**返回值**
+
+`Promise`: 一个Promise对象，用来获取解析结果
+
+**示例**
+
+```js
+getPhotoTags(file).then(info => {
+  console.log(info)
+}).catch(err => {
+  throw err
+})
+```
+
+### generateId()
+
+生成一个随机id字符串
+
+**返回值**
+
+`uuid`: 使用uuidv4生成一个随机id
+
+### formatDate(date)
+
+将数据库的日期字符串格式化用来前端显示。
+
+**参数**
+
+*date* `Date String` 日期字符串
+
+**返回值**
+
+`String` 格式化以后的日期，如`2023-08-01 12:56:32`
+
+### formatLocalDate()
+
+将当前的本地时间转为字符串，这个函数主要是为了解决`.toLocaleDateString()`在不同浏览器结果可能不一致的问题。
+
+**返回值**
+
+`String` 格式化以后的日期，如`2023/8/1 12:56:32`
+
+### formatFileSize(size)
+
+将以字节为单位的文件大小自动转为`KB`、`MB`等用来显示。
+
+**参数**
+
+*size* `Number` 文件大小
+
+**返回值**
+
+`String` 格式化以后文件大小，例如`342KB`
+
+### getPhotoInfo(file)
+
+获取照片文件的拍摄日期、相机型号和GPS位置信息，与`getPhotoTags(file)`不同，该函数只获取这三个属性，并会将位置信息格式化为十进制度。
+
+**参数**
+
+*file* `File` 需要解析的文件，必须是HTML5的File对象
+
+**返回值**
+
+`Promise`: 一个Promise对象，用来获取解析结果
+
+**示例**
+
+```js
+let info = await getPhotoInfo(file)
+
+/*
+{
+  date: '2020-04-21',
+  Model: 'FC6310R',
+  position: {
+    lng: 110.3456,
+    lat: 32.56434526,
+    alt: 78.432
+  }
+}
+*/
+```
+
+### getPhotoMeta(file)
+
+获取照片文件的元数据信息，包括md5和原始exif信息。
+
+> 注意，为了提高解析性能，该接口只计算文件前64KB的md5，用于确保文件的唯一性，但无法保证文件的完整性。
+
+**参数**
+
+*file* `File` 需要解析的文件，必须是HTML5的File对象
+
+**返回值**
+
+`Promise`: 一个Promise对象，用来获取解析结果
+
+**示例**
+
+```js
+let info = await getPhotoMeta(file)
+
+/*
+{
+  md5: '.....',
+  exif: {...}
+}
+*/
+```
+
+### getGeoCoordOperator(flag)
+
+一般照片GPS位置中的经纬度用`N`和`E`来表示北纬和东经，但我们程序中通常用带有正负号的十进制度表示，此接口用来根据这些标识来获取正负号。
+
+**参数**
+
+*flag* `String` 经纬度的标识字符
+
+**返回值**
+
+`number`: 1或者-1
+
+**示例**
+
+```js
+getGeoCoordOperator('N')
+// 1
+getGeoCoordOperator('S')
+// -1
+```
+
+### toRadian(arr)
+
+将数组表示的度分秒转为带小数的度。
+
+**参数**
+
+*arr* `Array` 度分秒数组
+
+**返回值**
+
+`number`: 十进制度
+
+**示例**
+
+```js
+let arr = [110, 30, 20]
+toRadian(arr)
+// 110.5055555555
+```
+
+### diffLayers(newList, oldList)
+
+将新的成果列表与旧的成果列表进行比较，找出其中变化的部分，进行差异化更新。
+
+**参数**
+
+*newList* `Array` 修改之后的成果树列表
+
+*oldList* `Array` 修改之前的成果树列表，默认为`[]`
+
+**返回值**
+
+`array`: 返回地图更新的命令集合，包含命令的名称（例如`addLayer`）和参数
+
+### findNodeInTree(id, treeList)
+
+从树状列表中找出指定id的节点。
+
+**参数**
+
+*id* `String` 需要查找的节点id
+
+*treeList* `Array` 待查找的树状列表
+
+**返回值**
+
+`object`: 节点对象，没有则返回`null`
+
+### getBeforeId(map, layer)
+
+根据`layer.metadata.layerType`中指定的图层类型来获取该图层需要插入的位置。这个接口主要用于在mapbox地图中插入一个新的图层时，自动计算新图层应该插入的位置，例如底图图层应该插入到最下面，而标注图层需要插入到最上面。
+
+程序中默认的图层类型的顺序为： `['bmap', 'dom', 'ndvi', 'dsm', 'circle', 'annotation', 'label']`
+
+**参数**
+
+*map* `Map` mapbox的地图实例。
+
+*layer* `object` 等待插入的图层配置项，其中必须指定`layer.metadata.layerType`
+
+**返回值**
+
+`string`: 图层应该插入到的位置
+
+### isTokenExpired(response)
+
+根据后端的接口响应判断用户的token是否已过期。
+
+**返回值**
+
+`boolean`: 用户token是否已过期
+
+### getDataType(camera)
+
+根据相机型号判断该数据的类型，主要有三种类型：可见光`normal`、多光谱`multispectral`、热红外`infrared`。
+
+**参数**
+
+*camera* `String` 相机型号，例如`FC6310`。
+
+**返回值**
+
+`string`: 数据类型，默认是`normal`
+
+### downloadImage(base64)
+
+在浏览器将base64格式的图片下载到本地。
+
+**参数**
+
+*base64* `String` 图片文件的base64字符串。
+
+### getGeometryType(feature)
+
+给定geojson要素，获取该要素的几何类型（点、线、面）
+
+**参数**
+
+*feature* `Object` geojson要素。
+
+**返回值**
+
+*string*：几何类型，`point`、`line`或者`polygon`
+
+### rgbaToFloat(colorArray)
+
+将rgba格式的颜色数组转为float32浮点数。
+
+**参数**
+
+*colorArray* `Array` 长度为4的颜色数组，每个值都是0-255。
+
+**返回值**
+
+*number*： 浮点数
+
+**示例**
+
+```js
+let arr = [234, 32, 133, 255];
+let float = rgbaToFloat(arr)
+```
+
+### getAnnotationName(annotations, type)
+
+根据标注的几何类型获取标注的名称。该接口主要是为了避免名称重复，自动在名称后面加上需要以保证名称的唯一性。
+
+**参数**
+
+*annotations* `Array` 已经保存的标注列表。
+
+*type* `String` 新标注的类型，`point`、`line`或者`polygon`。
+
+**返回值**
+
+*string*： 新的标注名称
+
+**示例**
+
+```js
+let name = getAnnotationName(annotations, 'point')
+console.log(name)
+// 点标注 2
+```
+
+### getLineLabelFeature(lineFeature)
+
+获取线标注的文字注记点位信息。在地图上标注线要素时需要显示标注的测量信息和名称，而且名称应该沿线排布，该接口根据线标注的长度和走向自动计算文字标注的位置和旋转角度，并返回一个点状的GeoJSON要素。
+
+**参数**
+
+*lineFeature* `Object` 线标注的geojson要素
+
+**返回值**
+
+*object*：文字标注的点要素，其中属性信息中包含旋转角度。
+
+### project(lngLat, zoom)
+
+将经纬度转为墨卡托投影的像素坐标，瓦片大小按照512计算。
+
+**参数**
+
+*lngLat* `Array` 数组格式的经纬度
+
+*zoom* `number` 地图级别，可以不指定，默认为12
+
+**返回值**
+
+*object*：墨卡托投影的像素坐标，包含`x`和`y`。
+
+### addIcons2Map(map, icons)
+
+该接口通过mapbox的`map.addImage`接口批量将给定的图标文件添加到地图中，用于地图中点要素的符号化。
+
+**参数**
+
+*map* `Map` mapbox地图实例
+
+*icons* `Array` 图标数组，每个元素是图标的url
+
+### getTaskTreeList(taskInfo, annotations, layers)
+
+将任务的成果和标注等信息转为成果树列表，用于左边面板展示
+
+**参数**
+
+*taskInfo* `Object` 任务详细信息
+*annotations* `Array` 标注列表
+*layers* `Array` 任务成果列表
+
+**返回值**
+
+*array*: 成果树列表

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mapcatch/util",
-  "version": "2.0.4",
+  "version": "2.0.5-a",
   "main": "./dist/catchUtil.min.esm.js",
   "repository": "",
   "author": "wanyanyan",
@@ -17,6 +17,26 @@
     "src/**/*.js": "yarn lint"
   },
   "dependencies": {
+    "@turf/turf": "^7.1.0",
+    "@xmldom/xmldom": "^0.9.2",
+    "cdt2d": "^1.0.0",
+    "eslint": "8.22.0",
+    "gl-matrix": "^3.4.3",
+    "glsl-float-to-rgba": "^1.0.0",
+    "glsl-rgba-to-float": "^1.0.0",
+    "lodash": "^4.17.21",
+    "mapbox-gl": "^3.6.0",
+    "mathjs": "12.3.0",
+    "moment": "^2.29.4",
+    "pbf": "3.2.1",
+    "proj4": "^2.12.1",
+    "protocol-buffers-schema": "^3.6.0",
+    "regl": "^2.1.0",
+    "satellite-geo-calc": "^0.0.7",
+    "spark-md5": "^3.0.2",
+    "svg-path-commander": "2.0.9",
+    "upng-js": "^2.1.0",
+    "uuid": "^9.0.0"
   },
   "devDependencies": {
     "@babel/core": "^7.25.2",