Indicators

Stock chart comes with a selection of automatic indicators that can be added to the chart via toolbar or API.

Adding via toolbar

To enable adding of indicators via UI, we need to add indicator control to our stock toolbar:

let toolbar = am5stock.StockToolbar.new(root, {
  container: document.getElementById("chartcontrols"),
  stockChart: stockChart,
  controls: [
    am5stock.IndicatorControl.new(root, {
      stockChart: stockChart
    })
  ]
});
var toolbar = am5stock.StockToolbar.new(root, {
  container: document.getElementById("chartcontrols"),
  stockChart: stockChart,
  controls: [
    am5stock.IndicatorControl.new(root, {
      stockChart: stockChart
    })
  ]
});

See the Pen
Stock chart controls
by amCharts team (@amcharts)
on CodePen.0

Adding via API

Creating indicator

Indicators can be added by instantiating an appropriate class, then pushing it into chart's indicators list.

Each indicator will need its stockChart (target stock chart) and stockSeries (value series) set, at the very least.

Some indicators, such as Volume, will need volumeSeries set as well, as they rely on both value and volume data.

stockChart.indicators.push(am5stock.BollingerBands.new(root, {
  stockChart: stockChart,
  stockSeries: valueSeries,
  legend: valueLegend,
  type: "simple"
}));
stockChart.indicators.push(am5stock.BollingerBands.new(root, {
  stockChart: stockChart,
  stockSeries: valueSeries,
  legend: valueLegend,
  type: "simple"
}));

Configuring

Pardon the mess. We're still working on this section.

Available indicators

Refer to the links next to each indicator for settings reference.

IndicatorNeeds stockSeriesNeeds volumeSeries
AccumulationDistributionYesOptionalSettings
AccumulativeSwingIndexYesSettings
AroonYesSettings
AwesomeOscillatorYesSettings
BollingerBandsYesSettings
ChaikinMoneyFlowYesYesSettings
ChaikinOscillatorYesYesSettings
CommodityChannelIndexYesSettings
DisparityIndexYesSettings
MACDYesSettings
MedianPriceYesSettings
MovingAverageYesSettings
MovingAverageCrossYesSettings
MovingAverageDeviationYesSettings
MovingAverageEnvelopeYesSettings
OnBalanceVolumeYesYesSettings
PVT (Price Volume Trend)YesYesSettings
RelativeStrengthIndexYesSettings
StandardDeviationYesSettings
StochasticOscillatorYesSettings
TrixYesSettings
TypicalPriceYesSettings
VolumeYesYesSettings
VolumeProfileYesYesSettings
VWAPYesYesSettings
WilliamsRYesSettings
ZigZagYesSettings

Creating custom indicators

Refer to "Creating custom indicators for a Stock Chart" tutorial.

Related tutorials