У меня есть панель управления, в которой несколько отчетов, которые я отображал, используя графики плагинов chartsjs, но проблема, с которой я здесь сталкиваюсь, заключается в том, что загрузка страницы панели инструментов занимает много времени, я вызываю функции php для загрузки графика данные.
Теперь я хочу, чтобы сначала я хотел загрузить статические html-данные, то есть отображать страницу, и после этого функция содержимого графических данных будет запущена во время выполнения.
Обмен изображением
Здесь вы можете видеть на этом изображении, что я посетил URL, на котором страница загружена, но содержимое все еще загружается в фоновом режиме
Тот же случай, который я хочу, чтобы моя панель инструментов тоже загружала статическое html-содержимое после этого показывать индикатор выполнения для каждой функции графика
Я пытался использовать эти функции, но это не сработало
jQuery(window).bind("load", function () {
});
Вот мой код jquery-графа
var Dashboard = function() {
var e = function(e, t, a, r) {
if (0 != e.length) {
}
},
return {
init: function() {
var a, r;
function() {
if (0 != $("#m_chart_sales_stats").length) {
var e = {
type: "line",
data: {
labels: ['June',
'July',
'August',
'September',
'October',
'November',
'December',
'January',
'February',
'March',
'April',
'May'],
datasets: [{
label: "Redemptions",
borderColor: mApp.getColor("brand"),
borderWidth: 3,
pointBackgroundColor: mApp.getColor("brand"),
backgroundColor: mApp.getColor("accent"),
pointHoverBackgroundColor: mApp.getColor("danger"),
pointHoverBorderColor: Chart.helpers.color(mApp.getColor("danger")).alpha(.2).rgbString(),
data: <?php echo $this->dashboard_model->redemptionsMonthlyMerchant();?> }]
},
options: {
title: {
display: !1
},
tooltips: {
intersect: !1,
mode: "nearest",
xPadding: 10,
yPadding: 10,
caretPadding: 10
},
legend: {
display: !1,
labels: {
usePointStyle: !1
}
},
responsive: !0,
maintainAspectRatio: !1,
hover: {
mode: "index"
},
scales: {
xAxes: [{
display: !1,
gridLines: !1,
scaleLabel: {
display: !0,
labelString: "Month"
}
}],
yAxes: [{
display: !1,
gridLines: !1,
scaleLabel: {
display: !0,
labelString: "Value"
}
}]
},
elements: {
point: {
radius: 3,
borderWidth: 0,
hoverRadius: 8,
hoverBorderWidth: 2
}
}
}
};
new Chart($("#m_chart_sales_stats"), e)
}
}()
}
}
}();
jQuery(document).ready(function() {
Dashboard.init();
});
Я использую codeigniter для извлечения динамических данных.