Skip to content

Update stock-chart.mdx with Data Chart content #1064

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
agoldenbaum wants to merge 1 commit into
base: vnext
Choose a base branch
from
Open

Update stock-chart.mdx with Data Chart content #1064

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
24 changes: 23 additions & 1 deletion docs/xplat/src/content/en/components/charts/types/stock-chart.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ title: "{Platform} Stock/Financial Charts | {ProductName}"
description: The {ProductName} Stock Chart is a composite visualization that renders stock ticker data, or price data in an interactive time-series display. Download free trial.
keywords: "{Platform} Charts, Stock Chart, Financial Chart, Candlestick Chart, OHLC Chart, Infragistics"
license: commercial
mentionedTypes: ["DomainChart", "FinancialChart", "FinancialChartType", "IndicatorTypes", "ZoomSliderType", "Series"]
mentionedTypes: ["DataChart", "DomainChart", "FinancialChart", "FinancialChartType", "IndicatorTypes", "ZoomSliderType", "Series"]
namespace: Infragistics.Controls.Charts
llms:
description: "The {ProductName} Stock Chart, sometimes referred to as {Platform} Financial Chart or Candlestick Chart, is a composite visualization that renders stock ticker data, or price data in an interactive time-series display."
Expand Down Expand Up @@ -120,6 +120,28 @@ In this example, the stock chart is plotting revenue for United States.

<Sample src="/charts/financial-chart/panes" height={600} alt="{Platform} Chart Panes" />

## Using Financial Series in Data Chart

The `DataChart` control's `FinancialPriceSeries` is used to plot stock prices, and show the stock's high, low, open, and close prices over time. The Financial Price Series is often used in combination with a number of other Financial Indicators to measure changes and analyze trends of stock prices.

The series reads its values from a data source that must contain open, high, low, and close prices for each time period. Each of these values need to be mapped to the `OpenValueMemberPath`, `HighValueMemberPath`, `LowValueMemberPath`, and `CloseValueMemberPath` properties of the `FinancialPriceSeries`, respectfully.

The `FinancialPriceSeries` has two display modes that are configurable by setting the enumerable `DisplayType` property. These are described below:

### Candlestick Mode

The `FinancialPriceSeries` in Candlestick display mode is used to plot stock prices, and show the stock's high, low, open and close prices for each day. Each data point is plotted as a vertical column with vertical lines on both the top and bottom. The vertical line indicates the span between high and low values of an investment for that day. The top of the vertical line indicates the highest price during a session and the bottom of the vertical line indicates the lowest price during a session. The vertical columns indicate the span between the opening and closing values of an investment.

The columns are filled using Series' `Brush` when there is positive value and using Series' `NegativeBrush` when there is negative value between the opening and closing values.

//TODO SAMPLE

### OHLC Mode

The `FinancialPriceSeries` in OHLC display mode is used to plot stock prices, and show the stock's High, Low, Open, and Close prices for each day. Each data point is plotted as a vertical line with horizontal perpendicular lines on both the left and right side. The vertical line indicates the span between high and low values of an investment. The top of the vertical line indicates the highest price during a session and the bottom of the vertical line indicates the lowest price during a session. The horizontal lines indicate the span between the opening and closing values of an investment. The horizontal line on the left-hand side of the vertical line indicates the opening value of a session. The horizontal line on the right-hand side of the vertical line indicates the closing value of a session

//TODO SAMPLE

## Additional Resources

You can find more information about related chart features in these topics:
Expand Down
Loading