6(上)_Web AppBuilder构建应用程序

林业地理信息数据管理之六(上)

- Web AppBuilder构建应用程序

(陈家 安徽省林业调查规划院)

Web AppBuilder for ArcGIS 是一种直观的所见即所得式 (WYSIWYG) 应用程序,可用于构建 2D 和 3D web 应用程序,而无需编写一行代码。它所包括的强大工具可用来配置功能完备的 HTML
应用程序。添加地图和工具时,您可以在应用程序中看到这些地图和工具并立即使用。

主要功能

*可通过 Web AppBuilder for ArcGIS 进行以下操作:

*创建能在所有设备上运行的 HTML/JavaScript 应用程序。

*使用即用型微件构建所需应用程序。

*使用可配置的主题自定义应用程序的外观。

*在线托管应用程序或在自己的服务器上运行应用程序。

*创建自定义应用程序模板。

一、Web AppBuilder开发版的安装

(一)以下我介绍的是Web AppBuilder 2.8开发版。从ArcGis官网下载Web
AppBuilder,地址是:https://developers.arcgis.com/web-appbuilder/,下载的需要是开发版;

(二)下载完成后,解压到服务器指定的文件夹,其目录结构如下,“client”文件夹里存放的是客户端,“docs”文件夹里存放的是文档资料,“server”文件夹里存放的是服务器端,“startup.bat”是启动文件:
这里写图片描述

(三)启动“startup.bat”文件,出现黑屏后按任意键继续:

这里写图片描述

(三)这时候,服务器会自动启动浏览器进入Web
AppBuilder页面,最好不要在服务器里操作,可以在客户机里输入相应的地址,比如在服务器里是“https://gis:3344/webappbuilder/?action=setportalusr”,可以在客户机里输入“https://gis.linye.cn:3344/webappbuilder/?action=setportalurl”就可以访问了,在设置Portal中输入自己门户的全限制域名,点击继续:
这里写图片描述

(四)完成后,会要求填写自己门户注册的id,首先我们要获得这个id:
这里写图片描述

(五)进入自己的门户,进入“我的内容”,点击“添加项目”-“应用程序”,出现以下界面,选择“应用程序”,输入标题和标签,然后点击“添加项目”:
这里写图片描述

(六)浏览器会自动进入这个应用程序的详细信息中,点击“设置”,有个应用设置,点击“更新”:

这里写图片描述

(七)将原有的地址删除,填入启动web appbuilder的服务器地址,点击“更新”:
这里写图片描述

(八)可以注意到多了应用程序ID,将这个复制下来:
这里写图片描述

(九)填入web appbuilder的设置页面中,然后继续:
这里写图片描述

(十)web appbuilder会申请门户的管理权限,点击“同意”

这里写图片描述

(十一)出现如下界面,Web AppBuilder就已经安装好了。

这里写图片描述

二、创建应用程序

(一)点击新建,在Web
AppBuilder中我们可以创建二维或者三维的应用程序,和界面的效果,因为目前对于三维支持的还不多,所以Web
AppBuilder还是以二维为主,但是未来会有越来越多的三维应用程序的,我选择了“默认(2D)”:
这里写图片描述

(二)点击下一步,填入应用程序的标题和说明:

这里写图片描述

(三)点击确定,开始创建应用程序,完成后会进入以下界面:
这里写图片描述

(四)首先可以选择界面的主题、样式和布局:
这里写图片描述

(五)然后可以选择需要添加的地图,可以选择自己创建的,或者公共的地图,我这里选择的是我在上一章分析功能里生成的地图“某县聚合点”:

这里写图片描述

(六)将地图比例尺调整好后,选择“使用当前地图视图”,当然也可以按照自己的想法设定全局或者比例尺:
这里写图片描述

(七)现在我们可以添加自己需要的微件了,点击“微件”,下面的微件都是系统默认就有的:

这里写图片描述

(八)再往下,有五个灰色的方框,这是可以定制的,点击某一个,选择自己想要的微件:
这里写图片描述

(九)这样逐一将五个微件选出来,我选择的是这样的:

这里写图片描述

(十)在地图上就是这个样子:

这里写图片描述

(十一)我们最后进入“属性”,可以进行一些设置工作,比如标识、背景色等,可以根据自己的需要进行设置:

这里写图片描述

(十二)全部设置都完成后,可以点击下方的“预览”,看看效果,选择相应的手机型号,我的选择的是“huawei mate 9”,扫描下方的二维码,就可以在自己的手机上查看显示效果,因为我的手机没有root,所以无法设置主机,导致扫描二维码无法打开网站,如果各位手机root了,可以找到hosts文件,在里面加入服务器ip地址和域名(我的是192.168.1.150 gis.linye.cn),当然啦,如果在互联网上的公共域名就无所谓了:
这里写图片描述

(十二)如果都觉得满意的话,可以保存下来,最后就可以启动了,效果如下:
这里写图片描述

(十三)在其它客户机里输入“https://gis.linye.cn/webappbuilder/apps/2”就可以访问这个页面了,如果需要用手机访问的话,也可以输入这个网址进行访问。

(十四)无论通过计算机还是手机访问,里面我们添加的数据和定制的微件都可以使用,比如“图层”,可以对于已经添加的数据进行控制:

这里写图片描述

(十五)比如“添加数据”,可以很方便的通过各种手段进行添加:
这里写图片描述

(十六)比如“编辑”,可以对于点、线、面图层进行编辑:
这里写图片描述

(十七)比如“图例”,可以修改数据的表现形式:

这里写图片描述

(十八)当应用程序保存好了以后,下次Web AppBuilder的时候,就可以看到这个程序了:
这里写图片描述

(十九)还有一个创建应用程序的方法,就是通过我的门户中我的内容,使用Web AppBuilder创建应用程序:
这里写图片描述

(二十)其创建方法和使用Web AppBuilder开发版是一样的,这次我们创建一个3D的应用程序:

这里写图片描述

(二十一)进入应用程序以后,就可以象我前面介绍那样进行配置了,也可以添加一些微件,但是因为刚起步,三维的微件很少,最后效果:
这里写图片描述

(二十二)最后通过共享就可以让别人使用自己的应用程序了。

综上所述,通过Web AppBuilder,我们可以非常容易的将自己需要的数据,加上定制好的微件进行发布,能够建立一个Web Gis应用系统,亦或者,只需要网络底图和微件功能,加载本地数据进行移动处理,其实Web AppBuilder的功能还是非常强大的,在不需要太专业的GIS功能的情况下,使用门户自带的Web AppBuilder就可以满足我们的需要,在需要定制开发的情况下,我们才使用Web
AppBuilder的开发版。

本章的内容就介绍到这里了,下一章我会介绍如何利用Web AppBuilder来管理和扩展应用程序。

(如需转载,请注明出处)

猜你喜欢

转载自blog.csdn.net/weixin_39065585/article/details/81865399