by 李远祥

webAppbuilder是arcgis portal 和arcgis.com 上用来配置应用程序的利器。合理利用webAppbuilder的微件功能,可以实现应用程序的零代码定制,并能有效的解决相关的实际的应用问题。

1. 启动webAppbuilder。webAppbuilder需要arcgis portal 或者arcgis.com 来支撑的,不能直接连接arcgis server,因此,不能作为单纯用arcgis server来配置应用程序,这一点跟以前的flexViewer不一样。webAppbuilder 分为内置版本和开发版本,内置版本是直接嵌在arcgis portal或者arcgis.com中,必须先登录到上述两个平台中才可以使用。开发版本可以在arcgis的开发者网站中下载,单独在本地运行,但使用时必须通过应用程序ID进行连接。以下界面是在arcgis portal或arcgis.com 下直接运行webAppbuilder,如下图

在输入必要的标题、标签、摘要之后,运行的界面如下,可以选择应用的主题(界面的布局和样式等)、地图(加载哪些webMap)、微件(功能组件)、属性(应用的一些附加说明)

2. 微件的分类。由于主要介绍的是微件的使用,这里对于其他的主题和地图的一些基本操作忽略。在选取了主题和地图之后,进入微件选择界面,如下图

微件一般视主题而定,一般在配置的应用程序中分为两种微件,一种是浮动微件,一种是面板微件。浮动微件是直接浮动在地图控件上,一般表现为如缩放控件、定位按钮及检索控件等,不需要调出具体的面板就能执行操作。面板微件顾名思义是一个可以调出面板界面的微件,表现为具体的一个按钮,点击后弹出操作和结果的界面,一般表现为地图控件上的按钮和工具栏上的按钮。

3. 微件的功能。定制应用基本上可以理解为使用微件,因为应用程序的界面布局等是固定的几套模板,当然,如果是高级的开发人员,还可以根据webAppbuilder的规范去定制这些模板,这里不详述。因此,使用微件就成了应用程序配置的关键。我们可以点开微件控制器,看看里面的微件分类,大致如下,根据arcgis portal或者arcgis.com的版本,会有不一样的微件,一般情况下版本越高的微件会越多,下图是arcgis portal 10.4的微件。

4. 使用微件。 可以在三个方面使用微件,最底部的带有数字标号的按钮,其对应的是地图控件浮动的按钮,点击后会跳转到微件选择界面中,选择好微件后,会有按钮图标与之对照;中间部分就是所谓的浮动微件部分,对应的是一些非弹出页面的控件,如比例尺样式、缩放滑块、全图操作等;最顶部是页眉控制器,通俗点说就是导航栏上的按钮,在此配置的微件会在导航菜单上生成对应的按钮图标,点击后弹出该微件的功能。各种微件的对应位置如下图所示。

每一个微件都有自己独特的作用,因此配置也不一样,我们先来看浮动微件的一些功能。例如比例尺微件,点击其编辑按钮(鼠标滑动到此微件的图标,会显示一个小笔的小图标,点击这个小图标就可以进入其配置界面)之后会弹出比例尺的一些设置,如比例尺的单位和样式。由于比例尺不需要点击进行操作,它是跟地图的缩放关联的,因此,该微件的图标不可更改。

同样是浮动微件,再看搜索微件,点开后可以看到其默认的配置就是使用esri的地理编码服务去执行搜索,如下图所示


如果我们有其他的地理编码服务或者有自己的需要检索的服务图层,如mapservice、featureservice,都可以在这里配置,实现搜索功能。以下操作将一个要素服务的一个图层添加到搜索微件中实现全局的检索。点击添加搜索源,添加一个要素图层

添加的要素服务可以是从已经配置的加载好的webMap中选择,或者直接从portal托管的服务中选择,又或者直接输入一个要素服务的地址,如下图,这里采用的是portal托管的要素服务,可以直接检索到该portal账号下所有服务

点击下一步之后,微件会检索到该要素服务下的所有图层,如下图,该要素服务下只有一个zhandian的图层,选择它,执行下一步的配置。

选择完数据源之后,就可以设置该微件的具体参数,例如检索的内容(字段),标题的别名等,最大结果数,完全匹配或者模糊搜索等,如下图

保存之后可以通过【启动】按钮来查看具体的配置情况,如下图

如果希望应用程序可以直接移动端的网页访问,可以使用【预览】方式去查看其具体的内容,设置所支持的移动设备的分辨率,如下图

这样,一个简单的功能就可以完成了。可以为应用程序配置更多的微件,以适应不同的使用场景。

webAppbuilder微件使用教程1 快速入门的更多相关文章

  1. webAppbuilder微件使用教程3 地理处理微件

    webAppbuilder微件使用教程 --微件使用进阶地理处理微件 By 李远祥 地理处理是GIS解决问题的关键部分,也是其灵魂所在.由于WebAppBuilder框架的限制,用户如果想要非常灵活的 ...

  2. webAppbuilder微件使用教程2 常用微件介绍

    webAppbuilder微件使用教程 --常用微件介绍 by 李远祥 上一章介绍了webappbuilder微件的一些基础操作,这一张主要是介绍一些常用微件的使用试用和配置方法. 微件的主要作用按照 ...

  3. Spring_MVC_教程_快速入门_深入分析

    Spring MVC 教程,快速入门,深入分析 博客分类: SPRING Spring MVC 教程快速入门  资源下载: Spring_MVC_教程_快速入门_深入分析V1.1.pdf Spring ...

  4. Spring Boot 2.x基础教程:快速入门

    简介 在您第1次接触和学习Spring框架的时候,是否因为其繁杂的配置而退却了?在你第n次使用Spring框架的时候,是否觉得一堆反复黏贴的配置有一些厌烦?那么您就不妨来试试使用Spring Boot ...

  5. Quartz教程:快速入门

    原文链接 | 译文链接 | 翻译:nkcoder | 校对:方腾飞 本系列教程由quartz-2.2.x官方文档翻译.整理而来,希望给同样对quartz感兴趣的朋友一些参考和帮助,有任何不当或错误之处 ...

  6. EFK教程 - EFK快速入门指南

    通过部署elasticsearch(三节点)+filebeat+kibana快速入门EFK,并搭建起可用的demo环境测试效果 作者:"发颠的小狼",欢迎转载与投稿 目录 ▪ 用途 ...

  7. Nginx 极简教程(快速入门)

    作者:dunwu github.com/dunwu/nginx-tutorial 推荐阅读(点击即可跳转阅读) 1. SpringBoot内容聚合 2. 面试题内容聚合 3. 设计模式内容聚合 4.  ...

  8. MyBatis入门学习教程-MyBatis快速入门

    一.Mybatis介绍 MyBatis是一个支持普通SQL查询,存储过程和高级映射的优秀持久层框架.MyBatis消除了几乎所有的JDBC代码和参数的手工设置以及对结果集的检索封装.MyBatis可以 ...

  9. [转]ASP.NET MVC 5 学习教程:快速入门

    本教程将使用Visual Studio 2013手把手教你构建一个入门的ASP.NET MVC5 Web应用程序.本教程配套的C#源码工程可通过如下网址下载:C#版本源码链接.同时,请查阅 Build ...

随机推荐

  1. Linux中后台执行任务

    执行时, 可以在命令最后添加 & 使其后台执行, 但是其输出依然会显示, 而且其运行是和当前shell绑定的 如果脚本已经运行,  可以使用Ctrl-Z暂停, 然后使用 bg 让其转入后台, ...

  2. CentOS 7.0 安装配置 kafka 消息队列

    查询下载最新版本 kafka http://kafka.apache.org/downloads.html wget http://mirror.bit.edu.cn/apache/kafka/0.8 ...

  3. STM32应用笔记转载

    stm32 外部中断嵌套[操作寄存器+库函数] stm32 NVIC中断管理实现[直接操作寄存器] stm32 SPI通信[操作寄存器+库函数] stm32 i2c通信 [操作寄存器+库函数] stm ...

  4. display属性及inline-block值(可用来布局)

    display:block就是将元素显示为块级元素. block元素的特点是: 总是在新行上开始: 高度,行高以及顶和底边距都可控制: 宽度缺省是它的容器的100%,除非设定一个宽度 <div& ...

  5. javascript 闭包理解

    摘自:http://www.cnblogs.com/jkswjw/p/3180384.html javascript 闭包基础分享 闭包向来给包括JavaScript程序员在内的程序员以神秘,高深的感 ...

  6. Linux下网络流量实时监控工具大全

    在工作中发现,经常因为业务的原因,需要即时了解某台服务器网卡的流量,虽然公司也部署了cacti软件,但cacti是五分钟统计的,没有即时性,并且有时候打开监控页面不方便,个人喜欢随手在某台服务器上输入 ...

  7. IOS开发之IOS8.0最新UIAlertController 分类: ios技术 2015-01-20 14:24 144人阅读 评论(1) 收藏

    最近苹果更新的IOS8 对以前进行了很大的修改, 更新的API也让人捉急,据说iOS 8的新特性之一就是让接口更有适应性.更灵活,因此许多视图控制器的实现方式发生了巨大的变化.比如全新的UIPrese ...

  8. Java 汉子转拼音

    1. 引入: pinyin4j-1.1.0 包;  http://pan.baidu.com/s/1eQ8a874 2. 转换; private static String ChineseToPiny ...

  9. IOS开发-OC学习-protocol(协议)

    在OC语言中,协议是一组方法,里面有两种方法,一种是遵守这个协议的类的实例必须实现的方法,另一种是可以实现也可以不实现的方法. 例如我定义一个学生的协议,这个协议里有两个方法,其中一个是必选的方法:学 ...

  10. [HNOI2004]Language L语言

    2777: [HNOI2004]Language L语言 Time Limit: 10 Sec  Memory Limit: 128 MBSubmit: 10  Solved: 5[Submit][S ...