Adding new Basemap to Arcgis map using React

Question

In the Arcgis developer webpage, there is an article on how to add a new custom baseMap with custom API url. Which looks like this:

require([
    "esri/basemaps",
    "esri/map",
    "dojo/domReady!"
  ], function (esriBasemaps, Map){
    esriBasemaps.delorme = {
      baseMapLayers: [{url: "https://services.arcgisonline.com/ArcGIS/rest/services/Specialty/DeLorme_World_Base_Map/MapServer"}
      ],
      thumbnailUrl: "https://www.example.com/images/thumbnail_2014-11-25_61051.png",
      title: "Delorme"
    };

    var map = new Map("ui-map", {
      basemap: "delorme",
      center: [-111.879655861, 40.571338776], // long, lat
      zoom: 13,
      sliderStyle: "small"
    });
});

Now I dont reallt understand how to do the same using react-arcgis. It seems that there is no built method in react-arcgis to use custom API url`` as BaseMapbut is there an option to do something similar inReact` ?

this.props.map.basemap = 'streets-relief-vector';

Instead of using the built in basemap strings.

Created also a simple CodeSandbox to test this out.

Answer 1

You can set basemap like this

<Map mapProperties={{ basemap: "streets-relief-vector" }}>