Try the showcase app... NYC Then & Now
Digital orthophotography (orthos) for NYC has been captured on a biennial basis since 2004. Prior to that there were two ad-hoc captures starting with 1996. The orthos have evolved over the years from 1-foot pixel resolution, with selective true ortho, to 6-inch pixel resolution with full true orthos. These image data sets, along with additional aerial photography captured prior to 1996, are being made publicly available as described below. Click here further details on the aerial and orthophotography data.
Beginning in 2004 planimetric data (i.e., geographic features captured from aerial survey) has been extracted from the orthos every-other ortho capture (i.e., every four years). Although the planimetric data sets are already available on the NYC OpenData Portal, a map service is being made available to extend and simplify usage of the data as described below. Click here for further details on the planimetric data.
Each of these map tile sets are © City of New York, licensed for reuse under the Creative Commons Attribution (CC BY 4.0) license.
Service Description: https://maps.nyc.gov/tms/1.0.0/
The GIS team at NYC's Department of Information Technology has published a new Open Source Geospatial Foundation standard Tile Map Service (TMS) using GeoServer and GeoWebCache from Boundless. The TMS serves multiple tiled maps, in the Web Mercator projection, (EPSG:3857) compatible with most JavaScript web mapping libraries such as OpenLayers, MapBox, Leaflet, and even ArcGIS.
Note: Basemap tiles containing changing features based on NYC street centerline and building data will be updated on a quarterly basis.
A base layer for all of your mapping applications that contains parks, streets, buildings and other planimetric features.
A label layer that contains neighborhood, park, street and other labels to overlay on the basemap layer.
A label layer that contains neighborhood, park, street and other labels to overlay on the aerial photography layers.
An orthophotography layer created from the 2018 flyover.
An orthophotography layer created from the 2016 flyover.
An orthophotography layer created from the 2014 flyover.
An orthophotography layer created from the 2012 flyover.
An orthophotography layer created from the 2010 flyover.
An orthophotography layer created from the 2008 flyover.
An orthophotography layer created from the 2006 flyover.
An orthophotography layer created from the 2004 flyover.
An aerial photography layer created from the 2001-2 flyover.
An aerial photography layer created from the 1996 flyover.
An aerial photography layer created from a 1951 flyover.
An aerial photography layer created from a 1924 flyover.
Service Description: https://maps.nyc.gov/tms/1.0.0/
The GIS team at NYC's Department of Information Technology has published a new Slippy Map Service (XYZ) using GeoServer and GeoWebCache from Boundless. The TMS serves multiple tiled maps, in the Web Mercator projection, (EPSG:3857) compatible with most JavaScript web mapping libraries such as OpenLayers, MapBox, Leaflet, and even ArcGIS.
Note: Basemap tiles containing changing features based on NYC street centerline and building data will be updated on a quarterly basis.
A base layer for all of your mapping applications that contains parks, streets, buildings and other planimetric features.
A label layer that contains neighborhood, park, street and other labels to overlay on the basemap layer.
A label layer that contains neighborhood, park, street and other labels to overlay on the aerial photography layers.
An orthophotography layer created from the 2016 flyover.
An orthophotography layer created from the 2016 flyover.
An orthophotography layer created from the 2014 flyover.
An orthophotography layer created from the 2012 flyover.
An orthophotography layer created from the 2010 flyover.
An orthophotography layer created from the 2008 flyover.
An orthophotography layer created from the 2006 flyover.
An orthophotography layer created from the 2004 flyover.
An aerial photography layer created from the 2001-2 flyover.
An aerial photography layer created from the 1996 flyover.
An aerial photography layer created from a 1951 flyover.
An aerial photography layer created from a 1924 flyover.
Get Capabilities: https://maps.nyc.gov/wmts/1.0.0/?REQUEST=getcapabilities
The GIS team at NYC's Department of Information Technology has published a new Open Geospatial Consortium standard Web Map Tile Service (WMTS) using GeoServer and GeoWebCache from Boundless. The TMS serves multiple tiled maps, in the Web Mercator projection, (EPSG:3857) compatible with most JavaScript web mapping libraries such as OpenLayers, MapBox, Leaflet, and even ArcGIS.
Note: Basemap tiles containing changing features based on NYC street centerline and building data will be updated on a quarterly basis.
A base layer for all of your mapping applications that contains parks, streets, buildings and other planimetric features.
A label layer that contains neighborhood, park, street and other labels to overlay on the basemap layer.
A label layer that contains neighborhood, park, street and other labels to overlay on the aerial photography layers.
An orthophotography layer created from the 2016 flyover.
An orthophotography layer created from the 2016 flyover.
An orthophotography layer created from the 2014 flyover.
An orthophotography layer created from the 2012 flyover.
An orthophotography layer created from the 2010 flyover.
An orthophotography layer created from the 2008 flyover.
An orthophotography layer created from the 2006 flyover.
An orthophotography layer created from the 2004 flyover.
An aerial photography layer created from the 2001-2 flyover.
An aerial photography layer created from the 1996 flyover.
An aerial photography layer created from a 1951 flyover.
An aerial photography layer created from a 1924 flyover.
Below are some basic examples that show how to use the NYC Map Tiles in a web page. Please note the extent limits placed on the layers. These limits will prevent your application from making spurious tile requests for areas outside of extent of the NYC data which could slow down your map rendering.
For more extensive examples that include using the aerial photography layers, and address geocoding using the GeoClient API and nyc-lib JavaScript libraries please see https://maps.nyc.gov/nyc-lib/.
var view = new ol.View({ center: [-8235252, 4969073], minZoom: 8, maxZoom: 19, zoom: 10 }); var baseLayer = new ol.layer.Tile({ extent: [-8453323, 4774561, -7983695, 5165920], source: new ol.source.XYZ({ url: 'https://maps{1-4}.nyc.gov/tms/1.0.0/carto/basemap/{z}/{x}/{-y}.jpg' }) }); var labelLayer = new ol.layer.Tile({ extent: [-8268000, 4870900, -8005000, 5055500], source: new ol.source.XYZ({ url: 'https://maps{1-4}.nyc.gov/tms/1.0.0/carto/label/{z}/{x}/{-y}.png8' }) }); var map = new ol.Map({ target: 'map', /* The id of the DOM element that will contain the map */ view: view, layers: [baseLayer, labelLayer] });
View the OpenLayers TMS map...var view = new ol.View({ center: [-8235252, 4969073], minZoom: 8, maxZoom: 19, zoom: 10 }); var baseLayer = new ol.layer.Tile({ extent: [-8453323, 4774561, -7983695, 5165920], source: new ol.source.XYZ({ url: 'https://maps{1-4}.nyc.gov/xyz/1.0.0/carto/basemap/{z}/{x}/{y}.jpg' }) }); var labelLayer = new ol.layer.Tile({ extent: [-8268000, 4870900, -8005000, 5055500], source: new ol.source.XYZ({ url: 'https://maps{1-4}.nyc.gov/xyz/1.0.0/carto/label/{z}/{x}/{y}.png8' }) }); var map = new ol.Map({ target: 'map', /* The id of the DOM element that will contain the map */ view: view, layers: [baseLayer, labelLayer] });
View the OpenLayers XYZ map...var map, baseLayer, labelLayer; var view = new ol.View({ center: [-8235252, 4969073], minZoom: 8, maxZoom: 19, zoom: 10 }); var parser = new ol.format.WMTSCapabilities(); fetch('https://maps.nyc.gov/wmts/1.0.0/?REQUEST=GetCapabilities').then(function(response){ return response.text(); }).then(function(text){ var result = parser.read(text); var baseOptions = ol.source.WMTS.optionsFromCapabilities(result, { layer: 'basemap', matrixSet: 'EPSG:900913' }); var labelOptions = ol.source.WMTS.optionsFromCapabilities(result, { layer: 'label', matrixSet: 'EPSG:900913' }); baseLayer = new ol.layer.Tile({ source: new ol.source.WMTS(baseOptions) }); labelLayer = new ol.layer.Tile({ source: new ol.source.WMTS(labelOptions) }); map = new ol.Map({ target: 'map', /* The id of the DOM element that will contain the map */ view: view, layers: [baseLayer, labelLayer] }); });
View the OpenLayers WMTS map...var map = L.map('map' /* The id of the DOM element that will contain the map */); map.setView([40.703312, -73.97968], 10); var baseLayer = L.tileLayer('https://maps{s}.nyc.gov/tms/1.0.0/carto/basemap/{z}/{x}/{y}.jpg', { minNativeZoom: 8, maxNativeZoom: 19, subdomains: '1234', tms: true, bounds: L.latLngBounds([39.3682, -75.9374], [42.0329, -71.7187]) }); map.addLayer(baseLayer); var labelLayer = L.tileLayer('https://maps{s}.nyc.gov/tms/1.0.0/carto/label/{z}/{x}/{y}.png8', { minNativeZoom: 8, maxNativeZoom: 19, subdomains: '1234', tms: true, bounds: L.latLngBounds([40.0341, -74.2727], [41.2919, -71.9101]) }); map.addLayer(labelLayer);
View the Leaflet TMS map...var map = L.map('map' /* The id of the DOM element that will contain the map */); map.setView([40.703312, -73.97968], 10); var baseLayer = L.tileLayer('https://maps{s}.nyc.gov/xyz/1.0.0/carto/basemap/{z}/{x}/{y}.jpg', { minNativeZoom: 8, maxNativeZoom: 19, subdomains: '1234', bounds: L.latLngBounds([39.3682, -75.9374], [42.0329, -71.7187]) }); map.addLayer(baseLayer); var labelLayer = L.tileLayer('https://maps{s}.nyc.gov/xyz/1.0.0/carto/label/{z}/{x}/{y}.png8', { minNativeZoom: 8, maxNativeZoom: 19, subdomains: '1234', bounds: L.latLngBounds([40.0341, -74.2727], [41.2919, -71.9101]) }); map.addLayer(labelLayer);
View the Leaflet XYZ map...require([ 'esri/Map', 'esri/views/MapView', 'esri/layers/WebTileLayer', 'esri/geometry/Extent', 'dojo/domReady!' ], function(Map, MapView, WebTileLayer, Extent){ var TMSLayer = WebTileLayer.createSubclass({ getTileUrl: function(level, row, col){ var supermethod = this.getInherited(arguments); var y = Math.pow(2, level) - row - 1; return supermethod.call(this, level, y, col); } }); var map = new Map({}); var view = new MapView({ container: 'map' /* The id of the DOM element that will contain the map */, map: map, center: [-73.97968, 40.703312], zoom: 10 }); var baseLayer = new TMSLayer({ urlTemplate: 'https://maps{subDomain}.nyc.gov/tms/1.0.0/carto/basemap/{level}/{col}/{row}.jpg', subDomains: ['1', '2', '3', '4'], fullExtent: new Extent({xmin: -8453323, ymin: 4774561, xmax: -7983695, ymax: 5165920}) }); map.add(baseLayer); var labelLayer = new TMSLayer({ urlTemplate: 'https://maps{subDomain}.nyc.gov/tms/1.0.0/carto/label/{level}/{col}/{row}.png8', subDomains: ['1', '2', '3', '4'], fullExtent: new Extent({xmin: -8268000, ymin: 4870900, xmax: -8005000, ymax: 5055500}) }); map.add(labelLayer); });
View the ArcGIS 4.x map...require([ 'esri/Map', 'esri/views/MapView', 'esri/layers/WebTileLayer', 'esri/geometry/Extent', 'dojo/domReady!' ], function(Map, MapView, WebTileLayer, Extent){ var map = new Map({}); var view = new MapView({ container: 'map' /* The id of the DOM element that will contain the map */, map: map, center: [-73.97968, 40.703312], zoom: 10 }); var baseLayer = new WebTileLayer({ urlTemplate: 'https://maps{subDomain}.nyc.gov/xyz/1.0.0/carto/basemap/{level}/{col}/{row}.jpg', subDomains: ['1', '2', '3', '4'], fullExtent: new Extent({xmin: -8453323, ymin: 4774561, xmax: -7983695, ymax: 5165920}) }); map.add(baseLayer); var labelLayer = new WebTileLayer({ urlTemplate: 'https://maps{subDomain}.nyc.gov/xyz/1.0.0/carto/label/{level}/{col}/{row}.png8', subDomains: ['1', '2', '3', '4'], fullExtent: new Extent({xmin: -8268000, ymin: 4870900, xmax: -8005000, ymax: 5055500}) }); map.add(labelLayer); });
View the ArcGIS 4.x XYZ map...require([ 'esri/map', 'esri/layers/WebTiledLayer', 'esri/geometry/Extent' ], function(Map, WebTiledLayer, Extent){ var TMSLayer = WebTiledLayer.createSubclass({ getTileUrl: function(level, row, col){ var supermethod = this.getInherited(arguments); var y = Math.pow(2, level) - row - 1; return supermethod.call(this, level, y, col); } }); var map = new Map('map', { center: [-73.97968, 40.703312], zoom: 10 }); var baseLayer = new TMSLayer('https://maps{subDomain}.nyc.gov/tms/1.0.0/carto/basemap/{level}/{col}/{row}.jpg', { subDomains: ['1', '2', '3', '4'], fullExtent: new Extent(-8453323, 4774561, -7983695, 5165920}) }); map.addLayer(baseLayer); var labelLayer = new TMSLayer('https://maps{subDomain}.nyc.gov/tms/1.0.0/carto/label/{level}/{col}/{row}.png8', { subDomains: ['1', '2', '3', '4'], fullExtent: new Extent(-8268000, 4870900, -8005000, 5055500) }); map.addLayer(labelLayer); });
View the ArcGIS 3.x TMS map...require([ 'esri/map', 'esri/layers/WebTiledLayer', 'esri/geometry/Extent' ], function(Map, WebTiledLayer, Extent){ var map = new Map('map', { center: [-73.97968, 40.703312], zoom: 10 }); var baseLayer = new WebTiledLayer('https://maps{subDomain}.nyc.gov/xyz/1.0.0/carto/basemap/{level}/{col}/{row}.jpg', { subDomains: ['1', '2', '3', '4'], fullExtent: new Extent(-8453323, 4774561, -7983695, 5165920}) }); map.addLayer(baseLayer); var labelLayer = new WebTiledLayer('https://maps{subDomain}.nyc.gov/xyz/1.0.0/carto/label/{level}/{col}/{row}.png8', { subDomains: ['1', '2', '3', '4'], fullExtent: new Extent(-8268000, 4870900, -8005000, 5055500) }); map.addLayer(labelLayer); });
View the ArcGIS 3.x XYZ map...require([ 'esri/map', 'esri/layers/WMTSLayer', 'esri/layers/WMTSLayerInfo', 'esri/geometry/Extent' ], function(Map, WMTSLayer, WMTSLayerInfo, Extent){ var map = new Map('map', { center: [-73.97968, 40.703312], zoom: 10 }); var baseInfo = new WMTSLayerInfo({ identifier: 'basemap', tileMatrixSet: 'EPSG:900913', format: 'jpeg', fullExtent: new Extent(-8453323, 4774561, -7983695, 5165920) }); var baseOptions = { serviceMode: 'KVP', layerInfo: baseInfo }; var baseLayer = new WMTSLayer('https://maps.nyc.gov/wmts/1.0.0/', baseOptions); map.addLayer(baseLayer); var labelInfo = new WMTSLayerInfo({ identifier: 'label', tileMatrixSet: 'EPSG:900913', format: 'png8', fullExtent: new Extent(-8453323, 4774561, -7983695, 5165920) }); var labelOptions = { serviceMode: 'KVP', layerInfo: labelInfo }; var labelLayer = new WMTSLayer('https://maps.nyc.gov/wmts/1.0.0/', labelOptions); map.addLayer(labelLayer); });
View the ArcGIS 3.x WMTS map...