Toward a
More-Than-Esri GIS
Ryan Cooper | @maptastik | ryan-m-cooper.com
Follow along!
Presentation Repo
Some terms:
- FOSS -> Free and Open Source Software
- Freedom to access, change, and redistribute source code
- FOSS4G - > Free and Open Source Software for Geospatial
- Esri -> The company and their variety of software/service offerings
? >
- Esri & FOSS4G aren't mutually exclusive
- Esri & FOSS4G work well together!
- Including FOSS4G may be better for your clients/community
Desktop GIS
Geoprocessing
Server
Web
Platform
ArcGIS = GIS
Advantages of Esri
- Standardbearer for GIS
- Competent COTS offerings
- Authoritative and thorough documentation
- Centralized training resources and support
- Can do a lot.
Disadvantages of Esri
- Expensive, complicated pricing
- Opaque development prioritization
- Old code base can result in bottlenecks
Advantages of FOSS4G
- Cost*
- Savings can go toward developing/enhancing tools you need
- Control over your stack
- Adaptibility
- What happens if you lose funding for Esri licenses?
- Multi-Platform (Windows, OSX, Linux, Web)
Disadvantages of FOSS4G
- Decentralized support
- Less GUI, More command line
- Open licenses may require sharing feature enhancements you paid for
- Not really a disadvantage
- May be tough to explain those in control of budget
- LOTS of options
+
- Take advantage of a more diverse toolset
- Moderate buy-in to any single platform
- Create workflows that more precisely meet your needs
Openings for Esri & FOSS4G
- Python
-
import arcpy
- ArcGIS API for Python
-
- R (via R-Bridge)
- HTML/CSS/JS
- Consumes & outputs OGC compliant data
- Server outputs GeoJSON (10.4)
- github.com/esri
Mixing Esri & FOSS4G
Case: Leadership Scott County Project Site Selection
Problem
Complete a service project that benefits the community
Criteria
- <$1200
- Must be completed by April 2017
- In Georgetown
- In an area that hasn't been served by past LSC group projects
Problem
Complete a service project that benefits the community
Criteria
- <$1200
- Must be completed by April 2017
- In Georgetown
- In an area that hasn't been served by past LSC group projects
Steps
- Research
- Analysis
- Presentation to Class
- Project Proposal
1. Research
- Where have past LSC classes done projects?
- Quick exploratory analysis
- Query service (Esri)
- Return GeoJSON! (Esri)
- Basic analysis in browser using Dropchop.io (FOSS4G)
2. Analysis
-
Leaflet as mapping platform (FOSS4G)
-
Basemaps
-
"Spring" vector tileset (Esri): Esri-Leaflet, Esri-Leaflet Vector Tile Plugin
-
GSCPC Streets (Esri): ArcGIS Server, Esri-Leaflet
-
GSCPC B&W (Esri/FOSS4G): ArcGIS Server, tileify-ags-proxy
-
Imagery + Streets (Other): HERE Maps
-
Task: Make an interactive map of the past LSC projects (Code):
<head>
...
<script src="https://unpkg.com/leaflet@1.0.0/dist/leaflet-src.js"></script>
<script src="https://unpkg.com/esri-leaflet@2.0.3"></script>
<script src="https://unpkg.com/esri-leaflet-vector@1.0.3"></script>
....
</head>
<body>
...
<div id="map"></div>
...
<div id="basemaps-wrapper" class="leaflet-bar">
Basemaps:
<select name="basemaps" id="basemaps" onChange="changeBasemap(basemaps)">
<option data-tile='esriVT' value="Spring">Street Map (Vector Tiles)</option>
<option data-tile='ags' value="http://gis.gscplanning.com/arcgis/rest/services/basemaps/gscbase_streets/MapServer">GSCPC Streets (ArcGIS Server)</option>
<option data-tile='tms' value="http://gscpcgis-tileify-ags-proxy.herokuapp.com/tiles/{z}/{x}/{y}?url=http%3A%2F%2Fgis.gscplanning.com%2Farcgis%2Frest%2Fservices%2Fbasemaps%2Fgscbase_bw%2FMapServer&transparent=true">GSCPC B&W (AGS-Proxy)</option>
<option data-tile='tms' value="http://1.aerial.maps.cit.api.here.com/maptile/2.1/maptile/newest/hybrid.day/{z}/{x}/{y}/256/png8?app_id=jHW2qixQHBjQkbewy0cH&app_code=oO4iig4GLocEZTJb4NdUTg&lg=eng">Imagery + Streets (HERE)</option>
</select>
</div>
</body>
// Initialize map
var map = L.map('map'. {
center: [38.201851, -84.548979],
zoom: 14
});
function setBasemap(basemap) {
if (layer) {
map.removeLayer(layer);
var listIndex = document.getElementById("basemaps").selectedIndex;
var newBasemap = document.getElementsByTagName("option")[listIndex].dataset.tile;
if (newBasemap == "esriVT") {
layer = L.esri.Vector.basemap(basemap);
} else if (newBasemap == "ags") {
layer = L.esri.tiledMapLayer({
url: basemap
});
} else if (newBasemap == "tms"){
layer = L.tileLayer(basemap);
}
map.addLayer(layer);
}
}
// Change basemap
function changeBasemap(basemaps) {
var basemap = basemaps.value;
setBasemap(basemap);
}
// Add Esri vector tiles
var layer = L.esri.Vector
.basemap('Spring')
.addTo(map);
2. Analysis
-
Leaflet as mapping platform (FOSS4G)
-
Basemaps
-
"Spring" vector tileset (Esri): Esri-Leaflet, Esri-Leaflet Vector Tile Plugin
-
GSCPC Streets (Esri): ArcGIS Server, Esri-Leaflet
-
GSCPC B&W (Esri/FOSS4G): ArcGIS Server, tileify-ags-proxy
-
Imagery + Streets (Other): HERE Maps
-
-
Add Georgetown city limits
-
Pull from GSCPC ArcGIS Server (Esri)
-
Add to map using Esri-Leaflet (Esri/FOSS4G)
-
Task: Make an interactive map of the past LSC projects (Code):
L.esri.featureLayer({
url: 'http://gis.gscplanning.com/arcgis/rest/services/CityLimits/MapServer/0',
style: {
color: "#f1c40f",
weight: 2,
fillOpacity: 0,
dashArray: "5,5",
pane: 'cityLimitsPane'
}
}).addTo(map)
2. Analysis
-
Leaflet as mapping platform (FOSS4G)
-
Basemaps
-
"Spring" vector tileset (Esri): Esri-Leaflet, Esri-Leaflet Vector Tile Plugin
-
GSCPC Streets (Esri): ArcGIS Server, Esri-Leaflet
-
GSCPC B&W (Esri/FOSS4G): ArcGIS Server, tileify-ags-proxy
-
Imagery + Streets (Other): HERE Maps
-
-
Add Georgetown city limits
-
Pull from GSCPC ArcGIS Server (Esri)
-
Add to map using Esri-Leaflet (Esri/FOSS4G)
-
-
Add LSC projects to map
-
Add to map w/ pop-up using Leaflet (FOSS4G)
Task: Make an interactive map of the past LSC projects (Code):
-
Create query of service
- where: 1=1
- Input Spatial Reference: 3857
- Out Fields: description
- Output Spatial Reference: 4326
- Format: GEOJSON
var promise = $.getJSON(
"http://services1.arcgis.com/dpmGqj7FxlwlvK0y/arcgis/rest/services/lscProjects/FeatureServer/0/query?where=1%3D1&objectIds=&time=&geometry=&geometryType=esriGeometryEnvelope&inSR=3857&spatialRel=esriSpatialRelIntersects&resultType=none&distance=&units=esriSRUnit_Meter&outFields=description&returnGeometry=true&multipatchOption=&maxAllowableOffset=&geometryPrecision=&outSR=4326&returnIdsOnly=false&returnCountOnly=false&returnExtentOnly=false&returnDistinctValues=false&orderByFields=&groupByFieldsForStatistics=&outStatistics=&resultOffset=&resultRecordCount=&returnZ=false&returnM=false&quantizationParameters=&sqlFormat=none&f=pgeojson&token="
);
//Create popup
function onEachFeature(feature, layer) {
layer.bindPopup(feature.properties.description)
}
// Promise function for putting sites on map
promise.then(function(data) {
var lscProjects = L.geoJson(data, {
pointToLayer: function(feature, latlng) {
return L.circleMarker(latlng, {
radius: 5,
opacity: 1,
color: "#ffffff",
fillOpacity: 1,
fillColor: "#c0392b"
})
},
onEachFeature: onEachFeature
}).addTo(map);
// ...
// Some other stuff that will come later
// ...
});
2. Analysis
Leaflet as mapping platform (FOSS4G)
-
Basemaps
"Spring" vector tileset (Esri): Esri-Leaflet, Esri-Leaflet Vector Tile Plugin
-
GSCPC Streets (Esri): ArcGIS Server, Esri-Leaflet
-
GSCPC B&W (Esri/FOSS4G): ArcGIS Server, tileify-ags-proxy
Imagery + Streets (Other): HERE Maps
-
Add Georgetown city limits
Pull from GSCPC ArcGIS Server (Esri)
Add to map using Esri-Leaflet (Esri/FOSS4G)
-
Add LSC projects to map
Pull GeoJSON straight from AGOL (Esri)
Add to map w/ pop-up using Leaflet (FOSS4G)
-
Generate buffers
Use TurfJS for client-side geoprocessing (FOSS4G)
Task: Make an interactive map of the past LSC projects (Code):
// Within function for adding project locations...
// Generate buffers with TurfJS
var unit = 'miles';
var buffer10 = turf.buffer(data, 0.1, unit);
var buffer25 = turf.buffer(data, 0.25, unit);
var buffer50 = turf.buffer(data, 0.5, unit);
var buffer100 = turf.buffer(data, 1, unit);
// Style buffers
function buffStyle(feature) {
return {
color: "#e74c3c",
opacity: 1,
fillColor: "#ffffff",
fillOpacity: 0
}
}
// Generate buffer GeoJSON to be added and removed from map
var buffer10Layer = L.geoJson(buffer10, {
style: buffStyle,
pane: 'bufferPane'
}).addTo(map);
var buffer25Layer = L.geoJson(buffer25, {
style: buffStyle,
pane: 'bufferPane'
});
var buffer50Layer = L.geoJson(buffer50, {
style: buffStyle,
pane: 'bufferPane'
});
var buffer100Layer = L.geoJson(buffer100, {
style: buffStyle,
pane: 'bufferPane'
});
// Some code to turn off and on different buffers
// ...
WARNING: Poor Don't-Repeat-Yourself practices...
...but it works :)
3. Presentation to Class
Task: Present analysis and project recommendations to group
3. Presentation to Class
Task: Present analysis and project recommendations to group
- Present as a story map using Bootstrap and the jQuery plugin Storymap (FOSS, FOSS4G)
- Overlay features as tile layers
- Style data in Tilemill/Mapbox Studio (FOSS4G)
- Extract tile directory from .mbtiles using QGIS plugin MBTiles2img (FOSS4G)
- Serve tiles as TMS from GitHub (FOSS)
// Example: Scroggin Park Contours
L.tileLayer('http://ryan-m-cooper.com/more-than-esri-gis/03_PresentationToGroup/data/scContours/{z}/{x}/{y}')
4. Project Proposal
Task: Add simple map of the project site to the project proposal
-
GSCPC fork of LA Times print-map-maker (FOSS4G)
- Originally only meant to work w/ Mapbox basemaps
- Extended code to be able to handle more basemap sources!
- Add GeoJSON features to map
- Get GeoJSON of Scroggin Park outline from GSCPC server (Esri)
- Create GeoJSON of coordinates for Scroggin Park basketball court using geojson.io (FOSS4G)
Explore more!
- OSGeo-Live: Virtual machine loaded with a wide variety of FOSS4G applications
- FOSS4G Conference Video Archive: Recordings of presentations from FOSS4G conferences
- Awesome-Geospatial: Organized list of a wide variety of commercial and FOSS4G applications and resources
- #gistribe: Weekly twitter chat with folks from all over the world who are interested in geospatial technology (Wed. 3:00EST/2:00CST)
- The Spatial Community: A Slack channel focused on geospatial tech. Lots of active rooms with devs from Esri, Mapbox, Carto, and more
- digital-geography.com: Platform-agnostic blog with lots of tutorials that include hybrid Esr-FOSS4G workflows
- GeoHipster: Interviews with folks who are somehow involved with mappy things
Thanks!
Georgetown-Scott County Planning Commission
@maptastik
ryan-m-cooper.com
ryancooper729@gmail.com
Toward a More-Than-Esri GIS
By maptastik
Toward a More-Than-Esri GIS
Presentation on using Esri and FOSS4G together in beautiful harmony. Presented by Ryan Cooper on October 18, 2016 at KAMP 2016
- 2,044