Skip to main content

Internal chart instance

Technical Analysis Charts are built using regular LightningChart JS charts. While they use completely different API than the charts they're based on, getInternalChart() method can be used to access the internal LightningChart instance and its API. The method can be used to alter TradingChart behavior and add features that the Technical Analysis Chart's API normally doesn't allow.

// Using internal chart to enable animations.
tradingChart.getInternalChart().setAnimationsEnabled(true)

The internal chart instance also allows adding new series to the chart, for example to create custom indicators. 

// Using internal chart to add a StepSeries on top of the trading data.
const stepSeries = tradingChart.getInternalChart().addStepSeries()
.setAreaFillStyle(emptyFill)
.setCurvePreprocessing({ type: 'step' })

const data = [
  { x: 0, y: 230 },
  { x: 40, y: 250 },
  { x: 80, y: 230 },
  { x: 120, y: 190 },
  { x: 160, y: 200 },
  { x: 200, y: 230 },
  { x: 240, y: 245 }
]

stepSeries.appendJSON(data)

Internal chart usage

It should be noted that while the internal chart can be used to freely modify appearance or add custom functionalities, it also has the potential to interfere with TradingChart’s built-in behavior. For instance, adding or removing Y-axes manually via the internal chart can easily break indicators drawn below the main chart. For this reason, any modifications should be made carefully.

To find out more about LightningChart JS's features, please check the respective documentation.

Zoom band chart instance​

Zoom band chart's internal chart can be accessed via another method, getZoomBandChart(). This can be useful when, for example, the zoom band chart should have different background compared to the main chart. getZoomBandChart() works similarly to getInternalChart(), though adjustments are less likely to interfere TradingChart's behavior.

// Using internal zoom band chart instance to make the background black.
tradingChart.getZoomBandChart().setSeriesBackgroundFillStyle(new SolidFill({
  color: ColorRGBA( 0, 0, 0 )
}))

If zoom band chart has not been added to the chart, getZoomBandChart() returns undefined.