¿Usa un mapa base propio con la API de ArcGIS para Javascript?

12

Estoy tratando de hacer un mapa usando la API de Javascript.

Quiero usar mi propio mapa base, pero no puedo encontrar el código más simple para hacerlo.

Siempre veo algo como esto:

  function init() {
    map = new esri.Map("mapDiv", {
      basemap: "satellite",
      center: [-97.395, 37.537],
      zoom: 11
    });

Pero no quiero usar los mapas base en línea de ArcGIS.

¿Cuál es el código para hacer un servicio de mapas donde estoy alojando mi mapa base?

ianbroad
fuente
1
¿ha creado mosaicos desde su propio mapa base?
Mapperz

Respuestas:

12

La referencia de API para la clase de mapa dice lo siguiente:

Las siguientes son opciones válidas: "calles", "satélite", "híbrido", "topo", "gris", "océanos", "nacional-geográfico", "osm". A partir de la versión 3.3

En su lugar, debe definir una nueva capa de servicio de mapas en mosaico de ArcGIS y usarla de la siguiente manera:

var baseMapLayer = new esri.layers.ArcGISTiledMapServiceLayer("your URL");
map.addLayer(baseMapLayer);
Devdatta Tengshe
fuente
1
@StephenLead setBasemap solo acepta parámetros de cadena, por lo que no funcionará.
digz6666
2
@ digz6666 oops, creo que tienes razón. Eliminaré ese comentario
Stephen Lead el
2
@StephenLead He encontrado una manera. Publicaré como respuesta. ¡Vaya! Requiere 10 puntos de rep para responder esto, maldición :)
digz6666
@ digz6666: No debería necesitar 10 repeticiones para crear una respuesta. Ver gis.stackexchange.com/help/privileges
Devdatta Tengshe
5

Para arcgis javascript SDK versión 3.x puede usar la clase esri / basemaps para declarar y registrar mapas base personalizados y usar con su mapa: https://developers.arcgis.com/javascript/3/jsapi/esri.basemaps-amd.html

Declarar y registrar un mapa base personalizado:

Basemaps.mybasemap = {
  title: 'My custom basemap',
  thumbnailUrl: 'https://js.arcgis.com/3.22/esri/images/basemap/satellite.jpg',
  //itemId: 'ulas',
  baseMapLayers: [
    { url: "https://services.arcgisonline.com/ArcGIS/rest/services/Specialty/DeLorme_World_Base_Map/MapServer" }
  ]
};

Utilice un mapa base personalizado en el constructor de mapas:

var map = new Map("mapDiv", {
  basemap: "mybasemap",
  center: [-122.69, 45.52],
  zoom: 3
});

O puede aplicar su mapa base personalizado al mapa existente:

map.setBasemap("mybasemap");

Ejemplo de código completo: https://codepen.io/digz6666/pen/wPwPbW

Para arcgis javascript SDK versión 4.x puede usar esri / Basemap.

Declare la capa del mapa base y el mapa base:

var baseLayer = new MapImageLayer({
  url: "https://services.arcgisonline.com/ArcGIS/rest/services/Specialty/DeLorme_World_Base_Map/MapServer"
});
var myBasemap = this.esri.basemap({
  baseLayers: [baseLayer],
  title: 'My custom basemap',
  id: 'my_custom_basemap'
});

Aplicar mapa base al objeto de mapa existente:

map.basemap = myBasemap;
digz6666
fuente
2

No tiene que especificar un mapa base incorporado. Agregue su mapa base personalizado como una capa así.

var map;
require(["esri/map", "esri/layers/ArcGISTiledMapServiceLayer", "dojo/domReady!"],
function (Map, ArcGISTiledMapServiceLayer ) {
    map = new Map("map", {                
        center: [-76.756, 40.241],
        zoom: 8
    });            
    var customBasemap = new ArcGISTiledMapServiceLayer(
    "http://services.arcgisonline.com/ArcGIS/rest/services/NatGeo_World_Map/MapServer");
    map.addLayer(customBasemap);
});
James Lawruk
fuente