repo_files/documentations/candlestick_chart.md
CandlestickChart(
CandlestickChartData(
// read about it in the CandlestickChartData section
),
duration: Duration(milliseconds: 150), // Optional
curve: Curves.linear, // Optional
);
When you change the chart's state, it animates to the new state internally (using implicit animations). You can control the animation duration and curve using optional duration and curve properties, respectively.
| PropName | Description | default value |
|---|---|---|
| candlestickSpots | Holds the data for the candlestick chart, which is a list of CandlestickSpot objects. Each CandlestickSpot represents a single data point in the chart. | [] |
| candlestickPainter | It is a painter that is used to draw each individual candlestick. You can use this to customize the appearance of the candlesticks (Or you can implement your own painter). | DefaultCandlestickPainter() |
| titlesData | check the FlAxisTitleData | FlAxisTitleData() |
| candlestickTouchData | CandlestickTouchData holds the touch interactivity details | CandlestickTouchData() |
| showingTooltipIndicators | indices of showing tooltip, The point is that you need to disable touches to show these tooltips manually | [] |
| gridData | check the FlGridData | FlGridData() |
| borderData | check the FlBorderData | FlBorderData() |
| minX | gets minimum x of x axis, if null, value will read from the input lineBars (But it is more performant if you provide them) | null |
| maxX | gets maximum x of x axis, if null, value will read from the input lineBars (But it is more performant if you provide them) | null |
| baselineX | defines the baseline of x-axis | 0 |
| minY | gets minimum y of y axis, if null, value will read from the input lineBars (But it is more performant if you provide them) | null |
| maxY | gets maximum y of y axis, if null, value will read from the input lineBars (But it is more performant if you provide them) | null |
| baselineY | defines the baseline of y-axis | 0 |
| rangeAnnotations | show range annotations behind the chart, check RangeAnnotations | RangeAnnotations() |
| clipData | clip the chart to the border (prevent drawing outside the border) | FlClipData.none() |
| backgroundColor | a background color which is drawn behind th chart | null |
| rotationQuarterTurns | Rotates the chart 90 degrees (clockwise) in every quarter turns. This feature works like the RotatedBox widget | 0 |
| touchedPointIndicator | Shows the touched point in the chart, by default it shows a horizontal and vertical line exactly on the touched candle. If the handleBuiltInTouches is true in CandlestickTouchData, this parameter is used under the hood to highlight the selected point. But you can disable the handleBuiltInTouches and implement your own way to highlight the point. Look at AxisSpotIndicator for more information | null |
| PropName | Description | default value |
|---|---|---|
| open | The open value of the candlestick (based on the OHLC standard | required |
| high | The high value of the candlestick (based on the OHLC standard) | required |
| low | The low value of the candlestick (based on the OHLC standard) | required |
| close | The close value of the candlestick (based on the OHLC standard) | required |
| show | Determines to show or hide this individual candlestick | true |
| PropName | Description | default value |
|---|---|---|
| enabled | determines to enable or disable touch behaviors | true |
| touchCallback | listen to this callback to retrieve touch/pointer events and responses, it gives you a FlTouchEvent and CandlestickTouchResponse | null |
| mouseCursorResolver | you can change the mouse cursor based on the provided FlTouchEvent and CandlestickTouchResponse | MouseCursor.defer |
| touchTooltipData | a CandlestickTouchTooltipData, that determines how show the tooltip on top of touched spot (appearance of the showing tooltip bubble) | CandlestickTouchTooltipData() |
| touchSpotThreshold | the threshold of the touch accuracy | 4 |
| handleBuiltInTouches | set this true if you want the built in touch handling (show a tooltip bubble and an indicator on touched/hovered spots) | true |
| longPressDuration | allows to customize the duration of the longPress gesture. If null, the duration of the longPressGesture is kLongPressTimeout | null |
| PropName | Description | default value |
|---|---|---|
| tooltipBorder | border of the tooltip bubble | BorderSide.none |
| tooltipBorderRadius | background corner radius of the tooltip bubble | BorderRadius.circular(4) |
| tooltipPadding | padding of the tooltip | EdgeInsets.symmetric(horizontal: 16, vertical: 8) |
| tooltipHorizontalAlignment | horizontal alginment of tooltip relative to the spot | FLHorizontalAlignment.center |
| tooltipHorizontalOffset | horizontal offset of tooltip | 0 |
| maxContentWidth | maximum width of the tooltip (if a text row is wider than this, then the text breaks to a new line | 120 |
| getTooltipItems | a callback that retrieve a CandlestickTooltipItem by the given CandlestickSpot | defaultCandlestickTooltipItem |
| fitInsideHorizontally | forces tooltip to horizontally shift inside the chart's bounding box | false |
| fitInsideVertically | forces tooltip to vertically shift inside the chart's bounding box | false |
| showOnTopOfTheChartBoxArea | forces the tooltip container to top of the line | false |
| getTooltipColor | a callback that retrieves the Color for each touched spots separately from the given CandlestickSpot to set the background color of the tooltip bubble | Colors.blueGrey.darken(80) |
| PropName | Description | default value |
|---|---|---|
| text | text string of each row in the tooltip bubble | null |
| textStyle | TextStyle of the showing text row | null |
| textDirection | TextDirection of the showing text row | TextDirection.ltr |
| bottomMargin | bottom margin of the tooltip (to the top of most top spot) | 0 |
| children | List<TextSpan> pass additional InlineSpan children for a more advance tooltip | null |
| PropName | Description | default value |
|---|---|---|
| touchLocation | the location of the touch event in the device pixels coordinates | required |
| touchChartCoordinate | the location of the touch event in the chart coordinates | required |
| touchedSpot | Instance of CandlestickTouchedSpot which holds data about the touched spot | null |
| PropName | Description | default value |
|---|---|---|
| spot | touched CandlestickSpot | null |
| spotIndex | index of touched CandlestickSpot | null |