How can I transform OHLC data for a Heikin Ashi chart in amCharts 5?

Below is an example of how you can approach the transformation. amCharts 5 doesn’t provide a built-in way to convert standard OHLC data to Heikin Ashi values—this transformation must be done beforehand (or “dynamically” via your own code) so that the series can use the transformed values.

Heikin Ashi values are typically calculated as follows:

• HA_close = (open + high + low + close) / 4
• HA_open = (previous HA_open + previous HA_close) / 2
• HA_high = max(high, HA_open, HA_close)
• HA_low = min(low, HA_open, HA_close)

Here’s an example that processes your data before sending it to the chart:

JAVASCRIPTCopied
// Example original data
let data = [
  { date: "2023-01-01", open: 100, high: 110, low: 95, close: 105 },
  { date: "2023-01-02", open: 105, high: 115, low: 100, close: 110 },
  // more data...
];

// Preprocess data to compute Heikin Ashi values
let haData = [];
for (let i = 0; i < data.length; i++) {
  let d = data[i];
  
  // Calculate HA_close as average of all four prices
  let ha_close = (d.open + d.high + d.low + d.close) / 4;
  
  // Calculate HA_open: if it's the first candle, use average of open and close; otherwise, use previous HA values.
  let ha_open;
  if (i === 0) {
    ha_open = (d.open + d.close) / 2;
  } else {
    let prev = haData[i - 1];
    ha_open = (prev.ha_open + prev.ha_close) / 2;
  }
  
  // Compute HA_high and HA_low
  let ha_high = Math.max(d.high, ha_open, ha_close);
  let ha_low = Math.min(d.low, ha_open, ha_close);
  
  // Collect transformed data
  haData.push({
    date: d.date,
    ha_open: ha_open,
    ha_close: ha_close,
    ha_high: ha_high,
    ha_low: ha_low
  });
}

// Create chart
let root = am5.Root.new("chartdiv");
let chart = root.container.children.push(
  am5xy.XYChart.new(root, {})
);

// Create axes
let xAxis = chart.xAxes.push(
  am5xy.DateAxis.new(root, {
    baseInterval: { timeUnit: "day", count: 1 }
  })
);

let yAxis = chart.yAxes.push(
  am5xy.ValueAxis.new(root, {})
);

// Create the candlestick series using Heikin Ashi fields
let series = chart.series.push(
  am5xy.CandlestickSeries.new(root, {
    xAxis: xAxis,
    yAxis: yAxis,
    openValueYField: "ha_open",
    valueYField: "ha_close",
    highValueYField: "ha_high",
    lowValueYField: "ha_low",
    categoryXField: "date"
  })
);

// Feed processed data to the series
series.data.setAll(haData);

Explanation

• Preprocessing Step:
  The code loops over your original dataset, computes the Heikin Ashi values, and builds a new dataset (haData) with fields ha_open, ha_close, ha_high, and ha_low.

• Series Configuration:
  The CandlestickSeries is configured to use these computed fields instead of the original open, close, high, and low.

This approach ensures that your chart displays Heikin Ashi candles correctly. There isn’t a dynamic built-in feature in amCharts 5 for this conversion, so preprocessing (or dynamically calculating via adapters, if you prefer) is the recommended method.