【技术实现步骤摘要】
一种基于SVG技术的盾构推进平剖面图进度展示方法
[0001]本专利技术属于盾构推进过程中的平剖面图进度展示
，具体涉及一种基于SVG技术的盾构推进平剖面图进度展示方法。
技术介绍
[0002]盾构施工管控平台的管控人员需要通过网页端实时掌握盾构机的推进过程信息，尤其是盾构机周围的地层、地质信息和施工现场周围的环境信息。在盾构推进进度展示方面，目前尚未查询到有效的展示方法。CAD格式的文件无法展示在网页端，其他传统的图像格式为静态图像，无法实现动态交互功能以及动画显示效果。
技术实现思路
[0003]针对现有技术存在的缺陷，本专利技术的目的是提供一种基于SVG技术的盾构推进平剖面图进度展示方法，为盾构施工管控平台的管控人员提供准确、直观、实时的盾构推进进度信息。
[0004]为达到上述目的，本专利技术采用如下技术方案：
[0005]一种基于SVG技术的盾构推进平剖面图进度展示方法，包括如下步骤：
[0006]1)获取平面图轴线、平面图隧道宽度线、剖面图轴线和剖面图隧道宽度线的坐标...
【技术保护点】
【技术特征摘要】
1.一种基于SVG技术的盾构推进平剖面图进度展示方法，其特征在于，包括如下步骤：1)获取平面图轴线、平面图隧道宽度线、剖面图轴线和剖面图隧道宽度线的坐标信息；2)在平台前端html文件中添加显示内容的<div>标签以及<svg>标签；3)使用JavaScript语言，根据盾构推进过程的实时数据对盾构机实际推进状态进行更新。2.根据权利要求1所述的基于SVG技术的盾构推进平剖面图进度展示方法，其特征在于，所述步骤1)的坐标信息通过隧道地质图获取，具体包括以下过程：1
‑
1)采用异步加载的方式将SVG文件加载至网页端；1
‑
2)通过JavaScript的lastElementChild函数从SVG文件中获取<svg>标签中的最后一个<g>标签，再通过firstElementChild函数和nextElementSibling函数获取<polyline>标签，进而获取到平面图轴线、平面图隧道宽度线、剖面图轴线和剖面图隧道宽度线的坐标信息；1
‑
3)声明一个方向变量来表示盾构推进平剖面图进度展示左右推进方向。3.根据权利要求1所述的基于SVG技术的盾构推进平剖面图进度展示方法，其特征在于，所述步骤2)包括以下过程：2
‑
1)在平台前端html格式文件中添加一个<div>标签，用来存放展示平剖面图需要用到的元素，其中宽度和高度为平台前端html页面的可视区域的宽度和高度；2
‑
2)在平台前端html格式文件中添加一个<svg>标签，在该标签上添加display属性，属性值设为inline
‑
block；在该标签上添加preserveAspectRatio属性，属性值设为xMidYMid slice，使得缩放平剖面图展示时保留纵横比；在该标签上添加translate的属性值，属性值设为鼠标拖拽两个坐标点之间的差值；在该标签上添加scale的属性值，属性值初始设为1；2
‑
3)在<svg>标签内添加一个<path>标签，在该标签上添加id属性，属性值设为plane_motionPath；在该标签上添加stroke属性，属性值设为blue，用于展示已经推进完成的隧道部分；在该标签上添加fill属性，属性值设为none；在该标签上添加stroke
‑
width属性，属性值设为隧道宽度线的长度；在该标签上添加stroke
‑
linecap属性，属性值设为butt；在该标签上添加d属性，属性值设为盾构机当前坐标及平面图轴线或剖面图轴线上盾构机之前的所有点的坐标；2
‑
4)在<svg>标签内添加一个<image>标签，在该标签上添加id属性，属性值设为plane_img；在该标签上添加xlink:href属性，属性值设为盾构机图片的存储路径；在该标签上添加x属性，属性值设为0；在该标签上添加y属性，属性值设为隧道宽度线长度的一半的相反数；在该标签上添加height属性，属性值设为隧道宽度线的长度；2
‑
5)在<svg>标签内添加一个<animateMoti...
【专利技术属性】
技术研发人员：高新闻，徐政，杨雨蒙，胡珉，周丽，
申请(专利权)人：上海大学，
类型：发明
国别省市：
还没有人留言评论。发表了对其他浏览者有用的留言会获得科技券。