#javascript #css #highcharts
#javascript #css #диаграммы
Вопрос:
У меня есть HTML-страница со следующими разделениями, которые заполняются диаграммой с использованием Highcharts. По умолчанию один из них скрыт и затем отображается на основе выбранных элементов на странице.
Когда я показываю div программно, он занимает лишь небольшую часть ширины экрана, но когда я показываю его по умолчанию, то есть без скрытия CSS, он занимает всю ширину экрана (чего я и хочу).
Может кто-нибудь сказать мне, как я могу настроить divs на сохранение полной ширины экрана или как сбросить это после отображения?
Мои divs:
<div id="containerR" style="height:600px; margin:0 auto; min-width:300px;"></div>
<div id="containerC" style="height:600px; margin:0 auto; min-width:300px; display:none"></div>
Моя функция JS:
$('#viewC').on('click', function() {
$('#viewR').removeClass('btn-primary');
$('#viewC').addClass('btn-primary');
$('#containerR').hide();
$('#containerC').show();
});
Заранее большое спасибо за любую помощь в этом, Тим.
Комментарии:
1. Я считаю, что вам нужно скрыть диаграмму только после ее рисования
2. Хорошо, спасибо. Значит, я не могу повторно применить CSS через JavaScript впоследствии?
3. Проблема в том, что highChart, вероятно, рисуется в соответствии с доступным пространством, но если он скрыт, это портит его вычисления. Даже если вы покажете его позже и установите ширину, диаграмма уже была нарисована с другим размером. Вам нужно отобразить его, когда вы рисуете диаграмму, и после этого вы можете скрыть его снова
4. Хорошо, это имеет смысл — большое спасибо за объяснения!
5. Подтверждено, это хорошо работает по-вашему. 🙂
Ответ №1:
Проблема в том, что highChart, вероятно, рисуется в соответствии с доступным пространством, но если он скрыт, это портит его вычисления. Даже если вы покажете его позже и установите ширину, диаграмма уже была нарисована с другим размером.
Вам нужно отобразить его, когда вы рисуете диаграмму, и после этого вы можете скрыть его снова