一种基于纯网络脚本语言的跨终端自适应可视化电子地图实现方法

xiaoxiao2020-10-23  13

一种基于纯网络脚本语言的跨终端自适应可视化电子地图实现方法
【技术领域】
[0001]本发明涉及网络地理信息系统领域,具体而言,涉及一种基于纯网络脚本语言的跨终端自适应可视化电子地图实现方法。
【背景技术】
[0002]在现有的网络地理信息系统(WebGIS)领域,针对不同终端需要根据各终端的特点(即其显示处理能力等)进行单独的WebGIS地图软件开发,针对不同终端的适用主要是通过利用在不同终端中可以使用的不同开发语言,开发适应不同终端和相应操作系统的应用程序,如:PC端服务,手机端APP,Pad端APP等,并会根据不同终端的不同操作系统进行相应的开发,如:移动端安卓系统和1S系统,这种针对不同终端的适应方式的缺点主要体现为,较多的开发人力投入,对开发人员针对不同终端的开发语言的掌握要求严格,由于各自开发造成维护版本众多,对后期的版本升级造成困难,对新需求的响应速度慢,由于开发语言不同会出现展现风格的不一致,对基于该电子地图的二次开发人员来说不容易掌握。

【发明内容】

[0003]本发明提供一种基于纯网络脚本语言的跨终端自适应可视化电子地图实现方法,用以克服现有技术中存在的既耗费人力又不能保持WebGIS地图的统一风格和性能的缺点。
[0004]在现有WebGIS领域中
[0005]为达到上述目的,本发明提供了一种基于纯网络脚本语言的跨终端自适应可视化电子地图实现方法,包括以下步骤:
[0006]接收由用户终端浏览器发出的电子地图获取请求,根据所述电子地图获取请求辨别出用户终端类型,其中,所述电子地图获取请求中包含用于识别用户终端类型的信息和所请求的地图数据信息;
[0007]调用主脚本文件,通过所述主脚本文件获取所述用户终端类型对应的展现样式库,以及通过所述主脚本文件调用所述用户终端类型匹配的矢量绘制模型;
[0008]所请求的地图数据信息,通过所述主脚本文件向后端地图数据库请求获取所请求的地图数据;
[0009]将所获取的匹配脚本、展现样式库、矢量绘制模型以及所请求的地图数据发送到所述用户终端的浏览器上进行地图展现。
[0010]进一步地,基于JavaScript语言标准编写一套网络电子地图实现与展现的API。
[0011]进一步地,所述展现样式库包括有多种,每种展现样式库对应一种相应类型的用户终端以实现在相应用户终端上的显示展现,每种展现样式库均以CSS3标准建立。
[0012]进一步地,所述矢量绘制模型包括有多种,每种矢量绘制模型对应一种相应类型的用户终端以实现在相应用户终端上的前端地图的动态矢量绘制,每种矢量绘制模型均以HTML5标准建立。
[0013]进一步地,在移动终端,采用虚拟图标作为所述跨终端自适应可视化电子地图的入口,当用户触发所述虚拟图标时,调用该移动终端上自带的浏览器,其中,所打开的浏览器页面仅包含展现窗口。
[0014]与现有技术相比,本发明实现了以下有益效果:
[0015]1、对于软件开发公司来说,节省人力,缩短开发时间,精简软件版本,提高系统升级维护效率;
[0016]2、对于各终端的二次开发人员来说可以做到开发门槛滴,上手速度快,易于掌握;
[0017]3、做到一处编写,处处运行,实现真正意义上的自适应可视化电子地图。
【附图说明】
[0018]为了更清楚地说明本发明实施例或现有技术中的技术方案,下面将对实施例或现有技术描述中所需要使用的附图作简单地介绍,显而易见地,下面描述中的附图仅仅是本发明的一些实施例,对于本领域普通技术人员来讲,在不付出创造性劳动的前提下,还可以根据这些附图获得其他的附图。
[0019]图1为本发明一个实施例的基于纯网络脚本语言的跨终端自适应可视化电子地图实现方法流程图。
【具体实施方式】
[0020]下面将结合本发明实施例中的附图,对本发明实施例中的技术方案进行清楚、完整地描述,显然,所描述的实施例仅仅是本发明一部分实施例,而不是全部的实施例。基于本发明中的实施例,本领域普通技术人员在没有付出创造性劳动前提下所获得的所有其他实施例,都属于本发明保护的范围。
[0021]本发明实现过程是,如果希望实现同一程序在不同终端的自适应,那么首先需要找到一个可以运行在不同终端、不同操作系统的开发语言,这种语言即网络脚本语言,之所以做出该判断是因为现有各类智能终端,无论是PC,手机或Pad等都预装有浏览器,而脚本语言是运行在浏览器上的一种语言,再者由于HTML5、CSS3等新标准的出现统一了各浏览器的解析识别规则,这就使得脚本语言成为可以运行在任意智能终端和不同操作系统上的唯一编程语言,从而使我们的这种新技术的实现成为可能。而我们所提出的该技术正是基于以上的判定并利用这些新的通用标准而实现的。
[0022]本发明中涉及的技术名词解释如下:
[0023]电子地图:电子地图是地图制作和应用的一个系统,是由电子计算机控制所生成的地图,是基于数字制图技术的屏幕地图,是可视化的实地图。
[0024]脚本语言:脚本语言是为了缩短传统的编写-编译-链接-运行(edit-compile-link-run)过程而创建的计算机编程语言。它的命名起源于一个脚本“screenplay”,每次运行都会使对话框逐字重复。一个脚本通常是解释执行而非编译。脚本语言通常都有简单、易学、易用的特性,目的就是希望能让程序员快速完成程序的编写工作。
[0025]JavaScript语言JavaScript—种直译式脚本语言,是一种动态类型、弱类型、基于原型的语言,内置支持类型。它的解释器被称为JavaScript引擎,为浏览器的一部分,广泛用于客户端的脚本语言,最早是在HTML(标准通用标记语言下的一个应用)网页上使用,用来给HTML网页增加动态功能。
[0026]HTML5标准:万维网的核心语言、标准通用标记语言下的一个应用超文本标记语言(HTML)的第五次重大修改。2014年10月29日,万维网联盟宣布,经过几乎8年的艰辛努力,该标准规范终于最终制定完成。
[0027]CSS3标准:CSS即层叠样式表(Cascading StyleSheet)。在网页制作时米用层叠样式表技术,可以有效地对页面的布局、字体、颜色、背景和其它效果实现更加精确的控制。CSS3是CSS技术的升级版本,CSS3语言开发是朝着模块化发展的。
[0028]图1为本发明一个实施例的基于纯网络脚本语言的跨终端自适应可视化电子地图实现方法流程图。如图所示,该基于纯网络脚本语言的跨终端自适应可视化电子地图实现方法包括以下步骤:
[0029]接收由用户终端浏览器发出的电子地图获取请求,根据所述电子地图获取请求辨别出用户终端类型,其中,所述电子地图获取请求中包含用于识别用户终端类型的信息和所请求的地图数据信息;
[0030]调用主脚本文件,通过所述主脚本文件获取所述用户终端类型对应的展现样式库,以及通过所述主脚本文件调用所述用户终端类型匹配的矢量绘制模型;
[0031]所请求的地图数据信息,通过所述主脚本文件向后端地图数据库请求获取所请求的地图数据;
[0032]将所获取的匹配脚本、展现样式库、矢量绘制模型以及所请求的地图数据发送到所述用户终端的浏览器上进行地图展现。
[0033]其中,上述匹配脚本是根据用户的终端类型及其上的浏览器类型自动匹配的相适应的脚本。
[0034]在具体实施时,可以首先基于JavaScript语言标准编写一套网络电子地图实现与展现的API,然后利用CSS3标准 编写一套可自适应不同终端的展现样式库,接下来会利用HTML5标准的强大跨终端绘制能力实现在不同的终端上的电子地图自适应动态绘制模型,结合这三种技术从根本上解决电子地图的跨终端自适应可视化问题。对于电子地图来说,最为重要的无外乎:地图本身的数据调度逻辑、程序本身与用户之间的交互;获取到数据后的地图绘制;以及所绘制出的点线面这样的几何图形的样式与颜色这三部分内容组成。而javascript语言本身是一个跨浏览器的程序逻辑实现与交互语言,HTML5是一个由W3C所定义的在浏览器端的图形绘制语言,并且该语言相较原有的浏览器绘制语言来说,具有高速和标准化等优点,现在几乎被各种浏览器所支持,CSS3本身是一种用于在浏览器中实现各种样式与布局的专用语言,并具有传统样式表技术所不具备的效果和性能,本发明将这三种技术相结合进行使用,从而在浏览器端真正解决电子地图的自适应可视化问题。
[0035]其中,基于JavaScript语言标准编写一套网络电子地图实现与展现的API运行在用户终端上,当用户终端为移动终端时,可以采用虚拟图标作为所述跨终端自适应可视化电子地图的入口,当用户触发所述虚拟图标时,调用该移动终端上自带的浏览器,其中,所打开的浏览器页面仅包含展现窗口,而没有一般浏览器的URL地址栏,状态栏等。
[0036]上述接口 API是指用于针对展示地图平台的能够被其他程序或二次开发人员调用的一套程序接口。
[0037]上述展现窗口是指将通常在各终端上使用的浏览器除了 URL地址栏、状态栏、工具栏等以外的部分称之为展现窗口,在调用浏览器时自动将这些部分隐藏掉(隐藏的手段是浏览器本身提供的,并且可以通过脚本自动调用),这样做的目的是让使用者感觉和通常的APP窗口相同,而浏览器本身是可以通过脚本的调用自动向服务器端发送请求并返回所请求的地图数据的,不需要用户主动地去输入如http://map.baidu.com/这样的URL,原因是对于客户端来说地图服务器都是一个相同的统一入口。
[0038]其中,所述展现样式库包括有多种,每种展现样式库对应一种相应类型的用户终端以实现在相应用户终端上的显示展现,每种展现样式库均以CSS3标准建立。
[0039]其中,所述矢量绘制模型包括有多种,每种矢量绘制模型对应一种相应类型的用户终端以实现在相应用户终端上的前端地图的动态矢量绘制,每种矢量绘制模型均以HTML5标准建立。
[0040]在本发明的实施例中,主脚本文件本身对于不同终端的识别是根据终端向服务器的第一次请求所判定的,系统会根据不同终端调用不同的展现样式表,从而解决在不同展现终端上由于终端的运算能力,展现能力,屏幕分辨率大小等差异所造成的电子地图本身的风格差异冋题。
[0041]另外针对移动终端,本发明采用了虚拟图标技术,即对于使用者来说,他所能看到的、在移动端上的电子地图入口和一般的移动端APP的图标相同,但是该入口其实内部没有任何电子地图的相关实现,只是去调用了终端上自带的浏览器,但其所打开的浏览器只包含展现窗口部分而没有一般浏览器的URL地址栏,状态栏等,这样对于用户来说一方面不需要输入电子地图的访问地址,另一方面在使用习惯上也会与一般的移动端APP相同,该图标类似于一个快捷方式。该解决方案本质上不论是在PC端还是各类移动端所调用的都是同一套电子地图API,只是服务器根据终端的不同调用了不同的样式表而已,该技术既避免了传统方式中针对不同终端的多次开发和后期的维护成本较高的弊病又保持的电子地图在不同终端的风格一致性,并实现了电子地图在前端的动态矢量绘制功能,最终实现真正意义上的跨终端自适应可视化电子地图。一句话来形容该技术,即一处编写,处处运行。
[0042]综上可知,本发明一方面由于使用统一的开发语言及标准需要投入的人力较少,另一方面由于脚本语言的易用性从而降低了对开发人员的技术要求。由于对不同终端的支持只需要不同的样式库使得系统本身的版本较少,维护成本较低,升级速度快,能够更好的满足用户的需求。电子地图本身对于不同终端的显示风格将趋于一致,二次开发较容易。
[0043]本领域普通技术人员可以理解:附图只是一个实施例的示意图,附图中的模块或流程并不一定是实施本发明所必须的。
[0044]本领域普通技术人员可以理解:实施例中的装置中的模块可以按照实施例描述分布于实施例的装置中,也可以进行相应变化位于不同于本实施例的一个或多个装置中。上述实施例的模块可以合并为一个模块,也可以进一步拆分成多个子模块。
[0045]最后应说明的是:以上实施例仅用以说明本发明的技术方案,而非对其限制;尽管参照前述实施例对本发明进行了详细的说明,本领域的普通技术人员应当理解:其依然可以对前述实施例所记载的技术方案进行修改,或者对其中部分技术特征进行等同替换;而这些修改或者替换,并不使相应技术方案的本质脱离本发明实施例技术方案的精神和范围。
【主权项】
1.一种基于纯网络脚本语言的跨终端自适应可视化电子地图实现方法,其特征在于,包括以下步骤: 接收由用户终端浏览器发出的电子地图获取请求,根据所述电子地图获取请求辨别出用户终端类型,其中,所述电子地图获取请求中包含用于识别用户终端类型的信息和所请求的地图数据信息; 调用主脚本文件,通过所述主脚本文件获取所述用户终端类型对应的展现样式库,以及通过所述主脚本文件调用所述用户终端类型匹配的矢量绘制模型; 所请求的地图数据信息,通过所述主脚本文件向后端地图数据库请求获取所请求的地图数据; 将所获取的匹配脚本、展现样式库、矢量绘制模型以及所请求的地图数据发送到所述用户终端的浏览器上进行地图展现。2.根据权利要求1所述的跨终端自适应可视化电子地图实现方法,其特征在于,基于JavaScript语言标准编写一套网络电子地图实现与展现的应用程序接口 API。3.根据权利要求1所述的跨终端自适应可视化电子地图实现方法,其特征在于,所述展现样式库包括有多种,每种展现样式库对应一种相应类型的用户终端以实现在相应用户终端上的显示展现,每种展现样式库均以CSS3标准建立。4.根据权利要求1所述的跨终端自适应可视化电子地图实现方法,其特征在于,所述矢量绘制模型包括有多种,每种矢量绘制模型对应一种相应类型的用户终端以实现在相应用户终端上的前端地图的动态矢量绘制,每种矢量绘制模型均以HTML5标准建立。5.根据权利要求1所述的跨终端自适应可视化电子地图实现方法,其特征在于,在移动终端,采用虚拟图标作为所述跨终端自适应可视化电子地图的入口,当用户触发所述虚拟图标时,调用该移动终端上自带的浏览器,其中,所打开的浏览器页面仅包含展现窗口。
【专利摘要】本发明公开一种基于纯网络脚本语言的跨终端自适应可视化电子地图实现方法,包括以下步骤:接收由用户终端浏览器发出的电子地图获取请求,根据所述电子地图获取请求辨别出用户终端类型,其中,所述电子地图获取请求中包含用于识别用户终端类型的信息和所请求的地图数据信息;调用主脚本文件,通过所述主脚本文件获取所述用户终端类型对应的展现样式库,以及通过所述主脚本文件调用所述用户终端类型匹配的矢量绘制模型;所请求的地图数据信息,通过所述主脚本文件向后端地图数据库请求获取所请求的地图数据;将所获取的匹配脚本、展现样式库、矢量绘制模型以及所请求的地图数据发送到所述用户终端的浏览器上进行地图展现。
【IPC分类】G06F17/30
【公开号】CN104881430
【申请号】CN201510184830
【发明人】陈菡, 王嘉, 欧翔
【申请人】北京天耀宏图科技有限公司
【公开日】2015年9月2日
【申请日】2015年4月17日
转载请注明原文地址:https://www.famiwei.com/read-8138645.html

最新回复(0)