ScrollSettings API in JavaScript Diagram API control

Diagram ScrollSettings module handles the scroller properties of the diagram

Properties

autoScrollBorder

MarginModel

Defines the maximum distance to be left between the object and the scroll bar to trigger auto scrolling

Defaults to { left: 15, right: 15, top: 15, bottom: 15 }

autoScrollFrequency

number

Specifies the interval (in milliseconds) between scroll triggers.

Defaults to 100

canAutoScroll

boolean

Enables or Disables the auto scroll option

Defaults to false

currentZoom

number

Defines the currentZoom value of diagram

Defaults to 1

horizontalOffset

number

Defines horizontal offset of the scroller

Defaults to 0

maxZoom

number

Defines the maximum zoom value of the scroller

Defaults to 30

minZoom

number

Defines the minimum zoom value of the diagram

Defaults to 0.2

padding

MarginModel

Defines the maximum distance to be left between the object and the edge of the page.

Defaults to { left: 0, right: 0, top: 0, bottom: 0 }

scrollLimit

ScrollLimit

Defines the scrollable region of diagram.

• Diagram - Enables scrolling to view the diagram content

• Infinity - Diagram will be extended, when we try to scroll the diagram

  <div id='diagram'></div>

  let diagram: Diagram = new Diagram({
  ...
  scrollSettings: { canAutoScroll: true, scrollLimit: 'Infinity',
     scrollableArea : new Rect(0, 0, 300, 300), horizontalOffset : 0
                  },
  ...
  });
  diagram.appendTo('#diagram');

Defaults to ‘Diagram’

scrollableArea

Rect

Defines the scrollable area of diagram. Applicable, if the scroll limit is “limited”.

Defaults to undefined

verticalOffset

number

Defines vertical offset of the scroller

Defaults to 0

viewPortHeight

number

Allows to read the viewport height of the diagram

Defaults to 0

viewPortWidth

number

Allows to read the viewport width of the diagram

Defaults to 0

zoomFactor

number

Specifies the percentage of scale value for each ZoomIn or ZoomOut functionality.

Defaults to 0.2