Getting Started with Kendo UI for Vue StockChart
The Kendo UI for Vue StockChart is a specialized control for visualizing the price movement of a financial instrument over a certain period of time.
Generally, Stockcharts include extensive touch support and a navigator pane for easy browsing of extended time periods.
The Kendo UI for Vue StockChart component is part of the Kendo UI for Vue library. It is distributed through NPM under the kendo-vue-charts package.
The following example demonstrates the StockChart in action.
The StockChart navigator represents a pane that is placed at the bottom of the chart and which can be used to change the date interval in the main panes.
To limit the range that is displayed by the Chart, refer to the article on appearance.
To configure the navigator, use the
ChartNavigator component and its child components.
To load the main series data for the selected period on demand, use the
onNavigatorFilter event. The event object contains the start and end of the selected period. Since the navigator should not be re-rendered when the main series are filtered set the
partialRedrawproperty of the StockChart to
Similar to the Chart component, the StockChart supports multiple panes and displays all additional panes above the navigator pane.