本发明专利技术公开了一种道路信息展示与变更方法及系统,属于交通管理技术领域,包括:获取道路信息,所述道路信息包括进出口车道数据、进出口车道名称、道路编码以及道路分隔标识;基于html、pug、svg技术,对所述道路信息进行处理,得到dom元素布局;将dom元素布局在客户端解析生成车道形式数据进行展示。本发明专利技术实体化修改使用道路信息,高效解决了原有道路信息更新困难、更新不及时、用户体验差的效果。更新不及时、用户体验差的效果。更新不及时、用户体验差的效果。
【技术实现步骤摘要】
一种道路信息展示与变更方法及系统
[0001]本专利技术涉及交通管理
,特别涉及一种道路信息展示与变更方法及系统。
技术介绍
[0002]“道路”是指公路、城市道路和虽在单位管辖范围但允许社会机动车通行的地方,随着我国道路交通体系的发展,存在道路多处扩建、车道信息变更等问题,往往信息变更还需要专业的技术人员进行填报申明变更,过程复杂,变更不及时。同时在正反道路的路段上分隔标识如绿化带、黄实线、护栏等在实际交通中有体现,但是在道路信息展示方面未做具体标识,不方便做出实体道路测算面积的评估。
技术实现思路
[0003]本专利技术的目的在于克服现有技术存在的缺陷,可简单快速的进行车道信息变更。
[0004]为实现以上目的,一方面,本专利技术采用一种道路信息展示与变更方法,包括:
[0005]获取道路信息,所述道路信息包括进出口车道数据、进出口车道名称、道路编码以及道路分隔标识;
[0006]基于html、pug、svg技术,对所述道路信息进行处理,得到dom元素布局;
[0007]将dom元素布局在客户端解析生成车道形式数据进行展示。
[0008]进一步地,所述dom元素布局包括容器元素g和div,容器元素g嵌套有用于构成道路信息的标签元素,容器元素div嵌套有用于img和a
‑
icon标签元素。
[0009]进一步地,所述将dom元素布局在客户端解析生成车道形式数据进行展示,包括:
[0010]将所述容器元素g在所述客户端解析生成车道形式数据,包括车道增加图标、车道删除图标、出口车道分隔线、绿化带标识、路段名称、路段操作展示区域、进口车道分隔线、车道方向新增图标、车道方向功能图标、主辅路段合并标识以及黄实线标识,其中车道分隔线之间的宽度根据互联网数据传输的车道实际宽度与对应的比例生成,即车道分隔线两两之间生成车道;
[0011]将所述容器元素div在所述客户端解析生成方向面板,方向面板展示有道路各个方向标识和面板控制标识叉图形,方向面板与车道方向新增图标联动。
[0012]进一步地,还包括:
[0013]获取车道增加图标和车道删除图标的点击指令,对车道数量进行修改;
[0014]获取车道方向或车道方向新增按钮的点击指令,弹出所述方向面板,并获取方向标识的点击指令,以对车道方向进行修改。
[0015]进一步地,还包括:
[0016]将修改后的车道信息传送互联网平台,以对车道信息进行变更。
[0017]另一方面,采用一种道路信息展示与变更系统,包括信息获取模块、布局模块和展示模块,其中:
[0018]信息获取模块用于获取道路信息,所述道路信息包括进出口车道数据、进出口车
道名称、道路编码以及道路分隔标识;
[0019]布局模块用于基于html、pug、svg技术,对所述道路信息进行处理,得到dom元素布局;
[0020]展示模块用于将dom元素布局在客户端解析生成车道形式数据进行展示。
[0021]进一步地,所述dom元素布局包括容器元素g和div,容器元素g嵌套有用于构成道路信息的标签元素,容器元素div嵌套有用于img和a
‑
icon标签元素。
[0022]进一步地,所述展示模块具体用于:
[0023]将所述容器元素g在所述客户端解析生成车道形式数据,包括车道增加图标、车道删除图标、出口车道分隔线、绿化带标识、路段名称、路段操作展示区域、进口车道分隔线、车道方向新增图标、车道方向功能图标、主辅路段合并标识以及黄实线标识;
[0024]将所述容器元素div在所述客户端解析生成方向面板,方向面板展示有道路各个方向标识和面板控制标识叉图形,方向面板与车道方向新增图标联动。
[0025]进一步地,还包括道路信息修改模块,用于获取车道增加图标和车道删除图标的点击指令,对车道数量进行修改;
[0026]获取车道方向或车道方向新增按钮的点击指令,弹出所述方向面板,并获取方向标识的点击指令,以对车道方向进行修改。
[0027]进一步地,还包括道路信息更新模块,用于将修改后的车道信息传送互联网平台,以对车道信息进行变更。
[0028]与现有技术相比,本专利技术存在以下技术效果:本专利技术通过接入互联网平台道路信息数据,并在svg、g、line、path等标签的综合应用下,生成车道形式数据进行展示,在车道信息发生变化时,过点击操作图标即可对信息进行修改,同时对道路路段上的分隔标识做出具体标识进行展示,根据互联网数据反馈的实体车道数据以及比例要求,定量出现有图案的生成宽度,方便做出实体道路测算面积的评估。
附图说明
[0029]下面结合附图,对本专利技术的具体实施方式进行详细描述:
[0030]图1是一种道路信息展示与变更方法的流程图;
[0031]图2是某一路段的车道形式数据展示效果图;
[0032]图3是以图2做对比生成的同一路段下不同车道不同形式下的展示效果图;
[0033]图4是以图2做对比生成的同一路段下不同车道不同形式下的展示效果图;
[0034]图5是以图2做对比生成的同一路段下不同车道不同形式下的展示效果图;
[0035]图6是以图2做对比生成的同一路段下不同车道不同形式下的展示效果图;
[0036]图7是一种道路信息展示与变更系统的结构图。
[0037]图中:
[0038]1‑
车道增加图标;2
‑
车道删除图标;3
‑
出口车道分隔线;4
‑
绿化带标识;5
‑
路段名称;6
‑
路段操作展示区域;7
‑
进口车道分隔线;8
‑
车道方向新增图标;9
‑
车道方向功能图标;10
‑
主辅路段合并标识;11
‑
黄实线标识;12
‑
方向面板。
具体实施方式
[0039]为了更进一步说明本专利技术的特征,请参阅以下有关本专利技术的详细说明与附图。所附图仅供参考与说明之用,并非用来对本专利技术的保护范围加以限制。
[0040]如图1所示,本实施例公开了一种道路信息展示与变更方法,包括如下步骤:
[0041]S1、获取道路信息,所述道路信息包括进出口车道数据、进出口车道名称、道路编码以及道路分隔标识;
[0042]S2、基于html、pug、svg技术,对所述道路信息进行处理,得到dom元素布局;
[0043]S3、将dom元素布局在客户端解析生成车道形式数据进行展示。
[0044]需要说明的是,本实施例通过axios或者ajax技术源以互联网http传输协议或https传输协议下接口调用的方式获取道路信息,道路信息包括:进出口车道数据、进出口车道名称、道路编码以及道路分隔标识,进出口车道数据包括车道编码即车道i本文档来自技高网...
【技术保护点】
【技术特征摘要】
1.一种道路信息展示与变更方法,其特征在于,包括:获取道路信息,所述道路信息包括进出口车道数据、进出口车道名称、道路编码以及道路分隔标识;基于html、pug、svg技术,对所述道路信息进行处理,得到dom元素布局;将dom元素布局在客户端解析生成车道形式数据进行展示。2.如权利要求1所述的道路信息展示与变更方法,其特征在于,所述dom元素布局包括容器元素g和div,容器元素g嵌套有用于构成道路信息的标签元素,容器元素div嵌套有用于img和a
‑
icon标签元素。3.如权利要求2所述的道路信息展示与变更方法,其特征在于,所述将dom元素布局在客户端解析生成车道形式数据进行展示,包括:将所述容器元素g在所述客户端解析生成车道形式数据,包括车道增加图标、车道删除图标、出口车道分隔线、绿化带标识、路段名称、路段操作展示区域、进口车道分隔线、车道方向新增图标、车道方向功能图标、主辅路段合并标识以及黄实线标识;将所述容器元素div在所述客户端解析生成方向面板,方向面板展示有道路各个方向标识和面板控制标识叉图形,方向面板与车道方向新增图标联动。4.如权利要求3所述的道路信息展示与变更方法,其特征在于,还包括:获取车道增加图标和车道删除图标的点击指令,对车道数量进行修改;获取车道方向或车道方向新增按钮的点击指令,弹出所述方向面板,并获取方向标识的点击指令,以对车道方向进行修改。5.如权利要求4所述的道路信息展示与变更方法,其特征在于,还包括:将修改后的车道信息传送互联网平台,以对车道信息进行变更。6.一种道路信息展示与变更系统,其特征在于,包括信息...
【专利技术属性】
技术研发人员:李圳,吕建成,周宇林,罗雄飞,王玉梅,
申请(专利权)人:安徽科力信息产业有限责任公司,
类型:发明
国别省市:
还没有人留言评论。发表了对其他浏览者有用的留言会获得科技券。