NavigatorComponent
The configuration options of the navigator (see runnable example).
@Component({
selector: 'my-app',
template: `
<kendo-stockchart (navigatorFilter)="onNavigatorFilter($event)">
<kendo-chart-series>
<kendo-chart-series-item
type="candlestick"
[data]="seriesData"
openField="Open"
closeField="Close"
lowField="Low"
highField="High"
categoryField="Date">
</kendo-chart-series-item>
</kendo-chart-series>
<kendo-chart-navigator
[categoryAxis]="categoryAxisOptions"
[hint]="hintOptions"
[pane]="paneOptions"
[visible]="isVisible">
<kendo-chart-navigator-select [from]="from" [to]="to">
</kendo-chart-navigator-select>
<kendo-chart-navigator-series>
<kendo-chart-navigator-series-item type="area" [data]="navigatorData" field="Close" categoryField="Date">
</kendo-chart-navigator-series-item>
</kendo-chart-navigator-series>
</kendo-chart-navigator>
</kendo-stockchart>
<br /><br />
<button kendoButton (click)="isVisible = !isVisible">Toggle Navigator</button>
`
})Selector
kendo-chart-navigator
Inputs
| Name | Type | Default | Description |
|---|---|---|---|
categoryAxis |
|
The configuration options of the category axis. | |
hint |
|
The default options of the navigator hint. | |
pane |
|
The navigator pane configuration. | |
position |
|
The position of the navigator. By default, the navigator is positioned at the bottom. | |
select |
|
Specifies the initially selected range. If no range is specified, the full range of values is shown. | |
series |
|
An array of series definitions. Accepts the same options as the root series collection. Omitting the array and specifying a single series is also acceptable. | |
visible |
|
The visibility of the navigator. |
Methods
notifyChanges | ||||||
|---|---|---|---|---|---|---|
|
Updates the component fields with the specified values and refreshes the Chart. Use this method when the configuration values cannot be set through the template. | ||||||
|
