extending esri maps for sharepoint with the javascript api

37
Extending Esri Maps for SharePoint using the JavaScript API Dara Burlo, Elitsa Baklova

Upload: vuphuc

Post on 14-Feb-2017

256 views

Category:

Documents


5 download

TRANSCRIPT

Page 1: Extending Esri Maps for SharePoint with the JavaScript API

Extending Esri Maps for SharePoint using the JavaScript API

Dara Burlo, Elitsa Baklova

Page 2: Extending Esri Maps for SharePoint with the JavaScript API

Agenda

• Overview of Esri Maps for SharePoint• Extending Esri Maps for SharePoint• Writing Extensions• Creating Extension Packs• Adding Extension Packs to Esri Maps for SharePoint• Putting it all together

Page 3: Extending Esri Maps for SharePoint with the JavaScript API

Introduction to Esri Maps for SharePoint

Page 4: Extending Esri Maps for SharePoint with the JavaScript API

Esri Maps for SharePoint

• Bring Maps and Location-Based Analysis to SharePoint, the platform everyone in your company uses.

• Extensible, full-featured product built on the latest HTML technology, targeting both SharePoint on-premises and online.

Page 5: Extending Esri Maps for SharePoint with the JavaScript API

Esri Maps for SharePoint

• Geoenable/Geoenrich lists, including external lists connecting to SQL Server

• Visualize locations of list items

Page 6: Extending Esri Maps for SharePoint with the JavaScript API

Esri Maps for SharePoint

• Build web pages with maps and map-based analytics

Page 7: Extending Esri Maps for SharePoint with the JavaScript API

Esri Maps for SharePoint

• Share beyond SharePoint through ArcGIS

Page 8: Extending Esri Maps for SharePoint with the JavaScript API

Create Rich Interactive Web Maps

• JavaScript-based• Create, edit and publish with

simple dialog-driven control• Mash up your data from

SharePoint Lists, SQL ServerTables, your published MXDsand the global content on Esri’splatform

Page 9: Extending Esri Maps for SharePoint with the JavaScript API

Esri Maps for SharePoint

• Search for world addresses and places• Geo-statistical hot spot analysis• Point-to-point routing• Polygon and polyline feature support• Setups in 26 languages

Page 10: Extending Esri Maps for SharePoint with the JavaScript API

Extending Esri Maps for SharePoint

Page 11: Extending Esri Maps for SharePoint with the JavaScript API

Extensibility Technology

• Familiar & Non-Disruptive- Dojo- ArcGIS JavaScript API

ArcGIS JavaScript API

Dojo

ArcGIS JavaScript API

Dojo

Esri Maps for SharePoint Extensibility

Page 12: Extending Esri Maps for SharePoint with the JavaScript API

What Are You Extending?Main menu

Map contents toolbar

Map

Too

ls

Layer menu

Select tools

Popup tools

Page 13: Extending Esri Maps for SharePoint with the JavaScript API

Extension Points

• Tools- E.g. when a button on a tool bar is clicked- User-driven- Functionality initiated by user action

• Behaviors- E.g. when a layer is added to the map- Event-driven- Functionality triggered by events

• Picture Marker Sets- E.g. your organization’s custom symbols

• Packaged in an Extension Pack

Page 14: Extending Esri Maps for SharePoint with the JavaScript API

Extension Packs

• Extension Pack – folder which contains:- Manifest

- List of tools, behaviors and picture marker symbols

- Tools- Behaviors- Picture Marker Sets- Supporting files

Page 15: Extending Esri Maps for SharePoint with the JavaScript API

Writing Extensions

Page 16: Extending Esri Maps for SharePoint with the JavaScript API

App Object

• Entry point into Esri Maps for SharePoint’s extensibility• Exposes map functionality

Page 17: Extending Esri Maps for SharePoint with the JavaScript API

Tools

• Functionality associated with a button on a toolbar/menu- E.g. when a button on a tool bar is clicked

Page 18: Extending Esri Maps for SharePoint with the JavaScript API

Creating a Tool

• Dojo Class Inheriting from _Tool

_Tool

MyTool

Page 19: Extending Esri Maps for SharePoint with the JavaScript API

Behaviors

• Functionality invoked when an event occurs• E.g. when a layer is added to the map

Page 20: Extending Esri Maps for SharePoint with the JavaScript API

Creating a Behavior

• Dojo Class Inheriting from _Behavior or a Subclass

_Behavior

MyBehavior

Page 21: Extending Esri Maps for SharePoint with the JavaScript API

Empowering Extensions: Working with SharePoint Data

• SharePoint layers- Is a JS API FeatureLayer based on feature collection

FeatureLayer

Page 22: Extending Esri Maps for SharePoint with the JavaScript API

Creating Picture Marker Sets

- Symbolize your data using custom symbols- Images such as pngs, jpgs and urls to an image- Define properties such as:

- type- url- width- height- xoffset- yoffset

Page 23: Extending Esri Maps for SharePoint with the JavaScript API

Picture Marker Sets

• Identify url location of each symbol

Page 24: Extending Esri Maps for SharePoint with the JavaScript API

Creating Extension Packs for Esri Maps for SharePoint

Page 25: Extending Esri Maps for SharePoint with the JavaScript API

Creating Extension Packs

• Extension Pack – folder which contains:- Manifest

- List of tools, behaviors and picture marker symbols

- Tools- Behaviors- Picture Marker Sets- Supporting files

Page 26: Extending Esri Maps for SharePoint with the JavaScript API

Creating the Manifest

• List of Tools, Behaviors and Picture Marker Sets in the Extension Pack• E.g. your organization’s custom symbols

E.g. your organization’s custom symbols

Page 27: Extending Esri Maps for SharePoint with the JavaScript API

Upload Extension Packs: 3 Options

Page 28: Extending Esri Maps for SharePoint with the JavaScript API

Adding Extension Packs to Esri Maps for SharePoint

Page 29: Extending Esri Maps for SharePoint with the JavaScript API

Adding custom tools/behaviors to an Esri Map Web Part

• Upload extension pack to the site• Edit existing Esri Maps Web Part • Configure the Esri Map Web Part • Click the extension point in the Esri Maps

Web Part you would like to add the tool/behavior to

• Add the tool/behavior• Configure the tool/behavior’s settings if necessary• Save map web part

Page 30: Extending Esri Maps for SharePoint with the JavaScript API

Adding custom tools/behaviors as part of default Esri Map Web Part

• Upload extension pack to the site• Modify Esri Maps Configuration Files

- Found under Site Settings- Edit tool_collection.json & behavior.json- Save changes

• Adds to new Esri Maps Web Parts • Note: Applies to newly created

Esri Map Web Parts

Page 31: Extending Esri Maps for SharePoint with the JavaScript API

Putting it all together

Page 32: Extending Esri Maps for SharePoint with the JavaScript API

Tips to Start Developing Extensions

• Download pre-existing samples from help system- Unzip sample

• Edit contents in your preferred IDE (Visual Studio, Source View, Notepad, etc.)- Add code for tool or behavior - Include tool, behavior or picture marker symbols in the manifest file- Include any supporting files (html, graphics, etc.)

• Deploy folder to your preferred web server (IIS, Apache, etc.)

• Add extension as url to SharePoint

• Add an Esri Map Web Part to page

• Configure the Esri Map Web Part to include your tool or behavior

• Debug in your preferred browser- If changes are needed edit files and reload the page

Page 33: Extending Esri Maps for SharePoint with the JavaScript API

Elitsa BaklovaDemo

Page 34: Extending Esri Maps for SharePoint with the JavaScript API

Esri Maps for SharePoint Roadmap

Page 35: Extending Esri Maps for SharePoint with the JavaScript API

Release Roadmap

Already Released• 3.0.1 - current release

(download today from the list of Location Analytics apps at www.arcgis.com)• 4.0 Beta 2 - current beta

(join today at betacommunity.esri.com)

Coming Soon• 4.0 - Late Spring 2015• 4.0.1 - Localization release Summer 2015

Page 36: Extending Esri Maps for SharePoint with the JavaScript API

Q&A

Page 37: Extending Esri Maps for SharePoint with the JavaScript API

Rate This Sessionwww.esri.com/RateMyDevSummitSession