Auto-scale Y-axis for indicators graph when zooming

[zlpatel]

Original Discussion Post: #355

There's something that I noticed which makes it difficult to view indicator graph on the chart if you're backtesting for longer period. Below is an example of an indicator view on the chart without zooming in. Notice the y axis scales.

Now, when I zoom in to focus on a specific period when ttm squeeze value stayed between -5 to +5, it still shows the full scale from -15 to+20. which makes it really hard to visualize the indicator chart. See below.

I know that re-scaling is allowed for the price chart/Volume. Is that something that can be implemented on the indicator charts as well?

[zlpatel]

I fiddled around with the code and made it work :)

Here's what I did:

I have added code

indicator_max=value.df.max(axis='columns')
indicator_min=value.df.min(axis='columns')
source.add(indicator_max, f'indicator_{i}_range_max')
source.add(indicator_min,f'indicator_{i}_range_min')

right above

backtesting.py/backtesting/_plotting.py

Line 526 in 0a76e96

for j, arr in enumerate(value, 1):

then,

indicator_ranges = {}
for idx,indicator in enumerate(indicator_figs):
    indicator_range_key = f'indicator_{idx}_range'
    indicator_ranges.update({indicator_range_key:indicator.y_range})
custom_js_args.update({'indicator_ranges':indicator_ranges})

right below these lines

backtesting.py/backtesting/_plotting.py

Lines 610 to 611 in 0a76e96

	if plot_volume:
	custom_js_args.update(volume_range=fig_volume.y_range)

then,

if(indicator_ranges){
    let keys = Object.keys(indicator_ranges);
    for(var count=0;count<keys.length;count++){
        if(keys[count]){
            max = Math.max.apply(null, source.data[keys[count]+'_max'].slice(i, j));
            min = Math.min.apply(null, source.data[keys[count]+'_min'].slice(i, j));
            if(min && max){
                _bt_scale_range(indicator_ranges[keys[count]], min, max, true);
            }    
        }
    }
}

right below these lines

backtesting.py/backtesting/autoscale_cb.js

Lines 30 to 33 in 0a76e96

	if (volume_range) {
	max = Math.max.apply(null, source.data['Volume'].slice(i, j));
	_bt_scale_range(volume_range, 0, max * 1.03, false);
	}

Here's how it looks on the graph:

Without Zooming in:

When Zoomed in: