imobile_for_reactnative
Version:
iMobile for ReactNative,是SuperMap iMobile推出的一款基于React-Native框架的移动应用开发工具。基于该开发工具,用户可以使用JavaScript开发语言,开发出在Android和IOS操作系统下运行的原生移动GIS应用,入门门槛低,一次开发,处处运行。
290 lines (269 loc) • 7.64 kB
text/typescript
/*********************************************************************************
Copyright © SuperMap. All rights reserved.
Author: Yang Shanglong
E-mail: yangshanglong@supermap.com
**********************************************************************************/
/**
* @class GeoStyle
* @description 几何风格类。用于定义点状符号、线状符号、填充符号及其相关设置。对于文本对象只能设置文本风格,不能设置几何风格。
*/
export default class GeoStyle {
// LineColor : number
// LineStyle : number
// LineWidth : number
// MarkerStyle : number
// MarkerSize : number
// MarkerHeight : number
// MarkerWidth : number
// MarkerAngle : number
// FillStyle : number
// FillForeColor : number
// FillOpaqueRate : number
// PointColor : number
constructor(json?:string){
if(json){
const obj = JSON.parse(json)
this.LineColor = obj?.LineColor
this.LineStyle = obj?.LineStyle
this.LineWidth = obj?.LineWidth
this.MarkerStyle = obj?.MarkerStyle
this.MarkerSize = obj?.MarkerSize
this.MarkerHeight = obj?.MarkerHeight
this.MarkerWidth = obj?.MarkerWidth
this.MarkerAngle = obj?.MarkerAngle
this.FillStyle = obj?.FillStyle
this.FillForeColor = obj?.FillForeColor
this.FillOpaqueRate = obj?.FillOpaqueRate
this.PointColor = obj?.PointColor
}
}
// {"MarkerStyle":"0","MarkerSize":"28","MarkerAngle":"0","MarkerWidth":"280","MarkerHeight":"280","LineStyle":"0","LineWidth":"1","LineColor":"RGB(70,128,131039)","FillStyle":"0","FillForeColor":"RGB(189,235,131071)","FillBackColor":"RGB(255,255,131071)","FillBackOpaque":"0","FillOpaqueRate":"100","FillGradientType":"0","FillAngle":"0","FillCenterOffsetX":"0","FillCenterOffsetY":"0"}
/**
* 设置线状符号型风格或点状符号的颜色
* @param r 0-255
* @param g 0-255
* @param b 0-255
* @param a 0-1.0
*/
setLineColor(r:number, g:number, b:number, a = 1) {
const rgba = (a * 255) << 24 | b << 16 | g << 8 | r
// Object.assign(this.geoStyle, {
// LineColor: rgba,
// })
this.LineColor = rgba
}
/**
* 返回线状符号的编码。此编码用于唯一标识各线状符号。
线状符号可以用户自定义,也可以使用系统自带的符号库。使用系统自带符号库时,其相应的的编码参见开发指南 SuperMap Objects 资源库一览。
* @param symbolId
*/
setLineStyle(symbolId:number) {
// Object.assign(this.geoStyle, {
// LineStyle: symbolId
// })
this.LineStyle = symbolId
}
/**
* 设置线状符号的宽度。单位为毫米,精度到0.1。
* @param lineWidth
*/
setLineWidth(lineWidth:number) {
// Object.assign(this.geoStyle, {
// LineWidth: lineWidth,
// })
this.LineWidth = lineWidth
}
/**
* 返回点状符号的编码。此编码用于唯一标识各点状符号。
点状符号可以用户自定义,也可以使用系统自带的符号库。使用系统自带符号库时,其相应的的编码参见开发指南 SuperMap Objects 资源库一览。
* @param markerSymbolId
*/
setMarkerStyle(markerSymbolId:number) {
// Object.assign(this.geoStyle, {
// MarkerStyle: markerSymbolId,
// })
this.MarkerStyle = markerSymbolId
}
/**
* 设置点状符号的大小,单位为毫米,精确到0.1毫米。其值必须大于等于0。如果为0,则表示不显示,如果是小于0,会抛出异常。
* @param size
*/
setMarkerSize(size:number) {
// Object.assign(this.geoStyle, {
// MarkerSize: size2D,
// })
this.MarkerSize = size
}
// /**
// * 设置点状符号的高度。
// * @param value
// */
// setMarkerHeight(value:number) {
// this.MarkerHeight = value
// }
// /**
// * 设置点状符号的宽度。
// * @param value
// */
// setMarkerWidth(value:number) {
// this.MarkerWidth = value
// }
/**
* 设置点状符号的角度。
* @param value
*/
setMarkerAngle(value:number) {
this.MarkerAngle = value
}
/**
* 设置填充符号ID
* @param id
*/
setFillStyle(id:number) {
this.FillStyle = id
}
/**
* 设置填充符号的前景色。
* @param r
* @param g
* @param b
* @param a
*/
setFillForeColor(r:number, g:number, b:number, a = 1) {
const rgba = (a * 255) << 24 | b << 16 | g << 8 | r
this.FillForeColor = rgba
}
/**
* 设置填充不透明度,合法值0-100的数值
* @param rate
*/
setFillOpaqueRate(rate:number) {
this.FillOpaqueRate = rate
}
/**
* 设置点的颜色
* @param r
* @param g
* @param b
* @param a
*/
setPointColor(r:number, g:number, b:number, a = 1) {
const rgba = (a * 255) << 24 | b << 16 | g << 8 | r
this.PointColor = rgba
}
/**
* 获取线状符号型风格或点状符号的颜色
* @returns {*}
*/
getLineColor() {
if(typeof this?.LineColor ==='string' && this?.LineColor?.indexOf("RGB") != -1){
return this._transTo(this.LineColor)
}
const rgba = this.LineColor
const r = rgba & 0xff
const g = (rgba >> 8) & 0xff
const b = (rgba >> 16) & 0xff
const a = ((rgba >> 24) & 0xff) / 255
return {
r, g, b, a,
}
}
/**
* 返回线状符号的编码。此编码用于唯一标识各线状符号
* @returns {*}
*/
getLineStyle() {
return this.LineStyle
}
/**
* 获取线状符号的宽度。单位为毫米,精度到0.1
* @returns {*}
*/
getLineWidth() {
return this.LineWidth
}
/**
* 返回点状符号的编码。此编码用于唯一标识各点状符号
* @returns {*}
*/
getMarkerStyle() {
return this.MarkerStyle
}
/**
* 返回点状符号的大小,单位为毫米,精确到0.1毫米
* @returns {*}
*/
getMarkerSize() {
return this.MarkerSize
}
/**
* 设置点状符号的角度。
* @param value
*/
getMarkerAngle() {
return this.MarkerAngle
}
/**
* 返回填充符号的编码。此编码用于唯一标识各点状符号
* @returns {*}
*/
getFillStyle() {
return this.FillStyle
}
_transTo(color:string){
color = color.replace("RGB","")
color = color.replace("(","")
color = color.replace(")","")
const arr = color.split(",")
const r = parseInt(arr[0])
const g = parseInt(arr[1])
const ba = parseInt(arr[2])
const b = ba % 0x100
const a = (ba%0x10000) / 0x100
return {
r, g, b, a,
}
}
/**
* 返回填充符号的前景色
* @returns {*}
*/
getFillForeColor() {
if(typeof this?.FillForeColor ==='string' && this.FillForeColor.indexOf("RGB") != -1){
return this._transTo(this.FillForeColor)
}else{
const rgba = this.FillForeColor
const r = rgba & 0xff
const g = (rgba >> 8) & 0xff
const b = (rgba >> 16) & 0xff
const a = ((rgba >> 24) & 0xff) / 255
return {
r, g, b, a,
}
}
}
/**
* 返回填充不透明度,合法值0-100的数值
* @returns {*}
*/
getFillOpaqueRate() {
return this.FillOpaqueRate
}
/**
* 返回点的颜色
* @returns {*}
*/
getPointColor() {
if(typeof this?.PointColor ==='string' && this?.PointColor?.indexOf("RGB") != -1){
return this._transTo(this.PointColor)
}
const rgba = this.PointColor
const r = rgba & 0xff
const g = (rgba >> 8) & 0xff
const b = (rgba >> 16) & 0xff
const a = ((rgba >> 24) & 0xff) / 255
return {
r, g, b, a,
}
}
}