th-gis-ui组件库
帮助文档
npm i th-gis -S
安装th-gis组件后,version<3.0.0需要执行后续几个步骤才能正常使用此组件,
version>=3.0.0 则不需要执行1.1和1.2
1.1 拷贝node_modules/th-gis目录中拷贝public/cdn 文件夹至研发项目public目录中
1.2 使用者项目需要在public/index.html引入cdn文件夹中相应的js及css
## 1.3 使用者项目中安装th-gis
在使用者src/main.js中安装th-gis,并引入th-gis样式,如下
import 'th-gis/lib/th-gis.css'
import ThGis from 'th-gis'
Vue.use(ThGis)
至此th-gis组件安装完成
# 一、指令说明
``` bash
# 安装依赖
npm install
# 启动DEMO开发模式
npm run dev
# 打包DEMO
npm run build:demo
# 打包组件
npm run build
# 发布(npm adduser && npm login)
npm run deploy
更新日志
1.0.4
# | 更新内容 |
---|
1 | 新增地图加载完成事件,可通过在ThgisMap中注册mapLoaded函数,地图加载完成后会自动调用mapLoaded函数,返回参数为地图map对象 |
2 | 新增ConfigVo对象,设置地图需要相关参数,当使用外部map对象时,需要设置此类参数对象,通过new ConfigVo()设置 |
3 | 优化数据接口,通过外部传入数据接口地址进行数据查询 |
1.0.5
# | 更新内容 |
---|
1 | 新增vuex插件 |
2 | 优化轨迹展示,轨迹关闭事件会调用父类 trackClose 函数,数据传输,轨迹展示等相关功能,可通过统一CLASS管理 |
1.1.5
# | 更新内容 |
---|
1 | 优化相关图片引用,使用base64字符串,方式图片丢失不展示问题 |
2 | 关闭数据接口代理模式,优化数据请求baseurl,可通过配置数据接口地址请求数据 |
3 | 其他bug修复 |
1.1.6
# | 更新内容 |
---|
1 | 修复轨迹窗口关闭按钮默认显示,只有为false时才不展示关闭按钮 |
1.1.9
1.2.3
1.2.4
# | 更新内容 |
---|
1 | 添加线路展示时,可自定义颜色 |
2 | 更新引入egis 公共js包 版本到 1.0.1.8.3 |
1.2.6
# | 更新内容 |
---|
1 | 添加图片定位时,覆盖时可设置zindex,控制上下层关系 |
1.2.8
# | 更新内容 |
---|
1 | axios 放入dev中,防止安装使用中axios版本冲突 |
1.2.9
1.2.10
# | 更新内容 |
---|
1 | ThgisDrawTools图形绘制工具类功能实现 |
1 | 点选电网图展示的设备图形,获取相关图形ID内容 |
1.2.11
# | 更新内容 |
---|
1 | ThgisPopup.addCustomPanel 当坐标不存在时报错问题处理 |
1.2.12
# | 更新内容 |
---|
1 | 新增ThgisMapJs.loadUnitBound_SN(resultValue) 方法,用于加载陕西新增区域,可动态配置resultValue0.xzqy.options.color = '#ff1708' 设置区域内颜色 |
2 | 修复GIS2.0中轨迹距离计算错误问题 |
1.2.13
# | 更新内容 |
---|
1 | 在GIS2.0中自动转换热力图时无法看到热力图BUG修复 |
1.2.14
# | 更新内容 |
---|
1 | 点图形定位新增size属性,设置点圈半径大小 |
2 | 优化ThgisPopup.addHintInfoByCoor自定义信息标签显示方式,移除方式 |
3 | 优化数组判断,在某些情况下instanceof判断数组报错 |
4 | 地图标注内容新增右键contextmenu事件添加 |
1.3.1
# | 更新内容 |
---|
1 | 为缩小组件打包后体积,不再自动打包jquery,需要在index.html中自主引入jquery,index.html中只需要引用一次jquery,已引入则不需要关注此条更新内容.如果没有jquery.js包,则可使用 public/thgis/libs/egis/assets/js/jquery.min.js |
2 | 坐标系转换优化,因gis2.0服务中一次只能转换100条数据,已对坐标数据进行分批次查询,合并返回 |
1.3.2
# | 更新内容 |
---|
1 | 在轨迹展示中,根据传入数据属性控制是否可展示,开始结束标记图片(startAndEndVisable),信息提示面板(nodeinfoVisable),属性值为,true显示,false不显示 |
1.3.4
1.3.5
# | 更新内容 |
---|
1 | 优化区域展示可选择居中还是不居中,提供iscenter参数 |
1.3.6
# | 更新内容 |
---|
1 | 轨迹播放面板可通过speedPosition (left,center,right)设置面板所在位置 |
2 | 新增 ThgisFindSelectArea类,分析范围内设备 |
3 | 优化设备图形查询接口异常处理问题 |
4 | 优化范围居中控制 |
1.3.7
# | 更新内容 |
---|
1 | 新增 ThgisLocation.locationBuilderCircle() 函数,可根据传入中心位置及半径,及样式展示相应的圆 |
1.3.8
# | 更新内容 |
---|
1 | 轨迹展示代码重构,用于兼容县数字化平台地图异常问题 |
1.4.0
# | 更新内容 |
---|
1 | 去除element-ui,vuex依赖, axios及jquery改成cdn方法引入 |
1.4.1
1.4.3
# | 更新内容 |
---|
1 | 兼容1.6地图,maptype="gis1.6",则底图使用gis1.6底图,但是后台服务依赖th-gis模块服务 |
1.4.4
# | 更新内容 |
---|
1 | 支持默认底图样式 egisstyle 设置 aegis://styles/aegis/Streets |
1.4.5
# | 更新内容 |
---|
1 | GIS1.6中默认只展示配电网架电网图 |
1.4.6
1.4.7
# | 更新内容 |
---|
1 | 设置thgis-map组件中 :gis-source="1" 控制gis数据来源,0:gis1.6,1:中台 |
2.0.0
# | 更新内容 |
---|
1 | 处理dwt无法展示,报become错误时,因core-js依赖问题导致错误,请先删除 npm uninstall core-js,再安装指定版本 npm i core-js@3.6.5,只能使用core-js@3.6.5 |
2 | 拆分地图初始化方法,不同地图使用不同是mixins类初始化 |
3 | 优化当个单击事件未触发单击事件bug |
4 | 删除某些未使用依赖 |
5 | 底图dwt开关实现 |
2.0.3
# | 更新内容 |
---|
1 | 在1.6中无法分割轨迹问题处理 |
2 | 优化坐标转换接口 |
3 | 在zhongtai地图中无法使用聚合效果,去除zhongtai的地图,只是使用zhongtai的dw图 |
3 | 在1.6情况中获取的zoom与其他地图有5级差别,1.6自动转换热力图判断时需要+5级别 |
2.1.1
# | 更新内容 |
---|
1 | GIS2.0地图加载,需要添加GIS2.0鉴权认证,1:index.html中引入sm3.js. 2: 中需要传入申请的应用appkey和密钥secretkey,egisappkey="",egissecretkey="" |
2 | 优化地图开关控制相关功能,实现wangjia隐藏和展示, 默认设置 :layers-visable="false" 不展示,true 展示 |
2.1.2
# | 更新内容 |
---|
1 | 中需要传入申请的应用appkey和密钥secretkey,egisappkey="",egissecretkey="",为空时调用测试token |
2.1.3
2.1.5
# | 更新内容 |
---|
1 | 轨迹展示优化,新增 接单,到达,勘查,完成,节点展示,通过数据驱动 |
2 | 新增,在gis2.0中可通过 new MapViewVo().sgMap.setPitch(number) 方式设置地图旋转角度,模拟2.5D效果 |
2.1.6
2.1.9
# | 更新内容 |
---|
1 | 新增电源追溯,同设备上级开关分析,线路流动效果展示 |
2 | 新增ThgisMetadataService 数据模型服务,ThgisTopoService topo分析服务 |
2.1.11
2.1.12
# | 更新内容 |
---|
1 | 优化自动转换热力图效果颜色 |
2 | 新增测试网架单击事件添加,并提供对分析出来的结果,每条数据可注册自己的单击事件 |
2.2.1
# | 更新内容 |
---|
1 | egis,epgis版本全部使用最新1.5.0版本 |
2 | 修改展示网架矢量图方式,需要在入口处设置展示网架矢量文件 |
2.2.2
2.2.3
# | 更新内容 |
---|
1 | 优化token失效问题 |
2 | 控制网架过滤条件设置,可通过dydj,ssds限制数据显示 |
3 | 导航规划展示 |
2.2.4
# | 更新内容 |
---|
1 | 新增通过设备类型,设备名称模糊搜索dw设备 |
2.2.6
# | 更新内容 |
---|
1 | 电网等级控制优化 |
2 | 轨迹,导航重构 |
3 | 设备类型,名称检索 |
2.2.7
# | 更新内容 |
---|
1 | 河北中台wangjia控制bug修复 |
2 | 调用gis服务定位locationFromOid可通过pmsid 或者 oid属性定位 |
3 | 网架默认点击事件可修改选中设备颜色,可自定义颜色 |
2.2.8
# | 更新内容 |
---|
1 | gis2.0中轨迹异常修复 |
2 | removeArrayItem工具类优化,不再修改原始数据 |
3 | findSupplyrange供电范围分析 |
2.2.11
# | 更新内容 |
---|
1 | ThgisCommon.unitMaskBounds(geojson,color)新增遮罩区域限制,添加遮罩后,地图无法移动到其他区域 |
2 | 轨迹数据根据距离分割数据量限制,只分割100个点以内的数据 |
3 | 其他新能及功能点优化 |
2.2.13
# | 更新内容 |
---|
1 | locationGraphics 兼容所有图形都可通过图片展示,不再限制Point才展示 |
2 | 优化居中时,上下边距为30px |
2.2.14
# | 更新内容 |
---|
1 | 修复图形定位单击事件冒泡,导致定位点击事件穿透到其他图层 |
2 | 修复地图拖动,边框显白色 |
3 | 修复地图使用Popup弹出窗口内容无法复制问题 |
4 | 默认隐藏电压等级220V线路网架 |
5 | 其他问题修复,性能优化 |
2.2.15
# | 更新内容 |
---|
1 | 热力图优化,防止多次调用时丢失找到的keys导致无法转换 |
2 | 优化枚举数据被改变问题 |
3 | 优化定位图片偏移设置问题 |
4 | 其他优化,功能修复 |
2.2.16
# | 更新内容 |
---|
1 | 轨迹提示面板,监听事件优化,同一条轨迹数据无法展示提示面板问题 |
2 | 供电区域限制后最小地图级别限制 |
3 | 关闭graphic移入移出冒泡事件,会导致前期移入移出出现异常 ,先打开冒泡事件 |
4 | 其他优化,功能修复 |
2.2.17
# | 更新内容 |
---|
1 | 自定义模板中多个提示框关闭,只展示一个 |
2 | 新增矩形分析,圆形分析范围内设备 |
3 | 其他优化,功能修复 |
2.2.18
# | 更新内容 |
---|
1 | 请求认证校验优化 |
2 | 使用locationGraphics定位的图形,图片,可通过添加属性flickering=true进行闪烁展示 |
3 | 功能优化 |
2.2.19
# | 更新内容 |
---|
1 | 批量设备图形数据查询,自动分批次查询 |
2 | vo对象可全部冲ThgisCommon中获取 |
3 | 优化坐标转换一次性数据量 |
4 | 功能优化,已知bug修复 |
2.2.20
# | 更新内容 |
---|
1 | 区域内查询自动添加缓存 |
2 | 优化单条数据匹配参数设置 |
3 | 优化默认自动切换热力图样式展示可控 |
4 | 功能优化,已知bug修复 |
2.2.22
# | 更新内容 |
---|
1 | 修复定位后事件重复注册问题 |
2 | 修复矢量图形定位时使用图片定位偏移量问题 |
3 | 功能优化,已知bug修复 |
2.3.1
# | 更新内容 |
---|
1 | 修复轨迹中会遗留上一次导航的信息 |
2 | 闪烁图层定位展示后返回图层,用于后期停止闪烁或者开启闪烁 |
3 | 功能优化,已知bug修复 |
查看实例
const datas = []
datas.push({
iconsrc: '/assets/img/marker.png',
shape: 'LINESTRING (115.97085569612683 28.60867310408503,115.90164187923075 28.483428862877194,115.61709596402945 28.53506469726563,115.58523559570314 28.66909790877253)'
})
const effect = {
flickering: true,//是否闪烁
updateRate: 300, //闪烁频率
opacity: 0.3//闪烁时透明度
}
const events_ = {
click: () => {
console.log('dianji')
}
}
const rs = ThgisLocation.locationGraphics('th-sansuo', datas, events_, effect)
this.flickerLayer = rs.layer
//停止闪烁
this.flickerLayer.setFlickering(false)
//开始闪烁
this.flickerLayer.setFlickering(true)
2.3.2
# | 更新内容 |
---|
1 | 优化闪烁可外部控制,默认 300,0.7透明度,label标签只显示名词,去除背景及边框 |
2 | 定位数据转换时,异常数据过滤,不符合地图范围内的坐标全部过滤 |
3 | 轨迹面板中提示信息过长处理 |
4 | layerName改名layerId |
5 | 功能优化,已知bug修复 |
2.3.201
# | 更新内容 |
---|
1 | 功能优化,已知bug修复 |
2 | 修复因环境问题导致坐标转换数量超额问题 |
3 | 新增定位时显示简单的标记内容 |
4 | 优化区域搜索接口参数支持 |
//如果定位时要显示简单标记文字时,可设置这些参数显示标记文字
//这些是默认标记属性
const labelOptions = {
color: '#000000',//文字颜色
outline: { color: 'rgb(255,255,255)', linewidth: 1 },//边框线路设置
opacity: 0,//透明度
fill: false,//是否填充
backgroundColor: 'rgba(255,255,255,0)',//背景颜色
isChangeByScale: false,//是否更具地图变化而改变大小
font: '14px sans-serif',//字体样式
offset: [0, 0]//标记内容偏移量
}
//设置 showLabel=1 就会开启显示 datas中label的内容
//labelOptions是设置标签样式,可不设置此参数,采用默认样式
const datas = {
shape:'115.45454,28.212121',
label:'标记内容'
}
ThgisLocation.locationGraphics(
'layerid',
datas,
null
{ showLabel: 1,
labelOptions: { color: '#ff0001', offset: [0, -20] }})
2.3.203
# | 更新内容 |
---|
1 | 优化缓存机制,使用delete objkey 替换 objkey = null方法,删除存储的变量 |
2 | 多人轨迹展示,异常人员展示BatchTrack |
3 | 功能优化,已知bug修复 |
2.3.206
# | 更新内容 |
---|
1 | 多人轨迹展示同步数据,面板展示,轨迹同步 |
2 | 添加自定义面板后,导致已定位的中心点无法点击,添加class:th_divIcon_label |
3 | addCustomPanel 添加入参layerId,可设置layerId |
4 | 已展示轨迹自动变更时间节点位置 |
5 | 功能优化,已知bug修复 |
2.3.207
# | 更新内容 |
---|
1 | 优化oid定位时同步请求时发生异常不返回问题 |
2 | 功能优化,已知bug修复 |
2.3.208
# | 更新内容 |
---|
1 | marker及聚合定位方法实现闪烁效果,自定义标签显示 |
2 | 优化流动效果显示 |
3 | 功能优化,已知bug修复 |
2.3.209
# | 更新内容 |
---|
1 | marker 闪烁会把原始图片放大20%防止多个定位重叠,无法查看闪烁 |
2 | 优化单个定位查找isCenter属性失效问题 |
3 | 优化根据多个点生成的面坐标转换的问题 |
4 | 绘制功能添加标签,添加添加,移除事件 |
5 | 功能优化,已知bug修复 |
2.3.210
# | 更新内容 |
---|
1 | 解决流动效果中坐标顺序反了导致首尾相连异常 |
2 | 优化轨迹中closeBtn效果失效问题,有enddate时自动转换成已到达现场 |
3 | ThgisLocation.showOrhideValues(values,true)新增可通过返回values进行隐藏或者显示定位内容 |
4 | 功能优化,已知bug修复 |
2.3.211
# | 更新内容 |
---|
1 | 叠加区域限制展示时转换坐标从gcj02=>wgs84 |
2 | 新增mock数据接口地址 mockUrl |
3 | 支持重复展示多人轨迹 |
4 | 功能优化,已知bug修复 |
2.3.212
# | 更新内容 |
---|
1 | 新增定位数据处理时options设置crsFrom{String}属性,默认: WGS84,坐标系来源支撑多种类型--WGS84:gps、EPSG3857:gps投影、GCJ02:火星BD09:百度、BD09MC:百度投影 |
2 | GIS2.0支持灰浅色地图,可设置地图默认样式--Streets:标准底图、StreetsLight:浅色底图、Satellite512:影像底图 |
3 | 支持根据某个坐标在指定的级别居中显示ThgisLocation.centerAtCoordiantes(coor,zoom) |
4 | 功能优化,已知bug修复 |
2.3.300
# | 更新内容 |
---|
1 | 定位添加corrugated{Boolean} 是否添加波纹效果 |
2 | 定位添加centerZoom{Number}可控制居中效果地图层级 |
3 | 定位添加maxZoom{Number}可控制矢量点线面的最大展示级别,超过不展示 |
4 | 自定义添加波纹特效,可根据定位的values 调用addCorrugatedByValues或者定位前的datas 调用 addCorrugated |
5 | 功能优化,深拷贝,优化线路数据格式解析,已知bug修复 |
2.3.302
# | 更新内容 |
---|
1 | 修复多人轨迹中,新增协查人员导致人员定位重新绘制问题修复 |
2 | 功能优化,定位深拷贝移除,否则会导致原始数据中无center及geometry使用,已知bug修复 |
2.4.2
# | 更新内容 |
---|
1 | 添加时间戳校验,在展示数据中添加timestamp参数,可控制异步加载数据慢时,此数据需要被清理,而未被清理情况 |
2 | 功能优化,深拷贝,优化线路 |
3.0.0
# | 更新内容 |
---|
1 | ThgisMeasurement 测量计算 |