# 样式
# 图标-Icon
图标是用于表现要素信息的图形符号。为要素定义一个合适的图标能够更加清晰地和直观地表现出该要素的特征。Cellsys体系下的图标都是svg数据格式。
# (一)、图标集合[IconSet]
Cellsys预设了一系列可以表现行业属性的图标集合。要获取指定图标时,首先要获取图标集合。 图标集合的常用属性如下:
属性名 | 值类型 | 属性描述 |
---|---|---|
name | String | 图标集合名称 |
count | String | 图标集合下图标的数量 |
常用方法如下:
方法名 | 返回类型 | 方法描述 |
---|---|---|
queryIcon | Promise< QueryResult > | 查询图标集合下所有的图标 |
# 1、获取图标集合
初始化成功后,可直接通过Cellsys获取空天提供的图标集合。与其他要素集合不同的是,图标集合并不是从organization对象下获取。
Cellsys.queryIconSet { obj, errorMessage in
let iconSets = queryResult.data //图标集合列表
let iconSet = iconSets.first //获取图标集合列表下其中一个图标集合
}
1
2
3
4
2
3
4
# (二)、图标[Icon]
Cellsys提供的图标都是以svg代码的形式。
图标的常用属性如下:
属性名 | 值类型 | 属性描述 |
---|---|---|
name | String | 图标名称 |
svgData | String | 图标的svg代码 |
color | Color | 图标的颜色 |
iconSetInfo | CommonInfo | 图标所属的图标集合基础信息 |
常用方法如下:
方法名 | 返回类型 | 方法描述 |
---|---|---|
setColor | void | 设置图标颜色 |
图标集合[IconSet]提供了query方法来查询自身集合中的图标,示例如下:
iconSet.queryIcon { obj, errorMessage in
let icons = queryResult.data //图标集合列表
if(icons.count > 0) {
let icon = icons.first //获取图标列表下其中一个图标
icon.color = color //为图标设置颜色
//获取图标后即可用于创建标记集合等需要图标的操作
Cellsys.shared.organization.createMarkerSet("集合名称", "集合描述", icon)
}
}
1
2
3
4
5
6
7
8
9
10
2
3
4
5
6
7
8
9
10
# 颜色-Color
Cellsys的颜色由色带和色带对应的色号。每个色带有10个色号,对应由浅至深的10个不同色彩级别。
颜色[Color]的常用属性如下:
属性名 | 值类型 | 属性描述 |
---|---|---|
ribbon | Ribbon | 色带 |
level | RibbonLevel | 色带对应的色号 |
value | String | 16进制RGB颜色值 |
方法名 | 返回类型 | 方法描述 |
---|---|---|
setRibbon | void | 设置色带 |
setLevel | void | 设置色号 |
# 色带[Ribbon]
Cellsys提供了适用于不同场景的13个色带,基本可以满足大部分产品对于颜色的需求。
色带 | 描述 |
---|---|
Red | 红色 |
Volcano | 火山色 |
Orange | 橙色 |
Gold | 金色 |
Yellow | 黄色 |
LightGreen | 浅绿色 |
Green | 绿色 |
Cyan | 青色 |
GeekBlue | 极客蓝 |
Blue | 蓝色 |
Purple | 紫色 |
Pink | 粉色 |
Gray | 灰色 |
# 色号[RibbonLevel]
每个色带由浅至深对应有L1至L10,10个不同等级的色号。
# 颜色声明
let color = Color.new(ribbon: Ribbon.Yellow, level: RibbonLevel.L4)
//声明后即可用于设置例如标记集合图标颜色等其他操作
let markerSets = Cellsys.shared.organization.markerSets
if(markerSets.count > 0) {
let markerSet = markerSets.first //获取组织下的某个标记集合
let icon = markerSet.icon
icon.color = color
}
1
2
3
4
5
6
7
8
9
10
2
3
4
5
6
7
8
9
10
# 地图样式-symbol
地图样式是用于显示在地图上的符号表现。Cellsys提供了三种不同类型的地图样式,分别是点符号[PointSymbol]、线符号[PolylineSymbol]和面符号[PolygonSymbol]
# (一)、点符号[PointSymbol]
点符号可以用于表现标记、事件、任务要素在地图上的展示效果。点符号[PointSymbol]不仅需要一个图标[Icon]类,其还拥有尺寸、填充色、透明度等属性。
属性名 | 值类型 | 属性描述 |
---|---|---|
mapSign | Icon | 点符号的图标表现 |
size | Number | 点符号尺寸 |
fillColor | Color | 点符号的填充颜色 |
alpha | Number | 点符号的透明度 |
常用方法如下:
方法名 | 返回类型 | 方法描述 |
---|---|---|
setMapSign | void | 设置点符号的图标样式 |
setColor | void | 设置点符号的颜色 |
setAlpha | void | 设置点符号的透明度 |
# 点符号声明
let pointSymbol = PointSymbol.new(mapSign: icon, fillColor: color)
//声明后即可用于设置例如图层地图符号等其他操作
Cellsys.shared.organization.createLayer(name: "标记图层名称", markerSet: markerSet, pointSymbol: pointSymbol)
1
2
3
4
5
2
3
4
5
# (二)、线符号的常用属性如下:
线符号[PolylineSymbol]可以用于表现路线要素在地图上的展示效果。
属性名 | 值类型 | 属性描述 |
---|---|---|
width | Number | 线宽度 |
fillColor | Color | 线的填充颜色 |
alpha | Number | 线符号的透明度 |
方法名 | 返回类型 | 方法描述 |
---|---|---|
setWidth | void | 设置线符号的宽度 |
setColor | void | 设置线符号的颜色 |
setAlpha | void | 设置线符号的透明度 |
# 线符号声明
let polylineSymbol = PolylineSymbol.new(width: 2, strokeType: StrokeType.SolidLine, fillColor: Color.new(ribbon: Ribbon.Blue, level: RibbonLevel.L4), alpha: 1)
//声明后即可用于设置例如路线集合的地图符号
Cellsys.shared.organization.createLineSet(name: "路线集合的名称", lineSymbol: polylineSymbol)
1
2
3
4
2
3
4
# (三)、面符号[PolygonSymbol]
面符号[PolygonSymbol]可以用于表现面要素在地图上的展示效果。
面符号的常用属性如下:
属性名 | 值类型 | 属性描述 |
---|---|---|
strokeSymbol | PolylineSymbol | 面的边框地图符号 |
fillColor | Color | 面的填充颜色 |
alpha | Number | 面的填充透明度 |
面符号的常用方法如下:
方法名 | 返回类型 | 方法描述 |
---|---|---|
setColor | void | 设置面符号的填充颜色 |
setAlpha | void | 设置面符号的透明度 |
# 面符号声明
let polygonSymbol = PolygonSymbol.new(fillColor: Color.new(ribbon: Ribbon.Blue))
//声明后即可用于设置例如路线集合的地图符号
Cellsys.shared.organization.createAreaSet(name: "区域集合的名字", polygonSymbol: polygonSymbol)
1
2
3
4
2
3
4
# 图片-Image
图片[Image]的常用属性如下:
属性名 | 值类型 | 属性描述 |
---|---|---|
type | ImageType | 图片类型 |
data | String | 图片的数据内容 |
fileName | String | 图片文件名,需要带有格式后缀 |
图片类型[ImageType]包括:
类型 | 描述 |
---|---|
InternetImage | 网络图片,data属性为图片的网络链接 |
Base64BMP | base64格式图片,data属性为图片的base64编码部分,不包括前缀 |
# 图片[Image]声明
let imageA = Image.new(type: ImageType.Base64BMP, data: imageABase64Str, fileName: "xxx.png")
let imageB = Image.new(type: ImageType.Base64BMP, data: imageBBase64Str, fileName: "xxx.png")
let images = [imageA,imageB]
//声明后即可用于设置例如事件要素图片属性等操作
eventSet.createEvent(name: "事件名称",remark: "事件描述",mapPoint: mapPoint,happenTime: time,base64Images: images)
1
2
3
4
5
6
7
2
3
4
5
6
7