A plugin for Esri Leaflet that enables consuming Stream Services published by ArcGIS for Server.
Clone or download
Latest commit d88ac80 Jun 9, 2018
Type Name Latest commit message Commit time
Failed to load latest commit information.
dist Update for handling wss Jun 9, 2018
example Update for handling wss Jun 9, 2018
src Update for handling wss Jun 9, 2018
.gitignore Update for handling wss Jun 9, 2018
LICENSE initial commit Jul 11, 2016
README.md Update for handling wss Jun 9, 2018
package.json Increment version Jun 9, 2018


Esri Leaflet Stream

A plugin for Esri Leaflet that enables consuming Stream Services published by ArcGIS for Server. View Demo

Basic Usage

Step 1. Include the required js in your document.

   	<script src="dist/esri-leaflet-stream.min.js"></script>

Step 2. Create a stream layer using the L.esri.streamFeatureLayer function, the socket connection is started automatically when the layer is added to the map.

	var buses = L.esri.streamFeatureLayer({
		url: 'https://geoeventsample1.esri.com:6443/arcgis/rest/services/LABus/StreamServer'

Background Information

Esri Stream Services provide a convenient way to consume streaming data published via the GeoEvent Extension with ArcGIS for Server. Basically they continually send data to the website which you can then use however you'd like. For more information also check out the REST API.


Option Type Description
url String Required The service url of a streaming layer eg https://geoeventsample3.esri.com:6443/arcgis/rest/services/SeattleBus/StreamServer
useMapViewExtent Boolean Applies a geographic filter meaning data is only sent for the current map view (note: the extent updates as the map is panned and zoomed). Defaults to false.
customExtent Envelope Object An Esri envelope to spatial restrict the features. Not set by default.
where String An optional expression to filter features server side. String values should be denoted using single quotes ie: where: "FIELDNAME = 'field value'"; More information about valid SQL syntax.
fields Array An array of fieldnames to pull from the service. Includes all fields by default.
wss Boolean Whether to use secure protocol or not. Set to false as default.


	var buses = L.esri.streamFeatureLayer({
		url: 'https://geoeventsample1.esri.com:6443/arcgis/rest/services/LABus/StreamServer',
		useMapViewExtent: true,
		where: "run_id='76_173_1'",
		fields: ['run_id', 'heading'],
		pointToLayer: function (geojson, latlng) {
			return L.circleMarker(latlng, {
				fillColor: createRandomFill(),
				fillOpacity: 0.8,
				color: "#cccccc",
				weight: 2


Method Description
setCustomExtent(<Envelope Object>) Set a new custom extent for the socket connection.
clearCustomExtent() Removes the custom extent meaning no geographic filter will be applied to the socket connection.
useMapViewExtent(Boolean) Set whether to use the map view extent as a geographic filter for the socket connection, this updates automatically as the map is zoomed and panned.
setWhere(String) Sets a where clause on the socket connection to limit data received by the socket connection.
clearWhere() Remove the where clause from the socket connection.
clearLayers() Clears the layers drawn by the socket connection.


	var buses = L.esri.streamFeatureLayer({
		url: 'https://geoeventsample1.esri.com:6443/arcgis/rest/services/LABus/StreamServer'


Event Description
socketConnected The socket connection has successfully connected.
socketError The socket connection failed to connect.
socketMessage A message was received by the socket connection, returns an object containing the geojson feature as well as the resulting leaflet layer.
socketUpdated A message confirming that the socket connection has been updated, triggered when the filters change.


	function msgEvent (msgDetails) {
	buses.on('socketMessage', msgDetails);


Huge hats off go to mourner and all the contributors to the leaflet.js project! Additional thanks to the folks involved in esri-leaflet for making it super easy to work with services published from the Esri stack.