Appearance

The colors of the Chart are derived from the activeKendo UI for Vue theme. For customization of the themes, refer to thecustomizing themes article.

Setting the Dimensions

By default, the Chart is 400px high and as wide as its container. To set the dimensions of the Chart, use inline styles and CSS.

Limiting the Displayed Range

To limit the range which is displayed by the Chart:

1. Set themin andmax options of the category axis.
2. Enablepanning andzooming, so that the user is able to see the rest of the data.

Using Pattern Fills

In addition to solid colors, the Chart series can also be filled with repeating patterns by using the series itempattern

The pattern inherits the series as maincolor and accepts an optional background color.

The following customizable pattern fills are available:

• Crosshatch Pattern—Uses crisscrossing lines to form a grid-like pattern.
• Diagonal Stripes Pattern—Applies diagonal lines across the series.
• Dots Pattern—Fills the series with evenly spaced dots.
• Grid Pattern—Renders a regular grid pattern.
• Vertical Stripes Pattern—Displays vertical stripes.

The following example demonstrates the usage of the pattern fills for series.

Suggested Links

• API Reference of the Chart
• Creating Custom Styles with ThemeBuilder