CODEWITHSUNDEEP
javascriptarcgisarcgis-js-api
Luis Carlos Cruz Castillo
Luis Carlos Cruz Castillo

Reputation: 311

How to display basemap and a TileLayer ArcGIS Javascript API

I'm using the API of ArcGIS for JavaScript to display a cached map service. So far, I've been following the documentation and this is what I have.

const mapLayer = new TileLayer({
  url: "https://sigmun.implanchihuahua.org/webserver/rest/services/Metrica_Chihuahua/PU023_Dosificacion_Zonificacion_Secundaria_2021_MC/MapServer",
  opacity: 0.3
});

const map = new Map({
  basemap: 'osm',
  layers: [mapLayer],
});

This code displays the next enter image description here

Even though I created the TileLayer instance it doesn't show up, but if I removed the basemap line, like this.

const mapLayer = new TileLayer({
  url: "https://sigmun.implanchihuahua.org/webserver/rest/services/Metrica_Chihuahua/PU023_Dosificacion_Zonificacion_Secundaria_2021_MC/MapServer",
  opacity: 0.3
});

const map = new Map({
  // basemap: 'osm',
  layers: [mapLayer],
});

The TileLayer gets displayed. enter image description here

What I want to do is display both things, the basemap and the tile layer.

Upvotes: 0

Views: 336

Answers (1)

Bjorn Svensson
Bjorn Svensson

Reputation: 888

Your tiled layer is not displaying on top of the OSM basemap because its tiles were created in a different spatial reference.

https://sigmun.implanchihuahua.org/webserver/rest/services/Metrica_Chihuahua/PU023_Dosificacion_Zonificacion_Secundaria_2021_MC/MapServer shows PROJCS["MEXICO_ITRF_2008_UTM_Zone_13N"... while the OSM basemap is in the WebMercator.

Upvotes: 1

Related Questions