Geodev Hackerlab
slides.com/dmart/geodev-hackerlabs-berlin-2016
John Gravois @geogangster
David Martinez @DavidJMart
Welcome to the
Geodev Hackerlab
What's a geodev hackerlab?
Build geo apps with ArcGIS
Beyond the documentation, Under the hood
Informal - Interactive - Tips & tricks - Follow along or try yourself
Format
Demos & Short labs
What are we building?
Portland Neighborhoods App
1) ArcGIS Online (maps, data, services, analyses)?
2) ArcGIS JavaScript development?
Scale of 1-10...
Questions
How familiar are you with:
Getting Started
ArcGIS Developer Resources
ArcGIS Platform
Sign up for developer account:
Voucher Code: BERLINHACK
http://developers.arcgis.com
Then go here for labs:
http://github.com/Esri/geodev-hackerlabs
developers.arcgis.com
developers.arcgis.com
Voucher Code: BERLINHACK
HackerLabs on Github
http://github.com/Esri/geodev-hackerlabs
jsbin.com or IDE
Part 1
Data
ArcGIS Online
Store data
in the cloud
Hosted Services
- Feature Service
- Tile Service
1. Import Data
- ArcGIS Online
- Use "Add Item"
- View and Query REST endpoint
2. Create and Edit Data
- ArcGIS for Developers
- Create Dataset
- Define schema interactively
- ArcGIS Online Map View to add data
3. Make Data from Data
- GeoEnrich Data
- Buffers
- Drive/walk time
- Spatial Analyses
CODE
- Use feature service URLs
- Add as a layer to the map
- Uses default styling
1. Import Data
2. Create and Edit Data
3. GeoEnrich Data
Labs to Do for Data Section
Part 2
Design
ArcGIS Online
Create and style
web maps
Create a new web map
- ArcGIS Online Map Viewer
- Add layers and basemaps
- Create, Edit, Share data
- Use in apps
- Stored and accessible as JSON
Style Layers
- Default Renderers
- Points
- Lines
- Polygons
- Use custom symbology
Style Popups
- Override default popup settings
- Format - title, body, fields, values
- Charts
Smart Mapping
- "Smart" styling of layers based on data
- Apply symbols and colors
- Based on fields, data, formulas
- Color ramps with breaks
- Override
Save Layer Styles
- Copy and save layers with custom symbology
- Save as new items
- Inspect JSON
- Use JSON in apps
Style Vector Tiles
- New basemaps in ArcGIS Online (beta)
- Easy to edit and style root.json
- Re-upload to update your layer
Style 3D layers
- Use Scene viewer or JS API 4x
- Access layers
- Apply 3D symbols
Code
- Add a styled layer to an app
- Style a layer with JSON
- Style a layer popup
- Add vector tile basemap
1. Create a New Web Map
2. Style a Web Map
3. Style Popups
Labs to Do for Design Section
Your turn!
Part 3
Develop
Three Patterns
Templates
Builders
APIs
Templates, Builders & APIs
Build apps from
maps and layers
Web Map Apps
- Fastest and easiest way
- Re-use data, design (symbols) and configuration
- Easy to get title, subtitle, legend, map, popups
Edit remotely, no need to update apps!
Apps from Web Maps
1. App Templates
- Share
- Configure
- Save
- Re-configure
- Download code (My Contents)
- Build/host your own
Calcite Maps - Bootstrap
- Load entire map or layers
- ArcGIS JS or Esri-Leaflet
- See ArcGIS JS 4.x (2D/3D)
2. Web AppBuilder
- Share
- Configure
- Save
- Re-configure
- Download (option)
- Build/host your own
Custom WAB Apps
Web AppBuilder - Developer
- Download and install
- Configure with organization
- Build or seal code (see GitHub)
3. ArcGIS JavaScript API
- ArcGIS for Developers
- Samples and sandbox
- Use your own webmapID!
Apps from Layers
ArcGIS JS API 4.x (or 3.x)
- Get REST endpoints
- Load into map
- Sort/order
- Default symbols or override
Esri-Leaflet
- Get REST endpoints
- Load into map
- Sort/order
- Default symbols or override
- HINT: Use Esri-Leaflet-Renderer!
1. Create a Configurable App
2. Build a Starter Map
3. Search with Query Task
Labs to Do for Develop Section
Your turn!
Summary
- ArcGIS Dev Pattern: Data, Design, Develop
- ArcGIS Online, Web maps and ArcGIS APIs
- Create and share apps quickly
- Apps/APIs access REST API and Services...
- Homework! Finish the other exercises!