Vue Diagram - pageSize

Specifies a size of pages.

Selector: DxPageSize
Type:

Object

The units property specifies the page's measurement units.

App.vue
  • <template>
  • <DxDiagram
  • id="diagram"
  • ref="diagram"
  • units="cm"
  • >
  • <DxPageSize
  • :width="10"
  • :height="10"
  • />
  • </DxDiagram>
  • </template>
NOTE
  • If you call the import method, it applies the imported page settings and the pageSize property is ignored.

  • Page settings are stored in a diagram model. The pageSize property is not in effect if the model is read-only (the readOnly property is set to true).

height

Specifies the page height.

Type:

Number

Raised Events: onOptionChanged

items[]

An array that specifies the page size items in the Page Size combobox on Properties Panel.

Selector: DxItem
Type:

Array<Object>

App.vue
  • <template>
  • <DxDiagram
  • id="diagram"
  • ref="diagram"
  • units="cm"
  • viewUnits="cm"
  • >
  • <DxPageSize
  • :width="10"
  • :height="10"
  • :items="[{ text: 'A4 (21cm x 29.7cm)', width: 21, height: 29.7 },
  • { text: 'A3 (29.7cm x 42cm)', width: 29.7, height: 42 }]"
  • />
  • </DxDiagram>
  • </template>

Diagram control data toolbox

width

Specifies the page width.

Type:

Number

Raised Events: onOptionChanged