Skip to content
import BookmarksViewModel from "@arcgis/core/widgets/Bookmarks/BookmarksViewModel.js";
Inheritance:
BookmarksViewModelAccessor
Since
ArcGIS Maps SDK for JavaScript 4.8

Provides the logic for the Bookmarks widget.

See also

Constructors

Constructor

Constructor
Parameters
ParameterTypeDescriptionRequired
properties
See the properties table for a list of all the properties that may be passed into the constructor.

Properties

Any properties can be set, retrieved or listened to. See the Watch for changes topic.

activeBookmark

readonly Property
Type
Bookmark | null | undefined
Since
ArcGIS Maps SDK for JavaScript 4.9

The Bookmark that is being navigated to.

bookmarks

autocast Property
Type
Collection<Bookmark>

A collection of Bookmarks.

capabilities

Property
Type
BookmarksCapabilities
Since
ArcGIS Maps SDK for JavaScript 4.27

Defines the capabilities of the widget. This property can be used to enable or disable the time capability of the Bookmarks widget.

Example
const bookmarksVM = new BookmarksViewModel({
view: view,
capabilities: {
time: false // disables all time capability in the Bookmarks widget
}
});

declaredClass

readonlyinherited Property
Type
string
Inherited from: Accessor

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

defaultCreateOptions

autocast Property
Type
BookmarkOptions
Since
ArcGIS Maps SDK for JavaScript 4.18

Specifies how new bookmarks will be created. Can be used to enable or disable taking screenshots or capturing the bookmark's viewpoint based on the current view when a bookmark is created. See BookmarkOptions for the full list of options.

defaultEditOptions

autocast Property
Type
BookmarkOptions
Since
ArcGIS Maps SDK for JavaScript 4.18

Specifies how bookmarks will be edited. Can be used to enable or disable taking screenshots or capturing the bookmark's viewpoint based on the current view when a bookmark is edited. See BookmarkOptions for the full list of options.

goToOverride

inherited Property
Type
GoToOverride | null | undefined
Inherited from: GoTo

This function provides the ability to override either the MapView goTo() or SceneView goTo() methods.

See also
Example
// The following snippet uses Search but can be applied to any
// widgets that support the goToOverride property.
search.goToOverride = function(view, goToParams) {
goToParams.options = {
duration: updatedDuration
};
return view.goTo(goToParams.target, goToParams.options);
};

state

readonly Property
Type
BookmarksViewModelState

The view model's state.

Default value
"ready"

view

Property
Type
MapViewOrSceneView | null | undefined

The view from which the widget will operate.

Methods

MethodSignatureClass
createBookmark(options?: BookmarkOptions): Promise<Bookmark>
editBookmark(bookmark: Bookmark | null | undefined, options?: BookmarkOptions): Promise<Bookmark | null | undefined>
emit
inherited
emit<Type extends EventNames<this>>(type: Type, event?: this["@eventTypes"][Type]): boolean
goTo(bookmark: Bookmark): Promise<any>
hasEventListener
inherited
hasEventListener<Type extends EventNames<this>>(type: Type): boolean
on
inherited
on<Type extends EventNames<this>>(type: Type, listener: EventedCallback<this["@eventTypes"][Type]>): ResourceHandle

createBookmark

Method
Signature
createBookmark (options?: BookmarkOptions): Promise<Bookmark>
Since
ArcGIS Maps SDK for JavaScript 4.13

Creates a new bookmark from the defaultCreateOptions, unless otherwise specified.

Parameters
ParameterTypeDescriptionRequired
options

Specifies how new bookmarks will be created. Can be used to enable/disable taking screenshots or capturing the extent when a new bookmark is added.

Returns
Promise<Bookmark>

When resolved, returns the newly created Bookmark.

Example
// Creates new bookmark from current view extent
viewModel.createBookmark().then(function(bookmark){
// Give the bookmark a name
bookmark.name = "New Bookmark";
// Add to bookmarks list
viewModel.bookmarks.add(bookmark);
});

editBookmark

Method
Signature
editBookmark (bookmark: Bookmark | null | undefined, options?: BookmarkOptions): Promise<Bookmark | null | undefined>
Since
ArcGIS Maps SDK for JavaScript 4.17

Edits the given bookmark.

Parameters
ParameterTypeDescriptionRequired
bookmark

The bookmark to be edited.

options

Specifies how bookmarks will be edited. Can be used to enable/disable taking screenshots or capturing the extent when a bookmark is edited. If not specified, the defaultEditOptions will be used.

Returns
Promise<Bookmark | null | undefined>

When resolved, returns the edited Bookmark.

Example
const options = {
takeScreenshot: false,
captureViewpoint: true
};
// update the given bookmark's viewpoint without taking a new screenshot
viewModel.editBookmark(bookmark, options).then(function(editedBookmark){
// the edited bookmark's viewpoint should now match the current view
console.log(editedBookmark.viewpoint);
console.log(view.viewpoint);
})

emit

inherited Method
Signature
emit <Type extends EventNames<this>>(type: Type, event?: this["@eventTypes"][Type]): boolean
Type parameters
<Type extends EventNames<this>>
Inherited from: EventedMixin

Emits an event on the instance. This method should only be used when creating subclasses of this class.

Parameters
ParameterTypeDescriptionRequired
type
Type

The name of the event.

event
this["@eventTypes"][Type]

The event payload.

Returns
boolean

true if a listener was notified

goTo

Method
Signature
goTo (bookmark: Bookmark): Promise<any>

Zoom to a specific bookmark.

Parameters
ParameterTypeDescriptionRequired
bookmark

The bookmark to zoom to.

Returns
Promise<any>

Resolves after the animation to specified bookmark finishes.

hasEventListener

inherited Method
Signature
hasEventListener <Type extends EventNames<this>>(type: Type): boolean
Type parameters
<Type extends EventNames<this>>
Inherited from: EventedMixin

Indicates whether there is an event listener on the instance that matches the provided event name.

Parameters
ParameterTypeDescriptionRequired
type
Type

The name of the event.

Returns
boolean

Returns true if the class supports the input event.

on

inherited Method
Signature
on <Type extends EventNames<this>>(type: Type, listener: EventedCallback<this["@eventTypes"][Type]>): ResourceHandle
Type parameters
<Type extends EventNames<this>>
Inherited from: EventedMixin

Registers an event handler on the instance. Call this method to hook an event with a listener.

Parameters
ParameterTypeDescriptionRequired
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).

PropertyTypeDescription
removeFunctionWhen 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);
});

Events

bookmark-edit

Event
Since
ArcGIS Maps SDK for JavaScript 4.17

Fires when a Bookmark is edited.

bubbles composed cancelable
Example
// once an edit has been made, enable the "Save Webmap" button
// to allow the user to save their changes
bookmarksWidget.on("bookmark-edit", function(event){
saveBtn.disabled = false;
}

bookmark-select

Event
Since
ArcGIS Maps SDK for JavaScript 4.17

Fires when a Bookmark is selected.

bubbles composed cancelable
Example
const bookmarksWidget = new Bookmarks({
view: view
});
const bookmarksExpand = new Expand({
view: view,
content: bookmarksWidget
});
view.ui.add(bookmarksExpand, "top-right");
// collapses the associated Expand instance
// when the user selects a bookmark
bookmarksWidget.on("bookmark-select", function(event){
bookmarksExpand.expanded = false;
});

Type definitions

BookmarksViewModelState

Type definition
Type
"ready" | "loading"

BookmarksViewModelBookmarkEditEvent

Type definition

bookmark

Property
Type
Bookmark

The edited bookmark.

BookmarksViewModelBookmarkSelectEvent

Type definition

bookmark

Property
Type
Bookmark

The bookmark selected by the user.