vue技术分享ppt_胡中南:Web端GIS技术新进展 | GTC专题论坛报告(视频+PPT+速记)

428171fc28157ed22c104de321b2984d.png

点击图片上方蓝色字体“慧天地”即可订阅

0c0e32ff9fd178d2bd6f229a072798d2.gif文章转载自微信公众号GIS软件技术大会,版权归原作者及刊载媒体所有。

773edb44a2de5878b6fb6f026474d2af.png 05386b911a071418d8d58a76854e4870.gif

在GTC 2020『GIS基础软件新技术论坛』上,超图研究院副院长胡中南作《云原生GIS及Web端技术新进展》报告,他首先系统讲解了云原生GIS技术的三大新进展:微服务更微、可扩展,容器化部署更全、更易用,自动化编排适配更多平台等,介绍了这些技术如何支撑云南地质大数据等系统实现高可用、高并发、高弹性“三高”价值;也系统阐述了Web端GIS技术从基础库、组件库、模板库到WebApps的多层次结构及相关新进展,让GIS前端应用开发定制更快速便捷。

本文将分为云原生GIS(点击左侧蓝色文字可直接查看)与Web端GIS两大部分,现分享Web端GIS技术部分资料如下:

演讲PPT

(温馨提示:建议在WiFi环境下观看)

演讲PPT

2196dc4bf789e01c73d7a5d8a5870085.png

上半部分主要讲云原生GIS技术如何助力GIS系统快速部署与运维。

1f32b4d33802ea011977cbe38a451abf.png

接下来我为大家介绍Web端GIS技术。

ea5021e6e6551202abd79280592a80b7.png

以前大家可能认为SuperMap的Web端就是一个SuperMap iClient JavaScript,仅仅是将Leaflet等开源技术做一些封装集成、改进,和SuperMap服务器产品的REST API做了对接,其实这只是我们Web端技术栈的组成之一,也即图上所示的基础的iClient Libraries类库(L1)。

我们在上面还提供了iClient Components,就是所谓的WebGIS组件库(L2),适配了Vue框架和React框架。在这之上我们面向行业应用共性,基于组件库进一步封装,提供了Web模板库iClient Templates(L3),只需将数据、LOGO和图片等进行简单修改,就可以快速上线。我们还提供了可构建、可定制、可扩展的Web Apps,如MapDashboard和WebSite UI(L4),以及更偏向使用的一些Web Apps,用做制图、分析等(L5)。

由此可见,SuperMap GIS的Web端包括这五个层次的内容,已经不仅仅是SuperMap iClient JavaScript单个产品。

87e91b1ec2969e6f05fa314d36c2bd46.png

在SuperMap iClient JavaScript层面,我们也有新的增强与改进。

e09aacfe5dc25a8f1ca1ebb051a0c151.png

SuperMap iClient JavaScript 2020模块图。Web Libraries和 Web Components都有一些增强,新增加了Web Templates。

fc422678d4df4e9701261f59ce56d7da.png

在此,我重点介绍一下组件和模板的新特性和新技术:组件技术就是把Libararies类库做进一步的封装,更少的代码做更快的开发,比如可以一行代码加一个Web Map组件,里面填一个服务地址和地图资源ID,就可以出一个地图了。欢迎大家在超图软件官网查看范例。

f0a788f7edf22c28762300e4a96e7a61.png

45bdf829f7ef0da9a763cdcd1ba7c466.gif

这是2019年我们提供的技术。今年我们新增了多款Vue组件,包括时间轴、卷帘地图等。地图、图表等都有新的增强和改进。

0a4ae6467d0dcaf0c6fd8c896b0d1aa2.png

今年我们新增了多款Vue组件,包括时间轴、卷帘地图等。地图、图表等组件都有新的增强和改进。

d9b739abe912e5d01a57b3d8d4310458.png

575f5451095c1bac09d9f68c571df9a6.gif

这是我们做的全球新冠疫情图范例。使用组件技术做了封装,用户不用一行一行写代码,操作更方便、开发更快捷。

e4a649978d9bbf5826eee19757db9951.png

新的Web模板技术,可以让应用开发更便捷。直接提供多种行业应用模板,用户只需修改LOGO、配色,或删除不用的地方即可。

71a46ddf43d91f8d38f902dd8a231303.png

再上面就是大屏,可快速开发建站。

36334241e9d5700398aa44d79316c50c.png

No Code无代码开发,可以快速建站,包括SuperMap iPortal门户首页、地图大屏App等,都可以进行拖拉式操作,不需要写代码就可以完成可视化定制。门户首页可以拖出来,Web应用可以用大屏拖出来。

95b2f475e635523da6a81e787ea2dacf.png

地图大屏也做了一些增强。

7a647d5d8d717bea4501b5f2b2d521f3.png

d96ab7ded4fb29107d597afc0be9c94c.gif

以前做了大屏只能看,不能互动,不能点,点了以后也不能操作。现在能看、能点、能互动。有了交互更好用。

306a1c04b2c8a28c5e73b941c7520371.png

包括,我们对布局也做了优化,移动端可以自己修改布局。

033726653f79e46c7d9910734083d243.png

包括超宽屏终端都可以适配,这是一个项目的照片。

a90b09699b3217024e24d16bfac10a5b.png

83a6dc95d9e4e2cfbc4a561939830d59.png

另外一个定制就是SuperMap iPortal站点定制和扩展增强。

a9ef100e94380ce17a75c068a7ed3496.png

从首页到登录页、管理页甚至各个Web Apps都支持定制和扩展。

4fa3ca0aebf566d2c42be3317e71039c.png

f4894ab1a2ad349aeaeefdbb64e8635b.png

从而实现No Code的可视化定制,同时做了一些新的组件和能力增强。

cebc3e54a9ac07194b9cd1c35fc80b75.png

可以用这个特性快速搭建一个新的首页,从上面的菜单、左上角的LOGO,包括Banner、横幅各种内容都支持修改、增加和删除。甚至用户不懂开发都可以直接进行操作。此外,该布局是自适应的,在手机上同样可以观看。

befda5e6ed7c0a5b951069901ed5e118.png

8dbece2808d81cc52832bbf68b4d1105.png

这是2019年已有功能,今年我们做了新的增强。另外就是全代码定制。

fca96135d838f100ac4af252d63506a5.png

bff110382d97cf57682210ecd997a906.png

1c98ef45df564304c723494827961e27.gif

你可以基于自己的技术直接写一个首页。不管是我们提供的组件,还是你自己写的组件,或是第三方组件都可以拿来使用。

79204aee297d7da6b808a3449edcaf10.png

包括我们的登录页和资源管理页都可以进行修改和定制。

e4d026db0f398659f271c089365923b3.png

93b57240a138e2f1278e49515105566a.gif

此外,大屏本身也是可以扩展的。

ba3f35fe511c977f11dee82b84b79b90.png

d40a2f4c452a5886c7d9c98ce9339eee.gif


包括数据上图。

1f20466b54a69e17bafa7c9c959d53a2.png

数据洞察,都是可以修改和定制的。

47a2030eb3086bcb9fa662e010ee6acb.png

可以加自己的图表、UI。

fabb15d05f0d9260a29392144bc8c533.png

前面所提到的是定制开发,再上层就是直接使用的WebApp。

f4b5880ca1c80182a2f5fc8c5f3cf0d4.png

4ec7510e7820d22d85e9869c71d23a8d.gif

9ecb8007a2d303c0d6784fbe76b31c52.gif

如果大家感兴趣,可以去我们官网:www.supermap.com,或GTC网站:http://www.gistc.com/来观看新特性。

45256e411f26d24103de24dafa2e05dd.png

8cdead758be049d7591eebc879f77e7e.gif

d0a1871e0a4146858203203f36774e0b.gif

44445514580d63b123701a8e1c79815d.png

56ad1731612b5dc028f71ee92e353af0.gif

数据上图,制图能力更丰富。

4facb2e31c7535fade24521fda389e92.png

64913732ce9cd48aa2407687ce3a3e1b.png

821b29e40590b404b42fb58a77fb61f0.gif

可以在线打印Web地图。

0c4c121ad8fc17c4be7342d93ad8346b.png

简单回顾一下,我们讲到的两大部分技术:一个是云原生GIS技术,让GIS后台服务管理运维更高效,另一个是Web端GIS技术,让GIS前端应用开发定制更快速。一个是高效,一个是快速。

3296a8e5351c71674e45cb7bf3aabb35.png

总的报告可以用两个图连起来,第一就是K8s部署结构图,通过它可以把云原生GIS技术一览无余,包括SuperMap iServer、SuperMap iPortal、SuperMap iManager之间的关系、用了什么技术等都可以看到。

f59e31c8411f3fbd4b14e5f74f932a5a.png

第二张图如上所示,我们在Web端的整体技术层次都可以看到,从SuperMap iClient Libraries类库,到组件、模板,到大屏、Site UI定制、扩展,以及WebApps等等。

fad9fa2aaa4f3f61924057ede0f96d91.png

以上就是我的报告,谢谢大家。

ddc4ce148b59daa3b34b572fa65abc0f.png

内容转载、商务活动、投稿等合作请联系

微信号:huitiandi321

邮箱:geomaticshtd@163.com

欢迎关注慧天地同名新浪微博:

ID:慧天地_geomaticser

往期精彩推荐

系列视频:地理信息系统原理与应用

综合性大学一流GIS专业建设的探索与实践

2020第八届高校GIS论坛日程发布:大咖来袭,精彩报告抢先看!

ab711c70448bed824d959eda72b2e12c.gif

《慧天地》敬告

《慧天地》公众号聚焦国内外时空信息科技前沿、行业发展动态、跨界融合趋势,探索企业核心竞争力,传播测绘地理信息文化,为测绘、地信、遥感等相关专业的同学提供日常学习、考研就业一站式服务,旨在打造政产学研用精准对接的平台。《慧天地》高度重视版权,对于原创、委托发布的稿件,会烦请作者、委托方亲自审核通过后才正式推发;对于来自网站、期刊、书籍、微博、微信公众号等媒介的稿件,会在作者栏或者文章开头显著标明出处,以表达对作者和推文引用平台版权的充分尊重和感谢;对于来源于网络作者不明的优质作品,转载时如出现侵权,请后台留言,我们会及时删除。感谢大家一直以来对《慧天地》的关注和支持!——《慧天地》运营团队

a0fc153d83757f67828dd6fecbe02156.png

编辑: 马冉冉 审核:富裕 指导:万剑华教授
  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值