Class PropertiesMap

The PropertiesMap class displays a 2D or 3D map (scatter plot) of properties in the dataset, using plotly.js for rendering.

Properties can be used as x, y, or z values, as well as points color and size. Additionally, string properties can be used as symbols for the scatter plot markers.

Hierarchy

PropertiesMap

Index

Constructors

constructor

new PropertiesMap(config: { element: string | HTMLElement; settings: Settings }, indexer: EnvironmentIndexer, properties: { [name: string]: Property }): PropertiesMap
Create a new PropertiesMap inside the DOM element with the given HTML id
Parameters
- config: { element: string | HTMLElement; settings: Settings }
  - element: string | HTMLElement
  - settings: Settings
- indexer: EnvironmentIndexer
  
  EnvironmentIndexer used to translate indexes from environments index to structure/atom indexes
- properties: { [name: string]: Property }
  
  properties to be displayed
  - [name: string]: Property
Returns PropertiesMap
- Defined in map/map.ts:230

Properties

activeChanged

activeChanged: ((guid: GUID, indexes: Indexes) => void)

Type declaration

- (guid: GUID, indexes: Indexes): void
- Callback fired when the active marker is changed by clicking on the map
  Parameters
  - guid: GUID
    
    GUID of the new active marker
  - indexes: Indexes
    
    index of the environment the new active marker is showing
  Returns void

onselect

onselect: ((indexes: Indexes) => void)

Type declaration

- (indexes: Indexes): void
- Callback fired when the plot is clicked and the position of the active marker changes
  Parameters
  - indexes: Indexes
  Returns void

positionSettingsModal

positionSettingsModal: PositioningCallback

Callback to get the initial positioning of the settings modal.

The callback gets the current placement of the settings as a DOMRect, and should return top and left positions in pixels, used with position: fixed. The callback is called once, the first time the settings are opened.

Methods

addMarker

addMarker(guid: GUID, color: string, indexes: Indexes): void
Add a new marker to the map. The new marker is set as the active one
Parameters
- guid: GUID
  
  GUID of the new marker
- color: string
- indexes: Indexes
  
  indexes of the environment that the new marker should show
Returns void
- Defined in map/map.ts:379

applySettings

applySettings(settings: Settings): void
Apply saved settings to the map.
Parameters
- settings: Settings
Returns void
- Defined in map/map.ts:421

onSettingChange

onSettingChange(callback: ((keys: string[], value: unknown) => void)): void
Add the given callback to be called whenever a setting changes. The callback will be given the path to the settings as a list of keys; and the new value of the setting.

There is currently no way to remove a callback.
Parameters
- callback: ((keys: string[], value: unknown) => void)
  - - (keys: string[], value: unknown): void
    - Parameters
      
      keys: string[]
      
      value: unknown
      
      Returns void
Returns void
- Defined in map/map.ts:440

remove

remove(): void
Remove all HTML added by this PropertiesMap in the current document

Returns void
- Defined in map/map.ts:307

removeMarker

removeMarker(guid: GUID): void
Removes a marker from the map.
Parameters
- guid: GUID
  
  GUID of the marker to remove
Returns void
- Defined in map/map.ts:398

saveSettings

saveSettings(): Settings
Save the values of the current settings in a way that an be used with applySettings or saved to JSON.

Returns Settings
- Defined in map/map.ts:429

select

select(indexes: Indexes): void
Change the environment indicated by the currently active marker to the one with the given indexes
Parameters
- indexes: Indexes
Returns void
- Defined in map/map.ts:325

setActive

setActive(guid: GUID): void
Set the marker with given GUID as the active marker.
Parameters
- guid: GUID
  
  the GUID of the new active viewer
Returns void
- Defined in map/map.ts:356

Class PropertiesMap

Hierarchy

Index

Constructors

Properties

Methods

Constructors

constructor

Parameters

config: { element: string | HTMLElement; settings: Settings }

element: string | HTMLElement

settings: Settings

indexer: EnvironmentIndexer

properties: { [name: string]: Property }

[name: string]: Property

Returns PropertiesMap

Properties

activeChanged

Type declaration

Parameters

guid: GUID

indexes: Indexes

Returns void

onselect

Type declaration

Parameters

indexes: Indexes

Returns void

positionSettingsModal

Methods

addMarker

Parameters

guid: GUID

color: string

indexes: Indexes

Returns void

applySettings

Parameters

settings: Settings

Returns void

onSettingChange

Parameters

callback: ((keys: string[], value: unknown) => void)

Parameters

keys: string[]

value: unknown

Returns void

Returns void

remove

Returns void

removeMarker

Parameters

guid: GUID

Returns void

saveSettings

Returns Settings

select

Parameters

indexes: Indexes

Returns void

setActive

Parameters

guid: GUID

Returns void

Settings

Member Visibility

Theme