Progress Telerik UI for Blazor

Blazor Stock Chart

  • With Blazor Stock Chart you can visualize the price movement of any financial instrument over a certain period of time. Provides a navigator pane to let you zoom in on a certain area or aggregate an overview for a large portion of data.
  • This component is part of the largest truly native Blazor component suite - Telerik UI for Blazor designed to perfectly fit in any app’s requirement.
  • The Blazor UI suite also comes with professionally designed themes enabled with a flip of a switch, document processing library, rich docs & demos to help you get started in no time.
Telerik UI for Blazor Suite
Nasa, Visa, Microsoft Fox, Samsung, IBM World Bank Group, Volvo
  • Overview

    The Telerik UI for Blazor Stock Chart component was added for those of you developing financial applications. The Stock Chart displays changes in the price of a financial unit over time, such as the daily values of a stock price for the past month. You can fully customize the control and change anything from fonts, area background color, opacity, line width and dash types to its dimensions, paddings & margins and tooltips. You can even provide your own templates.

    See the Blazor Stock Chart demo

    Telerik UI for Blazor Stock Chart Overview
  • Data Binding

    Data can be bound to the Stock Chart component in a similar manner to other Charts. Data series should contain extra information, such as the values at the start and the end of the trading day, the respective max/min values and a DateTime field for the x-axis.

    Telerik UI for Blazor Stock Chart Data Binding

    Telerik UI for Blazor Data Binding
  • The Navigator is a part of the Stock Chart component which allows users to navigate all the information on the chart by jumping to a date they find interesting and narrowing down to a particular period to see fine-grained details.

    Learn more in the documentation

    Telerik UI for Blazor Stock Chart navigator
  • Crosshairs

    The Crosshairs are another part of the StockChart. They are a pair of lines, intersecting at the current mouse position, which provide a visual cue for the user to zoom in on a single data point and read its value. When you have to navigate a large amount of data points and/or a large time interval, Crosshairs let you see precise values and not just the trend.

    See more about Blazor StockChart Crosshairs in our documentation

  • Tooltips

    Tooltips are also available when a data point is hovered over. Tooltips can be customized in several ways: you can change only the default colors, provide a template to completely overhaul the design or set different tooltips for different data series.

    Tooltip for Telerik Blazor Stock Chart

    Telerik UI for Blazor Stock Chart with tooltips
  • Types

    The Stock Chart comes in several shapes and sizes: Area, Line, Column, Candlestick and OHLC.  They each serve a different purpose and are useful in slightly varying situations. Explore all charts and see them in action in our documentation.

  • Events

    The Telerik UI for Blazor Stock Chart will trigger the OnSeriesClick event whenever the user clicks on a data series. Your event handler will receive the relevant information about the click, which varies depending on the type of the Stock Chart. You can then use the click handler to display detailed information about the data point or execute custom logic.

    Telerik UI for Blazor Events

All Blazor Components

Next Steps

Launch demos

See Telerik UI for Blazor in action and check out how much it can do out-of-the-box.

Download free trial

Try Telerik UI for Blazor with dedicated technical support.