After TradingView Fullscreen Display, Still Maintain the Ability to Open/Close Fullscreen

Simply put, you need to customize the chart.

Idea: Hide the TradingView's built-in fullscreen button, then customize the chart to implement the logic.

let's do it!

1. First configure header_fullscreen_button as follows:

disabled_features: [

"header_fullscreen_button", // Hide the header fullscreen button

]

2. Then configure the following code in the chartReady function:

const buttonEvent = widget.createButton({align: "right"});

const button = buttonEvent[0];

button.title = 'Open/Close Fullscreen';

button.className = 'button fullscreen iconed apply-common-tooltip';

buttonEvent.append($('<span class="icon-full"><img src="/static/images/iconfull.png"></span>')); // Image path

button.onclick = function() {

const tvid = $('#tv_chart_container')[0];

if (tvid.className === 'tv_chart_container_full') {

tvid.className = '';

return;

}

tvid.className = 'tv_chart_container_full';

}