Custom Plotters in Chart (beta) Module

Hi, I was looking at the new Chart (beta) module and noticed that custom plotters are not rendering. Will custom plotters be supported once it moves out of beta? Are there any changes we need to make for custom plotters to work on the new chart module?

Hi @nom28 can you share some specifics of what custom plotter implementation is not working as expected in Chart(beta)?

Hi Brian,

I was trying various custom indicators that I have installed and noticed the ones that didn’t render in the new Chart(beta) were the ones with custom plotters.

Specifically they used canvas.DrawLine and canvas.DrawPath

Here are some example indicators where I saw the issue:

  • p2f - Scale Zones
  • p2f - Dead Simple Reversal
  • Moving Average WonderCloud
  • OGC - Hull Trend
  • NOM Heikin Ashi Smoothed
  • NOM LRC

In the console I’m seeing the following errors (screenshot):

Thanks. We’ll take a look.

The devs noted that it looks like these indicators have used an undocumented way to access coordinates which caused this issue

Thanks for the reply @BWeis

I took a look at how these custom indicators were accessing coordinates and they all use some form of the following:

for(let i=0; i<history.data.length; ++i) {
const item = history.get(i);
const x = p.x.get(item);

}

This method of accessing the coordinates comes from the documentation found at https://tradovate.github.io/custom-indicators/

An example is from the dnaLikePlotter():

Is there a different way to access the coordinates in the new Beta Chart module, and is there any new documentation to show how?

Thanks!

Could you retry the indicators in question on Charts (beta) in version 1.201120.0+ and let us know if you still see those issues? We’ve made a few adjustments to this version. If you’re still seeing those issues we can dig a little deeper.

Hi @BWeis It looks like the latest version of the Chart (beta) module does indeed fix the issue for drawing custom plotters. Thank you!

As a follow up question, I did notice that on the Heikin Ashi Smoothed indicator, I’m no longer able to hide the main candles of the chart to make the HA candles easier to see. I had been previously hiding the main candles by setting their style to “transparent” in the returned object of the map function, like so:

candlestick: {
color: this.props.hideCandles ? “transparent” : null
},
style: {
value: {
color: this.props.hideCandles ? “transparent” : null
}
},

What would be the proper way to accomplish this in the new Beta Chart? I noticed the new color pickers don’t seem to have the transparent option any more. Hoping there is still a way to do this.

Thanks in advance!

We have something planned to address it. I will keep this topic updated when we push an update for that.

Hi @nom28

With our next update. For backward compatibility, overriding the candlestick style with color=”transparent” or opacity=0 will hide the whole candle or bar.