Working with Feature Layers - Esri€¦ · slides: . Agenda Types of feature layers Rendering...

25
Working with Feature Layers Working with Feature Layers in the ArcGIS API for JavaScript in the ArcGIS API for JavaScript Yann Cabon | Noah Sager slides: https://git.io/fhp4D

Transcript of Working with Feature Layers - Esri€¦ · slides: . Agenda Types of feature layers Rendering...

Page 1: Working with Feature Layers - Esri€¦ · slides: . Agenda Types of feature layers Rendering Labeling Querying Editing features. Feature Layer powered by Feature Services Feature

Working with Feature LayersWorking with Feature Layersin the ArcGIS API for JavaScriptin the ArcGIS API for JavaScript

Yann Cabon | Noah Sager

slides: https://git.io/fhp4D

Page 2: Working with Feature Layers - Esri€¦ · slides: . Agenda Types of feature layers Rendering Labeling Querying Editing features. Feature Layer powered by Feature Services Feature

AgendaAgenda

Types of feature layersRenderingLabelingQueryingEditing features

Page 4: Working with Feature Layers - Esri€¦ · slides: . Agenda Types of feature layers Rendering Labeling Querying Editing features. Feature Layer powered by Feature Services Feature

Bringing a feature layer into your appBringing a feature layer into your appFeatureLayer by URL

constconst layer layer == newnew FeatureLayerFeatureLayer(({{

url url:: "https://<url to my server>/FeatureServer""https://<url to my server>/FeatureServer",,

layerId layerId:: 00,,

renderer renderer:: {{ ...... }},,

popupTemplate popupTemplate:: {{ ...... }},,

}}));;

mapmap..addadd((layerlayer));;

Demo

Page 5: Working with Feature Layers - Esri€¦ · slides: . Agenda Types of feature layers Rendering Labeling Querying Editing features. Feature Layer powered by Feature Services Feature

Bringing a feature layer into your appBringing a feature layer into your appRestrict data retrieved from the feature service

to work with a subset of featuresto remove features with null attributes.

layerlayer..definitionExpression definitionExpression == "STATE_NAME = 'California'""STATE_NAME = 'California'";;

Demo

Page 6: Working with Feature Layers - Esri€¦ · slides: . Agenda Types of feature layers Rendering Labeling Querying Editing features. Feature Layer powered by Feature Services Feature

Bringing a feature layer into your appBringing a feature layer into your appFeatureLayer by portal item

constconst portal portal == newnew PortalPortal(({{

url url:: "https://jsapi.maps.argis.com""https://jsapi.maps.argis.com"

}}));;

constconst layer layer == newnew FeatureLayerFeatureLayer(({{

portalItem portalItem:: {{

id id:: "bca022ee5d9440c9b60399ee4d809d9b""bca022ee5d9440c9b60399ee4d809d9b",,

portal portal

}}

}}));;

mapmap..addadd((layerlayer));;

Demo

Page 7: Working with Feature Layers - Esri€¦ · slides: . Agenda Types of feature layers Rendering Labeling Querying Editing features. Feature Layer powered by Feature Services Feature

Bringing a feature layer into your appBringing a feature layer into your appAlternative: using Layer.fromPortalItem()

LayerLayer..fromPortalItemfromPortalItem(({{

portalItem portalItem:: {{

id id:: "82d8d8213afc4bb380bb16083735f573""82d8d8213afc4bb380bb16083735f573"

}}

}}))

..thenthen((((layerlayer)) =>=> {{

map map..addadd((layerlayer));;

}}));;

Demo

Page 8: Working with Feature Layers - Esri€¦ · slides: . Agenda Types of feature layers Rendering Labeling Querying Editing features. Feature Layer powered by Feature Services Feature

RenderingRenderingA renderer de�nes how the FeatureLayer is drawn.

SimpleRendererClassBreaksRendererUniqueValueRendererHeatmapRendererDotDensityRenderer

Guides are available in the API:

Visualization Overview guideRenderer API reference

Page 10: Working with Feature Layers - Esri€¦ · slides: . Agenda Types of feature layers Rendering Labeling Querying Editing features. Feature Layer powered by Feature Services Feature

Rendering... next stepsRendering... next steps

ArcGIS Online: Using Map Styles to Discover and De�ne Your Web Map’s Purpose

Wednesday, July 104:00 pm - 5:00 pm

Room 17 B

Page 12: Working with Feature Layers - Esri€¦ · slides: . Agenda Types of feature layers Rendering Labeling Querying Editing features. Feature Layer powered by Feature Services Feature

Query the data from the serverQuery the data from the serverBring features from your data to the web browsers.

Attribute queriesAttribute queriesselect only features passing a WHERE SQL clause

Spatial queriesSpatial queriesselect only features passing a spatial �lter

Statistic queriesStatistic queriesreturns statistics about the selected features

API Reference

Page 14: Working with Feature Layers - Esri€¦ · slides: . Agenda Types of feature layers Rendering Labeling Querying Editing features. Feature Layer powered by Feature Services Feature

Query the data client-sideQuery the data client-sideQuery data already in the web browser

really fast queriesavoid round-trips to serveronly works with what is available

Client-side statistics

Page 15: Working with Feature Layers - Esri€¦ · slides: . Agenda Types of feature layers Rendering Labeling Querying Editing features. Feature Layer powered by Feature Services Feature

Querying... next stepsQuerying... next steps

Interactive Client-Side Web Mapping with the ArcGIS API for JavaScript

Wednesday, July 1010:00 am - 11:00 am

Room 15 B

Page 16: Working with Feature Layers - Esri€¦ · slides: . Agenda Types of feature layers Rendering Labeling Querying Editing features. Feature Layer powered by Feature Services Feature

EditingEditing

Updating features directly in the web browser

Page 17: Working with Feature Layers - Esri€¦ · slides: . Agenda Types of feature layers Rendering Labeling Querying Editing features. Feature Layer powered by Feature Services Feature

EditingEditing

How do I know if I can edit features?

ArcGIS Server Manager

REST Supported OperationsArcGIS Online / Portal Settings

Page 21: Working with Feature Layers - Esri€¦ · slides: . Agenda Types of feature layers Rendering Labeling Querying Editing features. Feature Layer powered by Feature Services Feature

Related JavaScript Sessions at the UCRelated JavaScript Sessions at the UC

Page 22: Working with Feature Layers - Esri€¦ · slides: . Agenda Types of feature layers Rendering Labeling Querying Editing features. Feature Layer powered by Feature Services Feature

ArcGIS API for JavaScript: What's NewWednesday (1pm - 2pm)

Customizing ArcGIS API for JavaScript WidgetsWednesday (2:30pm - 3:30pm)

Editing with the ArcGIS API for JavaScriptWednesday (4pm - 5pm)

Building 3D GIS Applications with JavaScriptThursday (8:30am - 9:30am)

Building Web Apps with the ArcGIS API for JavaScriptThursday (4pm - 5pm)

Page 23: Working with Feature Layers - Esri€¦ · slides: . Agenda Types of feature layers Rendering Labeling Querying Editing features. Feature Layer powered by Feature Services Feature

Questions?Questions?

Page 24: Working with Feature Layers - Esri€¦ · slides: . Agenda Types of feature layers Rendering Labeling Querying Editing features. Feature Layer powered by Feature Services Feature
Page 25: Working with Feature Layers - Esri€¦ · slides: . Agenda Types of feature layers Rendering Labeling Querying Editing features. Feature Layer powered by Feature Services Feature