Vue Diagram - zoomLevel

Specifies the zoom level.

Selector: DxZoomLevel
Type:

Number

|

Object

Default Value: 1

jQuery
JavaScript
$(function() {
    $("#diagram").dxDiagram({
        zoomLevel: {
            value: 0.75,
            items: [0.5, 0.75, 1, 1.5]
        },
    });
});
Angular
app.component.html
+
<dx-diagram #diagram id="diagram">
    <dxo-zoom-level 
        [value]="0.75" 
        [items]='[0.5, 0.75, 1, 1.5]'>
    </dxo-zoom-level>
</dx-diagram>
Vue
App.vue
<template>
<DxDiagram
    id="diagram"
    ref="diagram"
>
    <DxZoomLevel
    :value="0.75"
    :items="['0.5', '0.75', '1', '1.5']"
    />
</DxDiagram>
</template>
React
App.js
class App extends React.Component {
    // ...
    render() {
        return (
            <Diagram id="diagram" ref={this.diagramRef} >
                <ZoomLevel value={0.75} items={['0.5', '0.75', '1', '1.5']}/>
            </Diagram>
        );
    }
}

items

An array that specifies the zoom level items in the Zoom Level combobox on Properties panel.

Type:

Array<Number>

Default Value: undefined

value

Specifies the zoom level.

Type:

Number

Default Value: undefined
Raised Events: onOptionChanged