All Components

Right-to-Left Support

Right-to-Left (RTL) support represents the ability of a library, website, or application to handle and respond to users who communicate through right-to-left languages such as Arabic, Hebrew, Chinese, and Japanese.

Configuration

In web applications, the RTL mode can be enabled with the dir attribute of a DOM element.

To enable the RTL mode for all Kendo UI components in your Angular application, provide a text direction value by using the RTL token in the root module of the application.

You can also limit the RTL mode to a part of the application by providing the token to a sub-module. By default, the RTL mode is disabled.

import { RTL } from '@progress/kendo-angular-l10n';

@Component({
    selector: 'my-app',
    template: `
        <kendo-chart [categoryAxis]="{ categories: categories }">
            <kendo-chart-title text="Gross domestic product growth /GDP annual %/"></kendo-chart-title>
            <kendo-chart-legend position="top" orientation="horizontal"></kendo-chart-legend>
            <kendo-chart-tooltip [shared]="true"></kendo-chart-tooltip>
            <kendo-chart-series>
                <kendo-chart-series-item *ngFor="let item of series"
                    type="column" [data]="item.data" [name]="item.name">
                </kendo-chart-series-item>
            </kendo-chart-series>
        </kendo-chart>
    `,
    providers: [{ provide: RTL, useValue: true }]
})
class AppComponent {
  private series: any[] = [{
    name: "India",
    data: [3.907, 7.943, 7.848, 9.284, 9.263, 9.801, 3.890, 8.238, 9.552, 6.855]
  }, {
    name: "Russian Federation",
    data: [4.743, 7.295, 7.175, 6.376, 8.153, 8.535, 5.247, -7.832, 4.3, 4.3]
  }, {
    name: "Germany",
    data: [0.010, -0.375, 1.161, 0.684, 3.7, 3.269, 1.083, -5.127, 3.690, 2.995]
  },{
    name: "World",
    data: [1.988, 2.733, 3.994, 3.464, 4.001, 3.939, 1.333, -2.245, 4.339, 2.727]
  }];
  private categories: number[] = [2002, 2003, 2004, 2005, 2006, 2007, 2008, 2009, 2010, 2011];
}
In this article