Skip to content

Instantly share code, notes, and snippets.

@mrcnc

mrcnc/index.html

Last active September 3, 2016 19:44
Show Gist options
  • Save mrcnc/b35fbcab1c8505cc06a03e6f7ede48ad to your computer and use it in GitHub Desktop.
Save mrcnc/b35fbcab1c8505cc06a03e6f7ede48ad to your computer and use it in GitHub Desktop.
Download ZIP
translate arcgis json to geojson using esri's terraformer
Raw
index.html
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="http://openlayers.org/en/v3.17.1/css/ol.css" type="text/css">
<script src="http://openlayers.org/en/v3.17.1/build/ol.js"></script>
<script src="http://cdn-geoweb.s3.amazonaws.com/terraformer/1.0.4/terraformer.min.js"></script>
<script src="http://cdn-geoweb.s3.amazonaws.com/terraformer-arcgis-parser/1.0.4/terraformer-arcgis-parser.min.js"></script>
<style>
html, body, #map {
margin:0; padding:0; width : 100%; height : 100%;
}
</style>
</head>
<body>
<div id="map"></div>
<script>
let vectorSource = new ol.source.Vector();
let map = new ol.Map({
layers: [
new ol.layer.Tile({
source: new ol.source.OSM()
}),
new ol.layer.Vector({
source: vectorSource
})
],
target: 'map',
view: new ol.View({
center: [0, 0],
zoom: 1
})
});
let dataUrl = 'https://tmservices1.esri.com/arcgis/rest/services/LiveFeeds/Hurricane_Active/MapServer/4/query'
, query = '?where=1=1&geometryType=esriGeometryEnvelope&returnGeometry=true&outSR=3857&f=pjson';
fetch(dataUrl+query)
.then(res => res.json())
.then(json => {
let features = json.features.map(f => Terraformer.ArcGIS.parse(f));
let geojson = {
"type": "FeatureCollection",
"features": features
};
vectorSource.addFeatures(
(new ol.format.GeoJSON()).readFeatures(geojson)
);
});
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment