Questions Answered: Extending Web AppBuilder for ArcGIS

[AmyNiessen]

Back in January, David Martinez and Gavin Rehkemper hosted a GeoDev Webinar on Extending Web AppBuilder for ArcGIS. During the webinar, questions were asked that were not able to be addressed during the recording, so here they are with complete answers:

Q: How do you confine a URL search to only search original map extent or map features?

A: See step "J" here: https://doc.arcgis.com/en/web-appbuilder/create-apps/widget-search.htm - "Optionally check the Only search in current map extent box if needed".

Q: Where are you getting all the information that you are pasting into the editor?

A: That was example code that we had pre-written - similar to a cooking show, the webinar would be boring if you just watched us type the entire time! We instead copy/pasted code snippets so that you could see the full process of building a widget. You can go back and re-watch the webinar if you'd like, and all the code is available on GitHub: https://github.com/gavinr/web-appbuilder-find-restaurants

Q: Is there anyway to make the widgets available to the WAB version on the portal for ArcGIS .. like not only for the version on the PC for development?

A: Yes, this is possible for certain versions of Portal. Please see this documentation page for more information: https://blogs.esri.com/esri/arcgis/2017/06/30/web-appbuilder-for-arcgis-now-supports-custom-widgets-...

Q: Within the widgets there are functions, such as analysis widget, that has the buffer and overlay functions. Is there a way I can use both the buffer and overlay at the same time? 

A: You should be able to call ArcGIS Online tasks from a custom widget and have them run at the same time. Feel free to post on GeoNet if you'd like to expand on this question and we will try to help you out!

Q: I need to open another widget from a custom widget link.

A: This is possible using WidgetManager https://developers.arcgis.com/web-appbuilder/api-reference/widgetmanager.htm - see "openWidget" function.

Q: How does Web AppBuilder handle the customized popups, for example, displaying some charts with labels while clicking?

A: Your custom pop-ups that you define in your web map in ArcGIS Online should display the same way in Web AppBuilder.

Q: Can the theme include an additional fixed panel, e.g., footer pane?

A: Yes, you can include a fixed panel; it is all about the position. What is the purpose of your panel footer?

Q: You said there's a way to push the theme to Portal, I believe? Is there a way to do the same with Widgets?

A: Yes, this is possible for certain versions of Portal. Please see this documentation page for more information: https://blogs.esri.com/esri/arcgis/2017/06/30/web-appbuilder-for-arcgis-now-supports-custom-widgets-...

Q: Do the Web AppBuilder versions line up? It seems that the Developer Edition lags behind the ArcGIS online version.

A: Please see this documentation page that shows what versions align with what versions of Portal: https://developers.arcgis.com/web-appbuilder/guide/about-versions.htm

Q: How do we download the application from Esri site? Is it a free or to be paid for?

A: Go to https://developers.arcgis.com/web-appbuilder/ and click the "Download SDK" button. You must log in with an ArcGIS Online named user account.

Q: Can we customize Portal with Web AppBuilder?

A: Yes, this is possible for certain versions of Portal. Please see this documentation page for more information: https://blogs.esri.com/esri/arcgis/2017/06/30/web-appbuilder-for-arcgis-now-supports-custom-widgets-...

Q: What would be the best approach to add engineering record drawings (as-builts approximately 6GB) to an app? I added a URL within a layer, which my field workers must copy the path and search within documents. How can I have an image popup using an Apple Device?

A: These questions are very general and to really answer them ,we would need a few more details. Please open up discussions on GeoNet.

Q: What are the advantages of the "config URL parameter" approach that Gavin showed for custom widget development, over other approaches? I've been developing widgets in "Launch"ed apps, then copying my custom widget back into stemapp when it's working as expected... but I'd happily switch to the "config URL parameter" approach if there are clear advantages! 

A: I think that method is ok too. Whatever works for you and gets you going the quickest! Don’t forget to check out our pattern of using a Grunt script to copy to BOTH locations automatically: https://github.com/Esri/generator-esri-appbuilder-js

Q: Would it be easy to create a widget for a data collection form for SQL Server?

A: Collector for ArcGIS might fit your use-case (http://www.esri.com/products/collector-for-arcgis). Otherwise the Web AppBuilder out-of-the-box "Edit" widget may meet your requirements. If none of those work for you, building a custom widget might be your best option.

Q: Will Web AppBuilder require any license to use in an organization? 

A: To use Web AppBuilder for ArcGIS, you must have an ArcGIS for Developers account or an ArcGIS organizational account and be a level 2 member. If you don't have an ArcGIS account, you can sign up for an ArcGIS free trial. https://developers.arcgis.com/web-appbuilder/guide/xt-system-requirements.htm

Q: What does jimu stand for?

A: "building block"

Q: Is ArcGIS JavaScript API source code available in a readable non-compressed format?

A: Not currently. You can see information about including the ArcGIS API for JavaScript in your builds and from NPM here: https://github.com/Esri/jsapi-resources

Q: Can we configure widget that not yet exist at the list of widgets? How can we do that?

A: You can add widgets manually through the app's "config.json" file if you need more control than the builder provides. https://developers.arcgis.com/web-appbuilder/api-reference/app-configuration.htm

Q: What is a good compiler to customize code for widgets? I am using Notepad++ to write codes now. But when I add to the WAB online-map, it shows the error message but no details info to show which line is wrong or cause it stop. I would like to know which is a good compiler to write a code. 

A: There are lots of options for a code IDE other than NodePad++, and mostly the choice is a subjective personal preference. We happen to like Visual Studio Code currently. If you include linting in your project (like ESLint or Prettier) that will help you catch errors quicker.

Q: Could you share this custom Web AppBuilder Theme on Github?

A: Code samples have been posted here: https://community.esri.com/groups/geodev/blog/2018/01/17/geodev-webinar-extending-web-appbuilder-for...

Q: Will this sample code be available to download?

A: Code samples have been posted here: https://community.esri.com/groups/geodev/blog/2018/01/17/geodev-webinar-extending-web-appbuilder-for...

Q: What is the credits impact when creating custom widgets?

A: There are no credits required to create custom widgets. The only time you need credits if you're performing a task that requires credits such as batch geocoding, geoenrichment etc. Please visit https://developers.arcgis.com/pricing/credits/

Q: Will an existing ArcGIS Online account work for developers?

A: You must have an organization account or developer account (which is free) to work with the developer edition of Web AppBuilder.

Q: Do we have to use ArcGIS online map services? Or can we use local REST APIs as map services for WebApp Builder?

A: Yes, you can use map services with Web AppBuilder.

Q: Can the widget position be relative instead of absolute?

A: Yes, take a look at the Splash Widget that is positioned relative to the browser.

Q: Is there a formal Web AppBuilder Esri training course?

A: Yes, please go to https://www.esri.com/training and search for Web AppBuilder there is an instructor lead course.

Q: What composes a Web AppBuilder widget?

A: Here is some documentation that explains the required components https://developers.arcgis.com/web-appbuilder/guide/required-files.htm.

Q: Are there any plans to allow deploying custom themes to Portal?

A: We currently have this as a feature request but no timeline is set.

Q: We also use Angular 2.0. Can this be used within Web AppBuilder?

A: Yes, you can use Angular with Web AppBuilder.

Q: Which IDE do you use for coding? How do you enable the code snippets?

A: We were using Visual Studio Code https://code.visualstudio.com/ and to launch the code snippets you would use ctrl + space. 

Q: Can I try out making a widget using ArcGIS Desktop 10.5 or do I need the enterprise edition of ArcGIS?

A: Yes, all you need is the directory of the files that make up the application. 

Q: Can the pages built by Web AppBuilder be published as html and js only or does it need Node.js in order to work in a production environment?

A: Yes, you can download the application you created and publish it on your own Web server. Please review https://developers.arcgis.com/web-appbuilder/guide/xt-deploy-app.htm

Q: Is there a way to put a link on the pop-up that would execute a feature action?

A: You can extend the BaseExtendFeature class to help you accomplish this functionality. 

Q: How about TypeScript support?

A: You can use TypeScript in Web AppBuilder. Please check out this repo https://github.com/gavinr/web-appbuilder-typescript-examples 

Q: Do you know of a class or seminar that is more basic, or perhaps one that just revises existing widgets for now:
For example: Query widget: we want to have query Criteria under “Only return feature that have spatial relationship with features in another layer”

A: Yes, please visit our training site and search for Web AppBuilder courses https://www.esri.com/training/catalog/search/

Q: First, in order to share them, can I build them on my local machine, or do I have to do this on our server?  Also, we are a utility, and by necessity are therefore still at ArcGIS 10.2.1. Our ArcGIS Server is also 10.2.1. I am confused about the requirements for custom widgets – do you have a link to some introductory explanations on this?  

A: Please review the get started section for custom widgets https://developers.arcgis.com/web-appbuilder/guide/get-started.htm

We welcome you to leave comments below if you have any additional questions. We're happy to help!