Я пытаюсь отобразить загрузочный ящик до того, как обновится карта флота. при загрузке документа он отлично работает, однако, когда я использую события кликов на кнопках, поле загрузки появляется только после обновления карты флота.показать окно загрузки перед диаграммой флота генерирует
следующие документы готовы к работе.
function showLoadGraph() {
$("#loading-div-background").removeAttr('style');
$("#loading-div-background").css({display:"block"});
console.log("showLoadGraph");
}
function hideLoadGraph() {
$("#loading-div-background").css({display:"none"});
console.log("hideLoadGraph");
}
$(document).ready(function() {
//api.loadActivityIndicator();
//$("#loading-div-background").css({ opacity: 0.8 });
showLoadGraph();
...
$.ajax({
url: 'flot_network_ajax.php',
type: 'GET',
data: 'action=network_availability&' + params,
dataType: 'json',
success: function(data) {
ajax_data = data.rows;
//process data
var availability_object = loopInitial(data.rows,"sevendays","");
var json_object = calculateAvailability(availability_object);
rePlot(json_object);
api.hideActivityIndicator();
hideLoadGraph();
},
error: function(e) {
//called when there is an error
console.log(e.responseText);
}
});
Как только начальная загрузка закончилась, я попробую отобразить окно загрузки при щелчках, но это изменяется только после обновления флота. После помещается в doc.ready
//today click event
$("#group_period input").change(function(){
showLoadGraph();
var id = $(this).attr('id');
var to = false;
if (id == "yesterday" || id == "lastmonth")
to = true;
var availability_object = loopInitial(ajax_data,id,to);
var json_object = calculateAvailability(availability_object);
rePlot(json_object);
});
UPDATE
я добавил таймер, чтобы проверить, где она принимает очень долго. Фактически это занимает длительную обработку диаграммных данных, чем сама диаграмма. Если я пытаюсь показать окно загрузки перед обработкой данных диаграммы она по-прежнему не показывает
start sevendays process: 1450369631807
Object {vfvftfvf: Array[0], vfvf: Array[0], tfvf: Array[0]}
finish sevendays process: 1450369639141
process sevendays duration : 7.334s
start graph render: 1450369639141
[Object]
finish graph render: 1450369639179
process graph render duration : 0.038s
Вы можете посмотреть на некоторые из событий, которые они поддерживают, примеры для plotclick и plothover здесь https://github.com/flot/flot/blob/master/API.md#customizing-the-grid, а также то, что вы можете подключить здесь: https://github.com/flot/flot/blob/master/API.md#hooks ie bindEvents и draw – Pricey
нет подходящего примера, поэтому я не уверен, как это сделать? – shorif2000
Посмотрите на примеры кода, перечисленные под крючками https://github.com/flot/flot/blob/master/API.md#hooks Существует быстрый пример функции hellohook (plot, canvascontext) {alert («привет! «); }; var plot = $ .plot (placeholder, data, {hooks: {draw: [hellohook]}}); 'который будет показывать окно предупреждения всякий раз, когда происходит событие« draw »... Существует список Крюков от 1 до 8, предположительно вы хотите, чтобы «Установить данные» или «Настройка сетки», что-то подобное, и иметь функцию, которая отображает наложение – Pricey