Как не допустить уменьшения ширины диаграммы Google, если размер экрана маленький ⇐ Php

[Anonymous]

Я использую столбец диаграммы Google для своего веб-сайта и помещаю его в адаптивный элемент div. Он хорошо работает на большом экране. Если я изменю размер браузера, перетащив его, чтобы он стал меньше, адаптивное переполнение работает хорошо, как показано ниже.Обычный экран (рабочий):


Меньший экран (работает):
[img]https://i.sstatic .net/pvRwE.png[/img]

Я хочу, чтобы диаграмма была похожа на изображение выше, которое реагирует даже на маленьком экране. Проблема в том, что если я обновлю страницу на меньшем экране, диаграмма размеров уменьшится, и данные за 2021 год не будут отображаться так (экран станет меньше при обновлении):
[img]https://i.sstatic.net /b39J9.png[/img]

Я уже пытаюсь установить значение размера с его помощью, но все равно не получается:
var options = {
chart: {
title: 'Company Performance',
subtitle: 'Sales, Expenses, and Profit: 2014-2021'
,chartArea:{left:0,top:0,width:"100%",height:"100%"}
,height: 1000
,width: 1000
}
};

вот мой код:











google.charts.load('current', {'packages':['bar']});
google.charts.setOnLoadCallback(drawChart);

function drawChart() {
var data = google.visualization.arrayToDataTable([
['Year', 'Sales', 'Expenses', 'Profit'],
['2014', 1000, 400, 200],
['2015', 1170, 460, 250],
['2016', 660, 1120, 300],
['2017', 1030, 540, 350],
['2018', 1030, 540, 350],
['2019', 1030, 540, 350],
['2020', 1030, 540, 350],
['2021', 1030, 540, 350]
]);

var options = {
chart: {
title: 'Company Performance',
subtitle: 'Sales, Expenses, and Profit: 2014-2021'
,chartArea:{left:0,top:0,width:"100%",height:"100%"}
,height: 1000
,width: 1000
}
};

var chart = new google.charts.Bar(document.getElementById('columnchart_material'));

chart.draw(data, google.charts.Bar.convertOptions(options));
}


Подробнее здесь: https://stackoverflow.com/questions/680 ... size-small