# 区域
# (一)概述
区域数据包括区域要素[AreaFeature]、区域集合[AreaSet]两个数据类。
区域要素[AreaFeature]是一种地图数据,可用来记录地图上的区域。例如停车区域,办公区域,危险区域...等等。如下图:

区域集合[AreaSet]用来分类存放、管理区域要素[AreaFeature]。
# (二)区域集合[AreaSet]
所有的区域数据,都存放在不同的区域集合之下。想要对区域进行操作,需要先获取区域集合。 区域集合[AreaSet]的常用属性如下:
属性名 | 值类型 | 属性描述 |
---|---|---|
name | String | 区域集合名称 |
remark | String | 备注 |
symbol | PolygonSymbol | 区域符号 |
常用方法如下:
方法名 | 返回类型 | 方法描述 |
---|---|---|
queryAreas | Promise< QueryResult > | 查询集合下的所有区域要素 |
createArea | Promise< AreaFeature > | 创建区域 |
updateArea | Promise< void > | 更新区域信息 |
deleteArea | Promise< void > | 删除区域 |
# 1、获取区域集合
初始化成功后,可直接从Cellsys的organization对象中获取到组织下所有的区域集合。具体代码示例如下:
/*执行初始化成功后,可直接获取到区域集合*/
let areaSets = Cellsys.organization.areaSets;//areaSets可能为null
if (areaSets != null && areaSets.length > 0) {
let areaSet = areaSets[0];
let name = areaSet.name;//集合名称
let remark = areaSet.remark;//集合备注信息
let polygonSymbol = areaSet.symbol;//获取地图符号对象
}
1
2
3
4
5
6
7
8
2
3
4
5
6
7
8
# (1)区域符号[PolygonSymbol]
区域符号决定了区域要素在地图上的具体参数,如:边框颜色、边框透明度、边框宽度、填充颜色,填充透明度等。具体参数获取示例如下:
let color = polygonSymbol.fillColor;//区域填充颜色
let colorValue = color.value;//返回一个带#号的色值:如#3c3c3c
let alpha = polygonSymbol.alpha;//填充色的不透明度。取值范围0~1,1为不透明
let strokeSymbol = polygonSymbol.strokeSymbol;
let width = strokeSymbol.width;//边框宽度
let strokeColor = strokeSymbol.fillColor;//边框颜色
let strokeCValue = color.value;//返回一个带#号的色值:如#3c3c3c
let strokeAlpha = strokeSymbol.alpha;//边框的不透明度
1
2
3
4
5
6
7
8
2
3
4
5
6
7
8
有关区域符号[PolygonSymbol]的详细介绍,可查看附-样式
# 2、新增区域集合
区域集合通过组织[Organization]对象创建。具体操作见代码示例
let color = new Cellsys.Color(Cellsys.Ribbon["Red"], Cellsys.RibbonLevel["L1"]);
let polygonSymbol = new Cellsys.PolygonSymbol(color);//区域集合的地图符号
Cellsys.organization.createAreaSet({
"name": "集合名称",
"remark": "集合备注",
"polygonSymbol": polygonSymbol
})
.then((areaSet) => {
/*创建成功,,返回创建的areaSet对象*/
let newAreaSet = areaSet;
})
.catch(error => {
console.log(error.code)
console.log(error.message)
})
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
2
3
4
5
6
7
8
9
10
11
12
13
14
15
# 3、修改区域集合
区域集合通过组织[Organization]对象修改。具体操作见代码示例
areaSet.setName("输入修改名称");
areaSet.setRemark("修改备注");
/*设置样式*/
let color = new Cellsys.Color(Cellsys.Ribbon["Red"], Cellsys.RibbonLevel["L1"]);
PolygonSymbol polygonSymbol = new Cellsys.PolygonSymbol(color);//区域集合的地图符号
polygonSymbol.alpha = 0.5;
polygonSymbol.strokeSymbol.width = 3;
polygonSymbol.strokeSymbol.alpha = 0.9;
polygonSymbol.strokeSymbol.fillColor = new Cellsys.Color(Cellsys.Ribbon["Green"], Cellsys.RibbonLevel["L9"]);
areaSet.setSymbol(polygonSymbol);
/*提交修改*/
Cellsys.organization.updateAreaSet(areaSet)
.then(() => {
let name = areaSet.name;//修改后的集合名称
let remark = areaSet.remark;//修改后的备注
})
.catch(error => {
console.log(error.code)
console.log(error.message)
})
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
# 4、删除区域集合
区域集合通过组织[Organization]对象来删除。具体操作见代码示例
Cellsys.organization.deleteAreaSet(areaSet)
.then(() => {
//删除成功
})
.catch(error => {
console.log(error.code)
console.log(error.message)
})
1
2
3
4
5
6
7
8
9
2
3
4
5
6
7
8
9
# (三)区域要素[AreaFeature]
区域要素是地图数据,一个区域要素对象可以表示一条地图区域。区域要素的常用属性表如下:
属性名 | 值类型 | 属性描述 |
---|---|---|
name | String | 区域集合名称 |
remark | String | 备注 |
symbol | PolygonSymbol | 区域符号 |
polygon | Polygon | 区域坐标集合 |
fenceInfo | FenceInfo | 围栏信息 |
区域要素的常用方法如下:
方法名 | 返回类型 | 方法描述 |
---|---|---|
setName | void | 设置区域集合名称 |
setRemark | void | 设置区域集合描述 |
# 1、获取区域要素
区域集合[AreaSet]提供了query方法来查询自身集合中的区域要素。具体操作见代码示例
//实例化查询配置,代表当前查询第1页数据,1页10条数据
let queryConfig = new Cellsys.QueryConfig(1, 10);
areaSet.queryAreas(queryConfig)
.then((queryResult) => {
/*分页信息-查询方法特有*/
let pageInfo = queryResult.pageInfo;//查询接口特有的分页信息
let totalCount = pageInfo.totalCount;//数据总数
let totalPage = pageInfo.totalPage;//总页数
let pageNo = pageInfo.pageNo;//当前页码(从1开始)
let pageSize = pageInfo.pageSize;//每页查询数量(注意!不一定和当前查询的数据总量匹配)
/*获取查询结果*/
let areaFeatures = queryResult.data;
if (areaFeatures != null && areaFeatures.length > 0) {//查询结果可能为null
for (let areaFeature of areaFeatures) {
/*区域要素基础信息获取示例*/
let name = areaFeature.name;//区域要素名称
let remark = areaFeature.remark;//备注
let polygonSymbol = areaFeature.symbol;//区域符号
let polygon = areaFeature.polygon;//区域坐标
let fenceInfo = areaFeature.fenceInfo;//电子围栏属性
}
}
})
.catch(error => {
console.log(error.code)
console.log(error.message)
})
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
# 2、新增区域要素
区域要素[AreaFeature]通过区域集合[AreaSet]对象创建。具体操作见代码示例
/*生成区域坐标*/
let points = [];
points.add(new Cellsys.MapPoint(36.576037, 101.792951));
points.add(new Cellsys.MapPoint(36.115893, 103.814436));
points.add(new Cellsys.MapPoint(38.458087, 106.363264));
points.add(new Cellsys.MapPoint(34.899654, 113.570295));
points.add(new Cellsys.MapPoint(36.857848, 117.173811));
let polygon = new Cellsys.Polygon(points);
areaSet.createArea({
"name": "区域名称",
"remark": "区域备注",
"polygon": polygon
})
.then((areaFeature) => {
//创建成功后,返回创建的区域对象
let newArea = areaFeature;
})
.catch(error => {
console.log(error.code)
console.log(error.message)
})
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
# 3、修改区域要素
区域要素[AreaFeature]通过区域集合[AreaSet]对象修改。具体操作见代码示例
areaFeature.setName("修改名字");
areaFeature.setRemark("修改备注");
let points = [];
points.add(new Cellsys.MapPoint(39.909627, 116.397504));
points.add(new Cellsys.MapPoint(31.239919, 121.500446));
points.add(new Cellsys.MapPoint(23.106414, 113.324553));
points.add(new Cellsys.MapPoint(22.561611, 114.108159));
let polygon = new Cellsys.Polygon(points);
areaFeature.setPolygon(polygon);
areaSet.updateArea(areaFeature)
.then(() => {
/*成功,可在回调中直接查看原对象修改后的数据*/
let name = areaFeature.name;
let remark = areaFeature.remark;
let polygon = areaFeature.polygon;
})
.catch(error => {
console.log(error.code)
console.log(error.message)
})
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
# 4、删除区域要素
路线要素[AreaSet]通过路线集合[AreaFeature]对象删除。具体操作见代码示例
areaSet.deleteArea(areaFeature)
.then(() => {
/*删除成功*/
})
.catch(error => {
console.log(error.code)
console.log(error.message)
})
1
2
3
4
5
6
7
8
9
2
3
4
5
6
7
8
9