• What is KendoReact
  • Getting Started
  • Server Components
  • Components
    • Animation
    • Barcodes
    • Buttons
    • Chartsupdated
    • Common Utilities
    • Conversational UIupdated
    • Data Gridupdated
    • Data Query
    • Data Tools
    • Date Inputs
    • Date Math
    • Dialogs
    • Drawing
    • Dropdownsupdated
    • Editor
    • Excel Export
    • File Saver
    • Formupdated
    • Ganttupdated
    • Gauges
    • Indicators
    • Inputsupdated
    • Labels
    • Layoutupdated
    • ListBoxupdated
    • ListView
    • Map
    • Notification
    • OrgChartnew
    • PDF Processing
    • PDFViewer
    • PivotGrid
    • Popup
    • Progress Bars
    • Ripple
    • Scheduler
    • ScrollView
    • Sortable
    • Spreadsheetupdated
    • TaskBoard
    • Tooltips
    • TreeList
    • TreeViewupdated
    • Upload
  • Sample Applications
  • Styling & Themes
  • Common Features
  • Project Setup
  • Knowledge Base
  • Changelog
  • Updates
  • Troubleshooting

KendoReact ChunkProgressBar Overview

The ChunkProgressBar displays and tracks the progress of a task as a predefined number of chunks.

It supports horizontal and vertical orientation, and different directions.


The following example demonstrates the ChunkProgressBar in action.

Example
View Source
Change Theme:

The ChunkProgressBar is part of the KendoReact ProgressBars component library. The procedures for installing, importing, and using the ProgressBars are identical for all components in the package. To learn how to use the ChunkProgressBar and the rest of the ProgressBars, see the Getting Started with the KendoReact ProgressBars guide.

Key Features

  • Value and ranges—You can set the value and the value range of the ChunkProgressBar component.
  • Disabled ChunkProgressBar—You can disable the KendoReact ChunkProgressBar component.
  • Orientation—You can set the orientation to horizontal or vertical.
  • Direction—You can reserve the direction of the ChunkProgressBar component.
  • Appearance—You can quickly style the ChunkProgressBar by choosing from the predefined styling options.
  • Globalization—The built-in globalization support allows you to create apps that are ready to be implemented worldwide.

In this article

Not finding the help you need?