PortalBasemapsSource

AMD: require(["esri/widgets/BasemapGallery/support/PortalBasemapsSource"], (PortalBasemapsSource) => { /* code goes here */ });
ESM: import PortalBasemapsSource from "@arcgis/core/widgets/BasemapGallery/support/PortalBasemapsSource.js";
Class: esri/widgets/BasemapGallery/support/PortalBasemapsSource
Inheritance: PortalBasemapsSource LocalBasemapsSource Accessor
Since: ArcGIS Maps SDK for JavaScript 4.3

The PortalBasemapsSource class is a Portal-driven Basemap source in the BasemapGalleryViewModel or BasemapGallery widget.

See also

Constructors

PortalBasemapsSource

Constructor
new PortalBasemapsSource(properties)
Parameter
properties Object
optional

See the properties for a list of all the properties that may be passed into the constructor.

Property Overview

Any properties can be set, retrieved or listened to. See the Working with Properties topic.
Show inherited properties Hide inherited properties
Name Type Summary Class
Collection<Basemap>

A collection of Basemaps fetched from the source's Portal.

PortalBasemapsSource
String

The name of the class.

Accessor
BasemapFilter

Function used to filter basemaps after being fetched from the Portal.

PortalBasemapsSource
Portal

The Portal from which to fetch basemaps.

PortalBasemapsSource
Object|String

An object with key-value pairs used to create a custom basemap gallery group query.

PortalBasemapsSource
String

The source's state.

PortalBasemapsSource
UpdateBasemapsCallback

Callback for updating basemaps after being fetched and filtered.

PortalBasemapsSource

Property Details

basemaps

Property
basemaps Collection<Basemap>readonly

A collection of Basemaps fetched from the source's Portal.

declaredClass

Inherited
Property
declaredClass Stringreadonly
Inherited from Accessor
Since: ArcGIS Maps SDK for JavaScript 4.7 Accessor since 4.0, declaredClass added at 4.7.

The name of the class. The declared class name is formatted as esri.folder.className.

filterFunction

Property
filterFunction BasemapFilter

Function used to filter basemaps after being fetched from the Portal.

Example
const basemapGallery = new BasemapGallery({
   view: view,
   source: {
     portal: "https://arcgis.com",
     // async filterFunction support added at v4.27
     filterFunction: async (item, index, basemaps) => {
       let bool = true;
       await item.load().then((loadedBasemap) => {
         // filter out the Oceans basemap
         if (loadedBasemap.title == "Oceans") {
           bool = false;
         }
       })
       return bool;
     }
   }
 });

portal

Property
portal Portal

The Portal from which to fetch basemaps.

query

Property
query Object|String
Since: ArcGIS Maps SDK for JavaScript 4.5 PortalBasemapsSource since 4.3, query added at 4.5.

An object with key-value pairs used to create a custom basemap gallery group query. Note that all parameters will be joined using the AND operator. A query string can also be provided for more advanced use cases.

Examples
// query portal basemaps with an object
let source = new PortalBasemapsSource({
  query: {
    title: "United States Basemaps",
    owner: "Esri_cy_US"
  }
});
// query portal basemaps with a string
let source = new PortalBasemapsSource({
  query: "title:\"United States Basemaps\" AND owner:Esri_cy_US"
});

state

Property
state Stringreadonly

The source's state.

Possible Values:"not-loaded"|"loading"|"ready"

Default Value:not-loaded

updateBasemapsCallback

Property
updateBasemapsCallback UpdateBasemapsCallback
Since: ArcGIS Maps SDK for JavaScript 4.8 PortalBasemapsSource since 4.3, updateBasemapsCallback added at 4.8.

Callback for updating basemaps after being fetched and filtered. This can be useful if you want to add a custom basemap after fetching the portal basemaps.

Method Overview

Show inherited methods Hide inherited methods
Name Return Type Summary Class

Adds one or more handles which are to be tied to the lifecycle of the object.

Accessor
Boolean

Returns true if a named group of handles exist.

Accessor
Promise

Refreshes basemaps by fetching them from the Portal.

PortalBasemapsSource

Removes a group of handles owned by the object.

Accessor

Method Details

addHandles

Inherited
Method
addHandles(handleOrHandles, groupKey)
Inherited from Accessor
Since: ArcGIS Maps SDK for JavaScript 4.25 Accessor since 4.0, addHandles added at 4.25.

Adds one or more handles which are to be tied to the lifecycle of the object. The handles will be removed when the object is destroyed.

// Manually manage handles
const handle = reactiveUtils.when(
  () => !view.updating,
  () => {
    wkidSelect.disabled = false;
  },
  { once: true }
);

this.addHandles(handle);

// Destroy the object
this.destroy();
Parameters
handleOrHandles WatchHandle|WatchHandle[]

Handles marked for removal once the object is destroyed.

groupKey *
optional

Key identifying the group to which the handles should be added. All the handles in the group can later be removed with Accessor.removeHandles(). If no key is provided the handles are added to a default group.

hasHandles

Inherited
Method
hasHandles(groupKey){Boolean}
Inherited from Accessor
Since: ArcGIS Maps SDK for JavaScript 4.25 Accessor since 4.0, hasHandles added at 4.25.

Returns true if a named group of handles exist.

Parameter
groupKey *
optional

A group key.

Returns
Type Description
Boolean Returns true if a named group of handles exist.
Example
// Remove a named group of handles if they exist.
if (obj.hasHandles("watch-view-updates")) {
  obj.removeHandles("watch-view-updates");
}

refresh

Method
refresh(){Promise}

Refreshes basemaps by fetching them from the Portal.

Returns
Type Description
Promise A promise that resolves when the basemaps have been fetched.

removeHandles

Inherited
Method
removeHandles(groupKey)
Inherited from Accessor
Since: ArcGIS Maps SDK for JavaScript 4.25 Accessor since 4.0, removeHandles added at 4.25.

Removes a group of handles owned by the object.

Parameter
groupKey *
optional

A group key or an array or collection of group keys to remove.

Example
obj.removeHandles(); // removes handles from default group

obj.removeHandles("handle-group");
obj.removeHandles("other-handle-group");

Type Definitions

BasemapFilter

Type Definition
BasemapFilter(item, index, array){Boolean|Promise<boolean>}

This function is used by the filterFunction property to filter basemaps after they are fetched from the Portal.

Support for asynchronous filter functions was added at version 4.27.

Parameters
item Basemap

The current Basemap item being assessed in the array.

index Number

The index of the Basemap being assessed.

array Basemap[]

The array of basemaps being filtered.

Returns
Type Description
Boolean | Promise<boolean>
  • Returns true if the test passes, false otherwise.

UpdateBasemapsCallback

Type Definition
UpdateBasemapsCallback(items){Basemap[]|Promise<Basemap[]>}

This function is used by the updateBasemapsCallback property for updating basemaps after being fetched and filtered.

Support for asynchronous update functions was added at version 4.29.

Parameter
items Basemap[]

An array of basemaps that have been fetched and filtered from the Portal.

Returns
Type Description
Basemap[] | Promise<Basemap[]> The array of basemaps to display in the BasemapGallery widget.
Examples
// Create custom basemap to be added to the array of portal basemaps
const basemapGallery = new BasemapGallery({
   view: view,
   source: {
     query: {
       title: "United States Basemaps",
       owner: "Esri_cy_US"
     },
     updateBasemapsCallback: (items) => {
       // create custom basemap to be added to the array of portal basemaps
       let bm = new Basemap({
         portalItem: {
           id: "8dda0e7b5e2d4fafa80132d59122268c"  // WGS84 Streets Vector webmap
         }
       });
       // add basemap to the array
       items.push(bm);
       // return the array of basemaps
       return items;
     }
   }
});
// Add current basemap if not already present
const currentBasemap = map.basemap;
const basemapGallery = new BasemapGallery({
  view,
  source: {
    portal: "https://arcgis.com",
    async updateBasemapsCallback(items) {
      for (const item of items) {
        // load basemap for proper comparison
        await item.load();
        if (basemapGallery.viewModel.basemapEquals(currentBasemap, item))
          return items;
      }
      // add the current basemap if not found in the array of basemap items
      return [currentBasemap, ...items];
    }
  }
});

Your browser is no longer supported. Please upgrade your browser for the best experience. See our browser deprecation post for more details.