Vue Gantt - scaleTypeRange

Configures zoom range settings.

Selector: DxScaleTypeRange

Type:

Use the scaleTypeRange.min and scaleTypeRange.max properties to limit zoom in the Gantt chart.

App.vue


<template>
    <DxGantt ... >
        <DxScaleTypeRange
            min="days"
            max="years"
        />
        <!-- ... -->
    </DxGantt>
</template>
<script>
    import 'devextreme/dist/css/dx.light.css';
    import 'devexpress-gantt/dist/dx-gantt.css'; 
 
    import { 
        DxGantt, 
        DxScaleTypeRange, 
        // ... 
    } from 'devextreme-vue/gantt';
 
    export default {
        components: { 
            DxGantt, 
            DxScaleTypeRange, 
            // ... 
        }
    };
</script>

max

Specifies the maximum zoom level of tasks in the Gantt chart.

Type:

GanttScaleType

Default Value: 'years'

min

Specifies the minimum zoom level of tasks in the Gantt chart.

Type:

GanttScaleType

Default Value: 'minutes'

Was this topic helpful?

Thank you!

Feel free to share topic-related thoughts here.
If you have technical questions, please create a support ticket in the DevExpress Support Center.

Thank you for the feedback!

Vue Gantt - scaleTypeRange

See Also

max

min