Webappbuilder开发快速预览

by 李远祥

Webappbuilder for ArcGIS 是由ArcGIS JavaScripit API和dojo创建的,它允许通过创建自己的widget和主题来扩展其功能。

1.      了解widgets(微件),panels(面板)和themes(主题)

Widget

微件是一系列的text文件,可以在webappbuilder的应用中共享、移动和分发。

微件可以是单个符合AMD模型的JavaScript文件或者是编译好的AMD包,像Dojo的包一样。上图是微件的结构,包含一个模板、配置文件、央视文件和国际化支持。

通常情况下,微件被单独封装在一个分离或特定的业务逻辑中,一个微件不仅可以与用户视觉上互动,也可以连接到ArcGIS Portal和ArcGIS Online中获服务器端地图和数据资源。

Widget必须扩展BaseWidget 类(BaseWidget.js),通过扩展BaseWidget类,产生一个新的JavaScript类会由Web Appbuilder 的WidgetManager 作为一个可部署的插件。

2.      Panel(面板)

Panel是一个UI元素,用于显示widget的内容。复杂的微件可以在一个panel中展示出来。通过使用Panel板,Widget开发者不需要处理微件及其内容(数据)如何在HTML查看器显示。然而,微件开发人员可以选择不使用所提供的面板(更多的细节,见小微件开发部分)。例如,比例尺微件都有自己独特的用户界面。

您可以修改或创建新的panel,以获得新的功能,例如使微件可以移动和拖拽。

3.      Theme(主题)

主题是由Web AppBuilder创建的Web应用所定义的界面。主题定义了以下内容:

l  如何通过微件布局主题面板

l  颜色、字体、界面样式等方案

l  微件在viewer中的位置

Web AppBuilder开发者需要掌握的软件和技巧

开发人员需要足够的HTML和JavaScript开发Web应用程序的知识和经验

Dojo是WebAppBuilder和ArcGIS JavaScript API的基础平台

使用Web AppBuilder去开发微件,需要熟悉ArcGIS JavaScript API,至少要熟悉由Esri官网上提供的代码实例。

尽管开发的环境只需要基础的文本编辑器、标准兼容的web浏览器和网络连接,但还是推荐使用一些有效的开发工具:

  • Sublime or Aptana Studio IDE
  • Chrome (最新版)
  • Firefox (最新版) with the Firebug plug-in

4.      可参考的资源

可以参考以下的资源网站

Webappbuilder开发快速预览的更多相关文章

  1. Windows 10 开发人员预览版中的新增功能(转自 IT之家)

    Windows 10 开发人员预览版中的新增功能 在Win10预览版中安装工具与SDK后,即可着手创建Windows通用应用或先浏览目前的环境与此前相比都发生了什么变化. 应用建模 文件资源管理器: ...

  2. Android开发 Camera2开发_2_预览分辨率或拍照分辨率的计算

    前言 不管在Camera1或者Camera2在适配不同手机/不同使用场景的情况下都需要计算摄像头里提供的分辨率列表中最合适的那一个分辨率.所以在需要大量机型适配的app,是不建议不经过计算直接自定义分 ...

  3. 【macOS使用技巧】使用空格键快速预览文件内容

    Quickview 是mac系统上一个强大的预览功能, 可以预览 mp4 mov等音频文件, 当然图片.文本.也都可以进行预览. 在系统中如果你希望快速浏览一下文件而不想打开的文件的话只要选择文件然后 ...

  4. Sublime Text3如何快速预览html文件

    Sublime Text3 步骤1:选择 Tools----> Build System ----> New Build System... 步骤2:输入以下内容 "cmd&qu ...

  5. 玩转Android Camera开发(四):预览界面四周暗中间亮,仅仅拍摄矩形区域图片(附完整源代码)

    杂家前文曾写过一篇关于仅仅拍摄特定区域图片的demo.仅仅是比較简陋.在坐标的换算上不是非常严谨,并且没有完毕预览界面四周暗中间亮的效果,深以为憾.今天把这个补齐了. 在上代码之前首先交代下,这里面存 ...

  6. Rider中Winform开发支持预览(5)

    1.Rider .netCore3.0 winform设计器支持预览,这点vs目前还不支持. 2.不过winform下控件选择工具栏都是没有图标的

  7. 高精度快速预览打开dwg文件的CAD控件CAD Image DLL介绍及下载

    CAD Image DLL对于DXF格式, DWG格式(AutoCAD R12 到AutoCAD 2004/2005), PLT 以及 HPGL/HPGL2文件都有快速的显示速度和精度,开发者再也不会 ...

  8. angularjs学习总结(快速预览版)

    对html标签的增强 -> 指令 指令的本质是什么 声明的方式调用相应的脚本,实现一些操作,声明的所在的dom就是脚本的执行上下文? 自定义标签 -- 标签指令自定义属性 -- 属性指令特定格式 ...

  9. .NET ORM框架 SqlSugar4.0 功能快速预览【开源】

    SqlSugar 4.0 ORM框架的优势 为了未来能够更好的支持多库分布式的存储,并行计算等功能,将SqlSugar3.x全部重写,现有的架构可以轻松扩展多库. 源码下载: https://gith ...

随机推荐

  1. (简单) POJ 1426 Find The Multiple,BFS+同余。

    Description Given a positive integer n, write a program to find out a nonzero multiple m of n whose ...

  2. 基于FPGA的OLED真彩色动态图像显示的实现

    源:基于FPGA的OLED真彩色动态图像显示的实现 作为第3代显示器,有机电致发光器件(Organic Light Emitting Diode,OLED)由于其主动发光.响应快.高亮度.全视角.直流 ...

  3. 【repost】JS中的hook机制

    hook机制也就是钩子机制,由表驱动实现,常用来处理多种特殊情况的处理.我们预定义了一些钩子,在常用的代码逻辑中去适配一些特殊的事件,这样可以让我们少些很多if else语句.举个高考加分的例子,比如 ...

  4. linux下实现ftp匿名用户的上传和下载文件功能

    1.配置/etc//vsftpd/vsftpd.conf 文件如下: 打开文件,改变如下选项,如果文件中没有该选项,需要自己手动编写该选项 write_enable=YES anonymous_ena ...

  5. linux  指令 备注

    ss命令可用于查看系统的socket的状态.基本上ss是比较符合需求的ss -a 出来的答案比较完整,但是很乱...连dgram及stream都分开了ss -l 比较可能是需要的,这会列出所有正在使用 ...

  6. access 随机选取数据

    access随机读取数时 用order  by  rnd(id)   发现每次获取的数据顺序都是一致的,必须要加上随机数才可以,如下: Random r = new Random();         ...

  7. Java Spring MVC项目搭建(一)——Spring MVC框架集成

    1.Java JDK及Tomcat安装 我这里安装的是JDK 1.8 及 Tomcat 8,安装步骤详见:http://www.cnblogs.com/eczhou/p/6285248.html 2. ...

  8. python 爬取的数据要如何展现(可视化)?

    我是把数据放在 mongodb ,然后单独一个脚本作分析,导出 json ,用 c3.js 画图,然后随便写个很简单的页面就好了. 展示在这里: http://107.170.207.236/job_ ...

  9. C++ 句柄类

    一.容器与继承 在容器中保存有继承关系的对象时,如果定义成保存基类对象,则派生类将被切割,如果定义成保存派生类对象,则保存基类对象又成问题(基类对象将被强制转换成派生类对象,而派生类中定义的成员未被初 ...

  10. drag file upload xhr 拖拽异步上传文件

    <div id="droptarget" style="width: 500px; height: 200px; background: silver"& ...