import WebLinkChart from "@arcgis/core/WebLinkChart.js";const WebLinkChart = await $arcgis.import("@arcgis/core/WebLinkChart.js");- Inheritance:
- WebLinkChart→
WebDocument2D→ Map→ Accessor
- Since
- ArcGIS Maps SDK for JavaScript 4.31
The WebLinkChart class contains properties and methods for storing, managing, and overlaying layers in a link chart. Layers can be added and removed from the link chart, but are rendered via a LinkChartView. Thus a WebLinkChart instance is a container that holds the LinkChartLayer, while the LinkChartView is the means of displaying it.
A WebLinkChart also loads a WebLinkChart from an ArcGIS Enterprise portal into a LinkChartView. To load a WebLinkChart from an ArcGIS Enterprise portal into a LinkChartView, you must reference the ID of the WebLinkChart in the portalItem property of this class.
// Load the WebLinkChart and LinkChartView modulesconst [LinkChart, LinkChartView, LinkChartLayer] = await $arcgis.import([ "@arcgis/core/WebLinkChart".js, "@arcgis/core/views/LinkChartView.js", "@arcgis/core/layers/LinkChartLayer.js"]);// Create a WebLinkChart instanceconst myLinkChart = new WebLinkChart({ portalItem: { // autocasts as new PortalItem() id: "e691172598f04ea8881cd2a4adaa45ba" }});// Create a LinkChartView instance and reference the WebLinkChart instanceconst view = new LinkChartView({ map: myLinkChart, container: 'viewDiv'});A LinkChartLayer can also be created from a knowledgeGraphService and added to a WebLinkChart. The entire graph can be added to the link chart or a subset of the records in the graph can be included in the layer by specifying the LinkChartLayer.initializationInclusionModeDefinition.
//create a link chart layer from a knowledge graph service with an inclusion definition// constructing an inclusion list:// The exact record ids of each of the records of a specific named type (entity type or relationship type)// to include in the layer. In this case the layer will contain one recordconst layerInclusionMemberDefinition = new Map();layerInclusionMemberDefinition.set("{1A4W8G4-W52G-W89G-1W5G-J1R4S8H52H4S}",{id:"{1A4W8G4-W52G-W89G-1W5G-J1R4S8H52H4S}"})
//The layerInclusionDefinition specifies whether to use all of the data in a named type or only the records// specified in the 'members' list. In this case we only want the records specified.const layerInclusionDefinition = { useAllData: false, //only include instances in the member list members: layerInclusionMemberDefinition};
// The namedTypeDefinition is a map of the typeName of each type to be included.// In this case we are only including the "Observation" entity type.// The layerInclusionDefinition specifies exactly which "Observation" entities to include in the layer.const namedTypeDefinition = new Map();namedTypeDefinition.set("Observation", layerInclusionDefinition);
// Specify if a sublayer should be generated for all named types.// If true, a sublayer will be created for all named types regardless of// whether they have a list of instances to include or not.// If there are no instances the sublayer will be empty. In this case we have set 'generateAllSubLayers' to false so the// layer will only contain sublayers for the named types (entity types or relationship types) that are specified// in the namedTypeDefinitions.// Also defines the collection of named types to include in the layer.const inclusionListDefinition = { generateAllSublayers: false, //only create sublayers for the named types in the namedTypeDefinition namedTypeDefinitions: namedTypeDefinition}
//create the link chart layer with the inclusion definintionconst myLinkChartLayer = new LinkChartLayer({ title: "link chart layer", url: "https://sampleserver7.arcgisonline.com/arcgis/rest/services/Hosted/SmallBumbleBees/KnowledgeGraphServer", initializationInclusionModeDefinition: inclusionListDefinition });//add the layer to a new link chart myLinkChartLayer.load().then(()=>{ const myLinkChart = new WebLinkChart({ layers: [myLinkChartLayer] }); // Create a LinkChartView instance and reference the WebLinkChart instance const view = new LinkChartView({ map: myLinkChart, container: 'viewDiv' }); })- See also
Constructors
Constructor
Parameters
| Parameter | Type | Description | Required |
|---|---|---|---|
| properties | | |
Example
// Typical usageconst map = new Map({ basemap: "topo-vector"});Properties
| Property | Type | Class |
|---|---|---|
activeLinkChartLayer readonly | | |
allLayers readonly inherited | ||
allTables readonly inherited | ||
applicationProperties inherited | ||
authoringApp inherited | ||
authoringAppVersion inherited | ||
basemap inherited | ||
bookmarks inherited | ||
declaredClass readonly inherited | ||
diagramNodesExtent readonly | | |
editableLayers readonly inherited | ||
entityCount readonly | | |
floorInfo inherited | ||
focusAreas inherited | ||
ground inherited | ||
initialViewProperties inherited | ||
knowledgeGraph readonly | | |
layers inherited | ||
| | ||
loaded readonly inherited | ||
loadError readonly inherited | ||
loadStatus readonly inherited | "not-loaded" | "loading" | "failed" | "loaded" | |
loadWarnings readonly inherited | any[] | |
mapType readonly | "webLinkChart" | |
portalItem inherited | PortalItem | null | undefined | |
relationshipCount readonly | | |
tables inherited | ||
thumbnailUrl inherited | ||
widgets inherited |
activeLinkChartLayer
- Type
- LinkChartLayer | null | undefined
The active link chart layer.
allLayers
- Type
- ReadonlyCollection<Layer>
A flattened collection of all layers in the map. This collection contains basemap layers, operational layers and ground layers. Group Layers and their children layers are also part of this collection. Reference layers in the basemap will always be included at the end of the collection.
Layers should not be added directly to this collection. They must only be added via the layers, basemap or ground properties.
To access a flattened collection of tables, use the allTables property instead.
Example
// Find a layer with title "US Counties"const foundLayer = map.allLayers.find(function(layer) { return layer.title === "US Counties";});
// Create a filtered collection of the non-group layersconst nonGroupLayers = map.allLayers.filter(function(layer) { return !foundLayer.layers;});
// Listen for any layer being added or removed in the Mapmap.allLayers.on("change", function(event) { console.log("Layer added: ", event.added); console.log("Layer removed: ", event.removed); console.log("Layer moved: ", event.moved);});
// Watching for changes to the visible layers in the MapreactiveUtils.watch( () => view.map.allLayers.filter((layer) => layer.visible), (newVisibleLayers, oldVisibleLayers) => { const added = newVisibleLayers.filter( (layer) => !oldVisibleLayers.includes(layer) ); const removed = oldVisibleLayers.filter( (layer) => !newVisibleLayers.includes(layer) ); added.forEach((layer) => console.log(layer.title, "is visible")); removed.forEach((layer) => console.log(layer.title, "is not visible")); }); allTables
- Type
- ReadonlyCollection<Layer>
A flattened collection of tables anywhere in the map's hierarchy. This will contain
individual tables within the map's tables, in addition to any
group layer tables. In order for the
table(s) to be recognized as such, the FeatureLayer.isTable property
must return true.
Currently, only feature layer tables are recognized. To access spatial layers, use the allLayers property instead.
Example
// A feature layer where isTable = true.const foundTable = map.allTables.find(function(table) { // Find a table with title "US Counties" return table.title === "US Counties";}); applicationProperties
- Type
- ApplicationProperties | null | undefined
The applicationProperties contains the viewing properties of the WebMap.
authoringApp
The name of the application that authored the WebMap.
authoringAppVersion
The version of the application that authored the WebMap.
basemap
Specifies a basemap for the map. The basemap is a set of layers that give geographic context to the MapView or SceneView and the other operational layers in the map.
The basemap can be created in a variety of ways:
- From the basemap styles service (v2)
- From an instance of the Basemap class
- From a basemap id
Use of these basemaps requires either an ArcGIS Location Platform account, ArcGIS Online organizational subscription, or an ArcGIS Enterprise license.
To authenticate basemap requests, you may need an access token. You can use an API key or OAuth 2.0. When using an API key, the key must have privileges to access the appropriate location service.
Basemap Id
3D
Since version 4.28
The 3D Basemaps can be accessed using the basemap id in the table below. They are designed to be used as basemaps in SceneView.
| Value | Source |
|---|---|
topo-3d | Topographic |
navigation-3d | Navigation |
navigation-dark-3d | Navigation (Dark) |
osm-3d | OpenStreetMap |
gray-3d | Light Gray Canvas |
dark-gray-3d | Dark Gray Canvas |
streets-3d | Streets |
streets-dark-3d | Streets (Dark) |
Known Limitations
3D Basemaps can only be used in SceneView.
2D (legacy)
Since version 4.0
The legacy basemaps can be accessed using the basemap id in the table below. These are references to enhanced basemap endpoints.
Read More
| Value | Source |
|---|---|
satellite | World Imagery |
hybrid | Hybrid Reference Layer and World Imagery |
oceans | World Ocean Reference and World Ocean Base |
osm | OpenStreetMapLayer |
terrain | World Reference Overlay and World Hillshade |
dark-gray / dark-gray-vector | Dark Gray Canvas |
gray / gray-vector | Light Gray Canvas |
streets / streets-vector | World Street Map |
streets-night-vector | World Street Map (Night) |
streets-navigation-vector | World Navigation Map |
topo / topo-vector | World Hillshade and World Topographic Map |
streets-relief-vector | World Hillshade and World Street Map (with Relief) |
Examples
// create the basemap from a string id representing the basemap styleconst map = new Map({ basemap: "arcgis/topographic"});
// create the basemap from a BasemapStyle objectconst map = new Map({ basemap: { style: { id: "arcgis/outdoor", language: "es" // place labels will be displayed in spanish } }});// Set the basemap from a string ID in the constructorconst map = new Map({ basemap: "dark-gray-3d"});
// Set the basemap after the map instance is createdmap.basemap = "topo-3d";// Create a VectorTileLayer from a style URLconst mapBaseLayer = new VectorTileLayer({ url: "https://arcgis.com/sharing/rest/content/items/b5676525747f499687f12746441101ef/resources/styles/root.json"});
// Create a Basemap with the VectorTileLayerconst customBasemap = new Basemap({ baseLayers: [mapBaseLayer], title: "Terrain"});
// Set the basemap to the customBasemapconst map = new Map({ basemap: customBasemap}); bookmarks
- Type
- Collection<Bookmark>
An array of saved geographic extents that allow end users to quickly navigate to a particular area of interest.
editableLayers
A collection of editable layers. Layers are considered editable if they have editing capabilities, and if the authenticated user has the necessary privileges needed to edit the layers.
entityCount
- Type
- number
- Since
- ArcGIS Maps SDK for JavaScript 4.32
The number of entities in the link chart.
floorInfo
- Type
- MapFloorInfo | null | undefined
When a web map is configured as floor-aware, it has a floorInfo property defined. A floor-aware map is a map that contains indoor GIS data representing floor plan features. The floor info must contain MapFloorInfo.levelLayer and MapFloorInfo.facilityLayer properties at a minimum. The MapFloorInfo.siteLayer property is optional.
focusAreas
- Type
- FocusAreas
A container of all focus areas present in the map.
Known Limitations
Focus areas are only supported in SceneView.
- See also
ground
- Type
- Ground
Specifies the surface properties for the map. In MapView, this property is used by the ElevationProfileAnalysis when the profile contains an ElevationProfileLineGround. In 3D SceneView, it renders the terrain or topographical variations in the real world on the map's surface with a collection of ElevationLayers.
This value can be an instance of Ground, or one of the following strings:
world-elevationfor a default instance of ground using the Terrain3D Service.world-topobathymetryfor an instance of ground that combines surface elevation and bathymetry using the TopoBathy3D Service.
The ground may not be set to null or undefined, it is guaranteed to always
contain an instance of type Ground. The elevation can be removed from the ground
by setting the ground property to a new empty Ground instance or by removing all
the ground layers.
- See also
Examples
// Use the world elevation serviceconst map = new Map({ basemap: "topo-vector", ground: "world-elevation"});// Create a map with the world elevation layer overlaid by a custom elevation layerconst worldElevation = new ElevationLayer({ url: "//elevation3d.arcgis.com/arcgis/rest/services/WorldElevation3D/Terrain3D/ImageServer"});const customElevation = new ElevationLayer({ url: "https://my.server.com/arcgis/rest/service/MyElevationService/ImageServer"});const map = new Map({ basemap: "topo-vector", ground: new Ground({ layers: [ worldElevation, customElevation ] })}); initialViewProperties
The initial view of the WebMap. This object contains properties such as InitialViewProperties.viewpoint, InitialViewProperties.spatialReference, that will be applied to the view when the WebMap loads.
knowledgeGraph
- Type
- KnowledgeGraph
- Since
- ArcGIS Maps SDK for JavaScript 4.32
The knowledge graph service containing the data displayed in the link chart.
layers
- Type
- Collection<Layer>
A collection of operational layers. This property contains the operational layers, such as FeatureLayers, WebTileLayers and GraphicsLayers that may be queried, assigned different renderers, analyzed, etc. It does not include basemaps.
A Layer is a collection of one or more features, or graphics, that represent real-world phenomena. Each feature contains a Symbol and geographic data that allows it to be rendered on the map as a graphic with spatial context. Features within the layer may also contain data attributes that provide additional information that may be viewed in popup windows and used for rendering the layer.
Layers may be added in the constructor, with the add() or addMany() methods, or directly to the layers collection using Collection.add() or Collection.addMany().
In 3D, for layers that are rendered on the terrain, the order of the layers also depends on the
type of layer. Tiled layers (BaseTileLayer, ImageryTileLayer,
OpenStreetMapLayer, TileLayer, VectorTileLayer, WCSLayer,
WebTileLayer and WMTSLayer) are always drawn first in the same order as specified in the layer collection.
Dynamic layers (MapImageLayer, ImageryLayer, WMSLayer, and
feature based layers with elevation mode on-the-ground) are rendered
on top using the order from the layer collection.
A Layer may only be added to one parent. Adding the same layer to multiple Maps or GroupLayers is not possible. If you attempt to do so, the layer will automatically be removed from its current parent and placed in the new parent.
let layer = new GraphicsLayer();// The layer belongs to map1map1.layers.add(layer);// The layer now belongs to map2// and implicitly does: map1.layers.remove(layer)map2.layers.add(layer);To access tables from feature layers, use
the tables property in either Map.tables or WebMap.tables classes.
Example
// Add layers in the constructor of Map using an arraylet fl = new FeatureLayer(url);let gl = new GraphicsLayer();let map = new Map({ layers: [fl, gl]});
// Add layers using add()map.addMany([fl, gl]);
// Add layers using layers collectionmap.layers.addMany([fl, gl]);
// Add layers using layers collection's push methodmap.layers.push(fl, gl); linkChartProperties
- Type
- LinkChartProperties
Properties specific to the link chart.
loaded
- Type
- boolean
Indicates whether the instance has loaded. When true,
the properties of the object can be accessed. A WebMap is considered loaded
when its layers and basemap are created, but not
yet loaded.
- Default value
- false
loadError
The Error object returned if an error occurred while loading.
loadStatus
- Type
- "not-loaded" | "loading" | "failed" | "loaded"
Represents the status of a load() operation.
| Value | Description |
|---|---|
| not-loaded | The object's resources have not loaded. |
| loading | The object's resources are currently loading. |
| loaded | The object's resources have loaded without errors. |
| failed | The object's resources failed to load. See loadError for more details. |
- Default value
- "not-loaded"
loadWarnings
- Type
- any[]
A list of warnings which occurred while loading.
portalItem
- Type
- PortalItem | null | undefined
The portal item from which the WebMap is loaded.
relationshipCount
- Type
- number
- Since
- ArcGIS Maps SDK for JavaScript 4.32
The number of relationship in the link chart.
tables
- Type
- Collection<Layer>
A collection of Layer instances that are tables
saved in a Map and/or a WebMap.
In order for the table(s) to be recognized as such, the FeatureLayer's FeatureLayer.isTable
property must return true. A table can be created via one of the options below:
- Referencing the URL to a table in a feature service.
- Create a feature layer using the Layer.fromArcGISServerUrl() method and confirm that it is a table using feature layer's FeatureLayer.isTable property. This can be either a feature service or feature collection.
- Create a feature layer using the Layer.fromPortalItem() method and confirm that it is a table using feature layer's FeatureLayer.isTable property. This can be either a feature service or feature collection.
- Create an in-memory, non-spatial, client-side feature layer.
Beginning with 4.17, it is possible to persist non-spatial, tables in a feature service to a WebMap, although in-memory (feature collection) tables are not yet supported.
Persisting tables within a GroupLayer.tables is not yet supported. If this is needed, add them to the Map.tables and/or WebMap.tables.
Currently, only feature service feature layers are recognized.
To access spatial layers, use the layers property in either Map.layers
or WebMap.layers classes
Examples
// This snippet shows how to add a table to a map's table collection.
// FeatureLayer.isTable = falseconst featureLayer = new FeatureLayer({ url: "https://sampleserver6.arcgisonline.com/arcgis/rest/services/SF311/FeatureServer/0"});// Add featureLayer to the mapmap.add(featureLayer);
// FeatureLayer.isTable = trueconst table = new FeatureLayer({ url: "https://sampleserver6.arcgisonline.com/arcgis/rest/services/SF311/FeatureServer/1"});
// In order for the table to be stored within// the map's table collection, load it and confirm it is the right type.
table.load().then(() => { // Add the table to the collection map.tables.add(table); console.log("Table is added to map's table collection");});// This snippet shows how to persist a table to an existing web map
// FeatureLayer.isTable = trueconst table = new FeatureLayer({ url: "https://services.arcgis.com/V6ZHFr6zdgNZuVG0/arcgis/rest/services/Crash_details_table/FeatureServer/0"});
// Create Webmap instanceconst webmap = new WebMap({ portalItem: { id: webmapId }});
// When web map is ready, load the table and add it to the web mapwebmap.when(() => { table.load().then(() => { console.log("Adding table"); // Add table to the webmap's table collection webmap.tables.add(table); });});
// Call updateFrom on webmap and pass in the existing viewwebmap.updateFrom(view).then(() => { // Call saveAs (or save) on the web map webmap.saveAs({ // autocasts as new PortalItem() title: "New WebMap" });});// This snippet shows how to add an in-memory table to a map
// Create the array of objects containing field infoconst fields = [{ name: "ObjectID", alias: "ObjectID", type: "oid"},{ name: "tree_type", alias: "Tree type", type: "string"},{ name: "species", alias: "Species", type: "string"}];
// Create the array of graphics holding attribute infoconst graphics = [{ attributes: { "tree_type": "deciduous", "species": "maple", "ObjectID": 2 }}, { attributes: { "tree_type": "coniferous", "species": "pine", "ObjectID": 3 }}];
// Create the feature layer (feature collection) tableconst table = new FeatureLayer({ fields: fields, objectIdField: "ObjectID", source: graphics});
// Check when map is ready and load the tablemap.when(() => { table.load().then(() => { console.log("Adding table"); map.tables.add(table); });}); thumbnailUrl
The URL to the thumbnail used for the webmap. The thumbnailUrl will default to
the thumbnail URL from the portal item associated to the webmap. The thumbnail
of the webmap may be updated by changing the thumbnail URL and saving the
webmap. Use updateFrom() to update the thumbnail automatically from a specified
view.
Example
webmap.updateFrom(view) .then(function() { return webmap.save(); }) // thumbnail will be updated based on current extent of webmap .then(function(portalItem) { console.log("Saved to portal", portalItem.id); }) .catch(function(error) { console.error("Error saving to portal", error); }); widgets
The widgets object contains widgets that are exposed to the user.
Methods
| Method | Signature | Class |
|---|---|---|
fromCypherQuery static | fromCypherQuery(kg: KnowledgeGraph, queryArguments: GraphQueryStreaming, initializationLinkChartConfig?: InitializationLinkChartConfig, requestOptions?: RequestOptions): Promise<WebLinkChart> | |
fromIdTypePairs static | fromIdTypePairs(kg: KnowledgeGraph, idTypePairs: IdTypePair[], initializationLinkChartConfig?: InitializationLinkChartConfig, requestOptions?: RequestOptions): WebLinkChart | |
add inherited | add(layer: Layer | PromiseLike<Layer>, index?: number): void | |
addMany inherited | addMany(layers: Layer[], index?: number): void | |
addRecords(records: IdTypePair[], options?: WebLinkChartAddRecordsOptions): Promise<void> | | |
applyLayout(layoutMode?: LayoutMode, options?: WebLinkChartApplyLayoutOptions): Promise<void> | | |
cancelLoad inherited | cancelLoad(): this | |
changeNonspatialDataDisplay(mode: "hidden" | "visible"): void | | |
connectBetweenEntities(entityIds: string[], options?: AbortOptions): Promise<IdTypePair[]> | | |
connectFromEntities(entityIds: string[], options?: AbortOptions): Promise<IdTypePair[]> | | |
createSublayerForNamedType(typeName: string): Promise<KnowledgeGraphSublayer> | | |
destroy inherited | destroy(): void | |
emit inherited | emit<Type extends EventNames<this>>(type: Type, event?: this["@eventTypes"][Type]): boolean | |
expand(nodeIds: string[], options?: WebLinkChartExpandOptions): Promise<IdTypePair[]> | | |
findLayerById inherited | findLayerById(layerId: string): Layer | null | undefined | |
findTableById inherited | findTableById(tableId: string): Layer | null | undefined | |
getMemberIdsByType(typeName: string): string[] | | |
hasEventListener inherited | hasEventListener<Type extends EventNames<this>>(type: Type): boolean | |
isFulfilled inherited | isFulfilled(): boolean | |
isRejected inherited | isRejected(): boolean | |
isResolved inherited | isResolved(): boolean | |
load inherited | load(options?: AbortOptions | null | undefined): Promise<this> | |
loadAll inherited | loadAll(): Promise<this> | |
on inherited | on<Type extends EventNames<this>>(type: Type, listener: EventedCallback<this["@eventTypes"][Type]>): ResourceHandle | |
refreshLinkChartData(ids?: string[]): Promise<void> | | |
remove inherited | remove(layer: Layer): Layer | null | undefined | |
removeAll inherited | removeAll(): Layer[] | |
removeMany inherited | removeMany(layers: Layer[]): Layer[] | |
removeRecords(records: IdTypePair[]): Promise<IdTypePair[]> | | |
reorder inherited | reorder(layer: Layer, index?: number): Layer | null | undefined | |
save inherited | save(options?: SaveOptions): Promise<PortalItem> | |
saveAs inherited | saveAs(portalItem: PortalItemProperties, options?: SaveAsOptions): Promise<PortalItem> | |
updateFrom inherited | updateFrom(view: MapView, options?: UpdateFromOptions): Promise<void> | |
when inherited | when<TResult1 = this, TResult2 = never>(onFulfilled?: OnFulfilledCallback<this, TResult1> | null | undefined, onRejected?: OnRejectedCallback<TResult2> | null | undefined): Promise<TResult1 | TResult2> |
fromCypherQuery
- Signature
-
fromCypherQuery (kg: KnowledgeGraph, queryArguments: GraphQueryStreaming, initializationLinkChartConfig?: InitializationLinkChartConfig, requestOptions?: RequestOptions): Promise<WebLinkChart>
Creates a WebLinkChart from a Cypher query against a knowledge graph service.
Parameters
| Parameter | Type | Description | Required |
|---|---|---|---|
| kg | The knowledge graph service to query. | | |
| queryArguments | The cypher query and parameters to execute against the knowledge graph service. | | |
| initializationLinkChartConfig | Configuration options for initializing the link chart layer. | | |
| requestOptions | Additional options for the request. | |
- Returns
- Promise<WebLinkChart>
A promise that resolves to the created WebLinkChart.
fromIdTypePairs
- Signature
-
fromIdTypePairs (kg: KnowledgeGraph, idTypePairs: IdTypePair[], initializationLinkChartConfig?: InitializationLinkChartConfig, requestOptions?: RequestOptions): WebLinkChart
Creates a WebLinkChart from an array of id-type pairs against a knowledge graph service.
Parameters
| Parameter | Type | Description | Required |
|---|---|---|---|
| kg | The knowledge graph service to query. | | |
| idTypePairs | An array of objects with an id and named type for each record to include in the link chart. | | |
| initializationLinkChartConfig | Configuration options for initializing the link chart layer. | | |
| requestOptions | Additional options for the request. | |
- Returns
- WebLinkChart
A promise that resolves to the created WebLinkChart.
add
- Signature
-
add (layer: Layer | PromiseLike<Layer>, index?: number): void
Adds a layer to the layers collection. The Collection.@before-changes, Collection.@before-add, Collection.@after-add, Collection.@after-changes and Collection.@change events will be emitted when this method is called.
- See also
Parameters
| Parameter | Type | Description | Required |
|---|---|---|---|
| layer | Layer or a promise that resolves to a layer to add to the layers collection. | | |
| index | A layer can be added at a specified index in the layers collection. If no index is specified or the index specified is greater than the current number of layers, the layer is automatically appended to the list of layers in the layers collection and the index is normalized. | |
- Returns
- void
Example
// add() and push methods can be used// to add a layer to layers collection
// add a layer to layers collection using addmap.add(layer);
// add a layer at the end of layers collectionmap.layers.push(layer); addMany
- Signature
-
addMany (layers: Layer[], index?: number): void
Adds a layer or an array of layers to the layers collection. The Collection.@before-changes, Collection.@before-add, Collection.@after-add, Collection.@after-changes and Collection.@change events will be emitted when this method is called.
The Collection.push() method on the layers collection also can be used to add a layer or layers.
- See also
Parameters
| Parameter | Type | Description | Required |
|---|---|---|---|
| layers | Layer[] | Layer(s) to be added to the layers collection. | |
| index | A layer can be added at a specified index in the layers collection. If no index is specified or the index specified is greater than the current number of layers, the layer is automatically appended to the list of layers in the layers collection and the index is normalized. | |
- Returns
- void
Example
// addMany and push methods can be used// to add layers to layers collection
// add an array of layers to layers collection using addManymap.addMany([layer, layer2]);
// add layers to layers collection using push methodmap.layers.push(layer, layer2); addRecords
- Signature
-
addRecords (records: IdTypePair[], options?: WebLinkChartAddRecordsOptions): Promise<void>
- Since
- ArcGIS Maps SDK for JavaScript 4.32
Adds records to the link chart layer, given an array of paired ids and named types for each record to add.
Parameters
| Parameter | Type | Description | Required |
|---|---|---|---|
| records | An array of objects with an id and named type to be added to the link chart. | | |
| options | Additional options that can be set when adding records. | |
Example
const newRecords = [{ id: "{A0F6BF5F-6CA8-49CB-B47E-165CEC47CA4E}", typeName: "Observation" }]webLinkChart.addRecords(newRecords) applyLayout
- Signature
-
applyLayout (layoutMode?: LayoutMode, options?: WebLinkChartApplyLayoutOptions): Promise<void>
- Since
- ArcGIS Maps SDK for JavaScript 4.32
Change the layout applied to the link chart. Link chart layouts fall into different categories depending on how they organize entities and relationships in the link chart.
See layout types for a description of the different layout algorithms.
Parameters
| Parameter | Type | Description | Required |
|---|---|---|---|
| layoutMode | The layout applied to the link chart. | | |
| options | Additional options for refining how the layout is calculated and applied to the link chart. | |
cancelLoad
- Signature
-
cancelLoad (): this
Cancels a load() operation if it is already in progress.
- Returns
- this
changeNonspatialDataDisplay
- Signature
-
changeNonspatialDataDisplay (mode: "hidden" | "visible"): void
- Since
- ArcGIS Maps SDK for JavaScript 4.32
Indicates whether the nonspatial data on the link chart is visible. Link charts can contain both spatial and nonspatial records. Spatial records are entities with geometry and relationships that connect two spatial entities (both the relationship origin and destination entities have geometry). Nonspatial records are entities without geometry (even if they are a member of a spatially enabled entity type) and relationships that have at least one endpoint with no geometry.
Parameters
| Parameter | Type | Description | Required |
|---|---|---|---|
| mode | "hidden" | "visible" | A map with a key of the named Type and the list of Identifiers to be added. Default: "visible" | |
- Returns
- void
connectBetweenEntities
- Signature
-
connectBetweenEntities (entityIds: string[], options?: AbortOptions): Promise<IdTypePair[]>
- Since
- ArcGIS Maps SDK for JavaScript 4.32
Connect between entities adds any existing direct relationships between the selected entities.
Parameters
| Parameter | Type | Description | Required |
|---|---|---|---|
| entityIds | string[] | List of entity ids on the link chart to find direct relationships between. | |
| options | Additional options for the connect request. | |
- Returns
- Promise<IdTypePair[]>
An array of objects representing the relationships added to connect the entities
connectFromEntities
- Signature
-
connectFromEntities (entityIds: string[], options?: AbortOptions): Promise<IdTypePair[]>
- Since
- ArcGIS Maps SDK for JavaScript 4.32
Connect from entities adds any existing direct relationships between the specified entities and any other entities in the link chart.
Parameters
| Parameter | Type | Description | Required |
|---|---|---|---|
| entityIds | string[] | List of entity ids on the link chart to find direct relationships to any other entities on the link chart. | |
| options | Additional options for the connect request. | |
- Returns
- Promise<IdTypePair[]>
An array of objects representing the relationships added to connect the entities
createSublayerForNamedType
- Signature
-
createSublayerForNamedType (typeName: string): Promise<KnowledgeGraphSublayer>
Parameters
| Parameter | Type | Description | Required |
|---|---|---|---|
| typeName | The name of the named type to create a sublayer for | |
- Returns
- Promise<KnowledgeGraphSublayer>
Resolves when the sublayer is created and added to the layer.
destroy
- Signature
-
destroy (): void
Destroys the webmap, and any associated resources, including its layers, basemap,
ground, tables, and portalItem.
These can no longer be used once the map has been destroyed. To prevent these objects from being destroyed,
remove them from the webmap before calling destroy().
// prevent the layers from being destroyed by removing them from the webmapconst layers = webmap.layers.removeAll();
// prevent the tables from being destroyed by removing them from the webmapconst tables = webmap.tables.removeAll();
// unset basemap from the webmap so that it is not destroyedconst basemap = webmap.basemap;webmap.basemap = null;
// unset portalItem from the webmap so that it is not destroyedconst portalItem = webmap.portalItem;webmap.portalItem = null;
// prevent the utility networks from being destroyed by removing them from the webmapconst networks = webmap.utilityNetworks.removeAll();
// destroy the webmap and any remaining associated resourceswebmap.destroy();- Returns
- void
emit
- Signature
-
emit <Type extends EventNames<this>>(type: Type, event?: this["@eventTypes"][Type]): boolean
- Type parameters
- <Type extends EventNames<this>>
Emits an event on the instance. This method should only be used when creating subclasses of this class.
expand
- Signature
-
expand (nodeIds: string[], options?: WebLinkChartExpandOptions): Promise<IdTypePair[]>
- Since
- ArcGIS Maps SDK for JavaScript 4.32
Given a list of entity IDs to expand from, will attempt to retrieve all one-hop connected entities and the connecting relationships. If relationship named types are given, the expand will only look for entities connected by the specified relationship types. Note: the starting nodes must already exist in the link chart layer.
Parameters
| Parameter | Type | Description | Required |
|---|---|---|---|
| nodeIds | string[] | Array of entity IDs to expand from. | |
| options | Additional options for the expand request. | |
- Returns
- Promise<IdTypePair[]>
Resolves to an object with a records property containing ids and named types for each connected relationship/entity
findLayerById
- Signature
-
findLayerById (layerId: string): Layer | null | undefined
Returns a layer based on the given layer ID.
findTableById
- Signature
-
findTableById (tableId: string): Layer | null | undefined
Returns a table based on the given table ID.
hasEventListener
- Signature
-
hasEventListener <Type extends EventNames<this>>(type: Type): boolean
- Type parameters
- <Type extends EventNames<this>>
Indicates whether there is an event listener on the instance that matches the provided event name.
Parameters
| Parameter | Type | Description | Required |
|---|---|---|---|
| type | Type | The name of the event. | |
- Returns
- boolean
Returns true if the class supports the input event.
isFulfilled
- Signature
-
isFulfilled (): boolean
isFulfilled() may be used to verify if creating an instance of the class is fulfilled (either resolved or rejected).
If it is fulfilled, true will be returned.
- Returns
- boolean
Indicates whether creating an instance of the class has been fulfilled (either resolved or rejected).
isRejected
- Signature
-
isRejected (): boolean
isRejected() may be used to verify if creating an instance of the class is rejected.
If it is rejected, true will be returned.
- Returns
- boolean
Indicates whether creating an instance of the class has been rejected.
isResolved
- Signature
-
isResolved (): boolean
isResolved() may be used to verify if creating an instance of the class is resolved.
If it is resolved, true will be returned.
- Returns
- boolean
Indicates whether creating an instance of the class has been resolved.
load
- Signature
-
load (options?: AbortOptions | null | undefined): Promise<this>
Triggers the loading of the WebMap instance.
A WebMap is considered loaded when its operational layers
and basemap are fully created.
When created with a portalItem, load() will first
fetch its data to create the content, otherwise it resolves immediately.
The MapView automatically calls the load() method
when a WebMap instance is added to its MapView.map property
so it can display in the view and load each individual layer.
If the WebMap is used outside of a view, for example to preload it, you must call load()
explicitly to interact with its resources.
- See also
Parameters
| Parameter | Type | Description | Required |
|---|---|---|---|
| options | Additional options. | |
Example
const WebMap = await $arcgis.import("@arcgis/core/WebMap.js");
const map = new WebMap({ portalItem: { id: "e691172598f04ea8881cd2a4adaa45ba" }});
map.load() .then(function() { // load the basemap to get its layers created return map.basemap.load(); }) .then(function() { // grab all the layers and load them const allLayers = map.allLayers; const promises = allLayers.map(function(layer) { return layer.load(); }); return Promise.all(promises.toArray()); }) .then(function(layers) { // each layer load promise resolves with the layer console.log("all " + layers.length + " layers loaded"); }) .catch(function(error) { console.error(error); }); loadAll
- Signature
-
loadAll (): Promise<this>
Loads all the externally loadable resources associated with the webmap. For the webmap this will load the ground, basemap and layers.
- See also
Example
// Load all resources but ignore if one or more of them failed to loadwebmap.loadAll() .catch(function(error) { // Ignore any failed resources }) .then(function() { console.log("All loaded"); }); on
- Signature
-
on <Type extends EventNames<this>>(type: Type, listener: EventedCallback<this["@eventTypes"][Type]>): ResourceHandle
- Type parameters
- <Type extends EventNames<this>>
Registers an event handler on the instance. Call this method to hook an event with a listener.
Parameters
| Parameter | Type | Description | Required |
|---|---|---|---|
| type | Type | An event or an array of events to listen for. | |
| listener | EventedCallback<this["@eventTypes"][Type]> | The function to call when the event fires. | |
- Returns
- ResourceHandle
Returns an event handler with a
remove()method that should be called to stop listening for the event(s).Property Type Description remove Function When called, removes the listener from the event.
Example
view.on("click", function(event){ // event is the event handle returned after the event fires. console.log(event.mapPoint);}); refreshLinkChartData
- Signature
-
refreshLinkChartData (ids?: string[]): Promise<void>
- Since
- ArcGIS Maps SDK for JavaScript 4.32
Refreshes the data in the link chart. If an entity or relationship in the link chart no longer exists in the graph it will be removed. Updates any properties on the records in the link chart. Optionally specify a subset of ids to only update the data for a specific set of records.
remove
- Signature
-
remove (layer: Layer): Layer | null | undefined
Removes the specified layer from the layers collection. The Collection.@before-changes, Collection.@before-remove, Collection.@after-remove, Collection.@after-changes and Collection.@change events will be emitted when this method is called.
removeAll
- Signature
-
removeAll (): Layer[]
Removes all layers. The Collection.@before-changes, Collection.@before-remove, Collection.@after-remove, Collection.@after-changes and Collection.@change events will be emitted when this method is called.
- Returns
- Layer[]
Returns the layers removed from the layers collection.
removeMany
- Signature
-
removeMany (layers: Layer[]): Layer[]
Removes the specified layers. The Collection.@before-changes, Collection.@before-remove, Collection.@after-remove, Collection.@after-changes and Collection.@change events will be emitted when this method is called.
removeRecords
- Signature
-
removeRecords (records: IdTypePair[]): Promise<IdTypePair[]>
- Since
- ArcGIS Maps SDK for JavaScript 4.32
Removes records from the link chart layer. Does not delete them from the knowledge graph.
Parameters
| Parameter | Type | Description | Required |
|---|---|---|---|
| records | An array of objects with an id and named type to be removed from the link chart. | |
- Returns
- Promise<IdTypePair[]>
reorder
- Signature
-
reorder (layer: Layer, index?: number): Layer | null | undefined
Changes the layer order. The first layer added is always the base layer, even if its order is changed. The Collection.@change event will be emitted when this method is called.
In 3D, for layers that are rendered on the terrain, the order of the layers also depends on the
type of layer. Tiled layers (BaseTileLayer, ImageryTileLayer,
OpenStreetMapLayer, TileLayer, VectorTileLayer, WCSLayer,
WebTileLayer and WMTSLayer) are always drawn first in the same order as specified in the layer collection.
Dynamic layers (MapImageLayer, ImageryLayer, WMSLayer, and
feature based layers with elevation mode on-the-ground) are rendered
on top using the order from the layer collection.
save
- Signature
-
save (options?: SaveOptions): Promise<PortalItem>
Saves the WebMap or WebLinkChart to its associated portal item. The portal item
must already exist and be valid. This is a convenience method that will
use PortalItem.update() to store the WebMap / WebLinkChart
in the item.
Use updateFrom() to store the current view properties in the webmap before saving it.
Note that this saves the WebMap / WebLinkChart to its existing item. Depending on how
it is shared, users that do not own the WebMap / WebLinkChart may be able to modify it. To save
an existing WebMap / WebLinkChart as a new item owned by the user signed into the portal
instance, use saveAs().
The WebMap / WebLinkChart will be automatically loaded if it is not already before
saving.
Wait until each save() operation has resolved before starting a new save()
operation to avoid a potential abort-error.
Known Limitations
Feature collections and multi-layer feature collections cannot currently be saved.
- See also
Parameters
| Parameter | Type | Description | Required |
|---|---|---|---|
| options | Additional options. | |
- Returns
- Promise<PortalItem>
A promise that resolves with the PortalItem instance when the item has successfully been saved, or rejected otherwise.
Example
webmap.updateFrom(view) .then(function() { return webmap.save(); }) .then(function(portalItem) { console.log("Saved to portal", portalItem.id); }) .catch(function(error) { console.error("Error saving to portal", error); }); saveAs
- Signature
-
saveAs (portalItem: PortalItemProperties, options?: SaveAsOptions): Promise<PortalItem>
Saves the WebMap or WebLinkChart to a new portal item. If saving has completed
successfully, then the saved portal item will be set in the portalItem
property of the WebMap / WebLinkChart. This is a convenience method that will create a new
PortalItem and use
PortalUser.addItem() to store
the WebMap / WebLinkChart in a Portal.
Use updateFrom() to store the current view properties in the
WebMap / WebLinkChart before saving it.
Note that this always saves the WebMap / WebLinkChart as a new portal item owned by the user
signed into the portal instance that executes the saveAs() method. If you want to modify
an existing item without changing its ownership, use save().
The WebMap / WebLinkChart will be automatically loaded if it is not already before
saving.
Wait until each saveAs() operation has resolved before starting a new saveAs()
operation to avoid a potential abort-error.
Known Limitations
Feature collections and multi-layer feature collections cannot currently be saved.
- See also
Parameters
| Parameter | Type | Description | Required |
|---|---|---|---|
| portalItem | The new portal item to which
the Portal item properties such as the title or description
need to be explicitly set on the item and will not be automatically copied from
the current associated | | |
| options | Additional save options. | |
- Returns
- Promise<PortalItem>
A promise that resolves with the PortalItem instance when the item has successfully been saved, or rejected otherwise.
Example
const webmap = new WebMap();// Use updateFrom to store the current view properties// in the webmap before saving itwebmap.updateFrom(view);webmap.saveAs({ // autocasts as new PortalItem() title: "New WebMap"}); updateFrom
- Signature
-
updateFrom (view: MapView, options?: UpdateFromOptions): Promise<void>
Update properties of the WebMap related to the view. This should usually be called just before saving a webmap. The following properties are updated from the view:
Depending on the provided options, the following properties are also updated:
- The Viewpoint.rotation, Viewpoint.scale, and Viewpoint.targetGeometry properties of InitialViewProperties.viewpoint
- The
thumbnailof the PortalItem
Parameters
| Parameter | Type | Description | Required |
|---|---|---|---|
| view | The view to update from. | | |
| options | Update options. | |
when
- Signature
-
when <TResult1 = this, TResult2 = never>(onFulfilled?: OnFulfilledCallback<this, TResult1> | null | undefined, onRejected?: OnRejectedCallback<TResult2> | null | undefined): Promise<TResult1 | TResult2>
when() may be leveraged once an instance of the class is created. This method takes two input parameters: an onFulfilled function and an onRejected function.
The onFulfilled executes when the instance of the class loads. The
onRejected executes if the instance of the class fails to load.
Parameters
| Parameter | Type | Description | Required |
|---|---|---|---|
| onFulfilled | OnFulfilledCallback<this, TResult1> | null | undefined | The function to call when the promise resolves. | |
| onRejected | The function to execute when the promise fails. | |
- Returns
- Promise<TResult1 | TResult2>
Returns a new promise for the result of
onFulfilledthat may be used to chain additional functions.
Example
// Although this example uses MapView, any class instance that is a promise may use when() in the same waylet view = new MapView();view.when(function(){ // This function will execute once the promise is resolved}, function(error){ // This function will execute if the promise is rejected due to an error});Type definitions
WebLinkChartApplyLayoutOptions
Additional options for refining how the layout is calculated and applied to the link chart.
layoutSettings
- Type
- LayoutSettings | undefined
Additional settings for organic layouts (particularly geographic layout) and chronological layouts. If not specified, then the current layout settings will be used.
WebLinkChartAddRecordsOptions
Additional options that can be set when adding records to a link chart.
- Supertypes
- AbortOptions
WebLinkChartExpandOptions
Additional options for specifying which entities and relationships to traverse in the expand operation.
- Supertypes
- AbortOptions