Флотская диаграмма разбита в отзывчивом виде и мобильном телефоне
Круговая диаграмма flot прекрасно работает в обычном режиме рабочего стола, но она нарушается в адаптивном режиме и на мобильных устройствах. Пожалуйста, проверьте изображения ниже
Вид рабочего стола[^]
В мобильном устройстве и отзывчивом представлении[^]
Что я уже пробовал:
Я попробовал применить CSS, обновленный плагин из GitHub, но это не помогло. Ниже приведен код
define(function(){ return { init: function(selector, data) { require(['thirdparty/jquery.flot.pie', 'thirdparty/jquery.flot.tooltip.min'], function() { $.plot($(selector), data, { series: { pie: { show: true, radius: 1, label: { show: true, radius: 1, formatter: function(label, series) { return '<div style="font-size:10pt;text-align:center;padding:2px;color:white;">'.concat(label).concat('<br/>').concat(series.data[0][1]).concat('</div>'); }, background: { opacity: 0.8 } } } }, legend: { show: false }, grid: { hoverable: true, }, tooltip: true, tooltipOpts: { cssClass: "flotTip", content: function(label, x, y){ return y.toString().concat(" ").concat(label); }, shifts: { x: 20, y: 0 }, defaultTheme: true } }); }); } } });
Richard MacCutchan
Код, скорее всего, нуждается в корректировке с учетом различных размеров экрана. Вернитесь к человеку, который написал этот код для помощи.