36 messaggi dal 14 dicembre 2005
Buonasera,
nella mia web form ho caricato una grafico highcharts, dove nell'opzione events
ho inserito:
events: {
                        load: function () {
                            var series = this.series[0];
                            var data = [];
                            clearInterval(refreshIntervalId);
                            refreshIntervalId = setInterval(function () {
                                if ($('#pause:checked').length > 0) return;
                                if ($('#Indice:checked').length > 0) {
                                    if (indice == false) {
                                        offset += 1;
                                        indice = true;
                                    }
                                } else {
                                    if (indice == false) {
                                        offset -= 1;
                                        indice = true;
                                    }
                                }
                                $.ajax({
                                    type: "POST",
                                    url: url,
                                    data: datavb,
                                    contentType: "application/json; charset=utf-8",
                                    dataType: "json",
                                    success: function (response) {
                                        var data1 = [];

                                        if (response.d != 0) {
                                            $(".Non").css("display", "none");
                                            var puntiletti = JSON.parse(response.d)
                                            for (i = 0; i < puntiletti.length; i++) {
                                                data1.push([j, parseInt(puntiletti[i].data)])
                                                j +=1
                                            }

                                            for (i = 0; i < data1.length; i++)
                                                series.addPoint(data1[i], true, true);
                                            
                                        } else {
                                            aumenta = false;
                                            $(".Non").css("display", "block");
                                        }
                                            
                                    },
                                    error: function (msg) {
                                        },
                                    failure: function (response) {
                                        alert(response.d);
                                    }
                                });

                                if (aumenta == true) {
                                    url = "WFrmStreaming.aspx/AltriDati";
                                    datavb = '{ offset: "' + offset + '"}';
                                } else {
                                    aumenta = true;
                                }

                            }, TempoPassoLettura * 1000);
                        }
                    }


La mia problematica e' che nella lettura dei dati ne ho tanti (circa 262) e quindi il ciclo (for (i = 0; i < puntiletti.length; i++)) lo ripete per questo valore e nel frattempo richiama di nuovo l'evento ajax; quindi tutto quello che avviene nella pagina (magari se clicco qualche pulsante o una checkbox) il risultato si verifica con ritardo, e questo forse per il calcolo dei punti e il richiamo della pagina in WebMethod.

E' possibile caricare il grafico magari in modalita' asincrona o magari in modo tale che tutto quello che avviene nella form non accada con tutto questo ritardo?

Vi rigranzio per la risposta,
davide

n.b.: l'url fa riferimento a delle funzioni definite sul server, dato che il file di lettura (che contiene valori esadecimali che io trasformo in valori decimali) e' presente sul server e quindi sono costretto ad eseguirlo su di esso. grazie
11.886 messaggi dal 09 febbraio 2002
Contributi
Ciao Davide,
262 punti non sono poi molti. Cerchiamo per prima cosa di ottimizzare il codice e vediamo se la situazione migliora.
Segui questi passi:
  • Cerca di eliminare il JSON.parse. Da quanto mi pare di capire, la tua proprietà response.d è una stringa e perciò hai bisogno di usare il JSON.parse per reidratare gli oggetti javascript. Non potresti fare in modo che la proprietà response.d sia già un array di oggetti, magari della forma adatta ad essere usata direttamente da HighCharts, senza altre trasformazioni?
  • Il primo ciclo for, quello che va da 1 a puntiletti.length, non sembra necessario. Ti basta il secondo.
  • ...ma la vera e importante causa del problema penso che sia la chiamata ad AddPoint. Se come secondo parametro gli passi true e questo obbligherà HighCharts a ridisegnare il grafico ogni volta che aggiungi un punto. La documentazione infatti consiglia di usare false quando si aggiungono molti punti, e di forzare il ridisegno al termine, con una chiamata esplicita a .redraw().

    redraw: Boolean
    Defaults to true. Whether to redraw the chart after the point is added. When adding more than one point, it is highly recommended that the redraw option be set to false, and instead chart.redraw() is explicitly called after the adding of points is finished.


Prova a fare queste modifiche, magari la situazione migliora senza dover fare altri interventi.

ciao,
Moreno
Modificato da BrightSoul il 09 febbraio 2015 22.39 -

Enjoy learning and just keep making
36 messaggi dal 14 dicembre 2005
Ok, ho tolto l'opzione events, ho inserito un settimeout alla fine della funzione che disegna il grafico che chiama un altra funzione che richiama l'evento ajax per i 262 punti e poi effettua:

// assegno il grafico
var chart = $('#container').highcharts();

// assegno i nuovi punti
for (i = 0; i < puntiletti.d.length - 2; i += 2) {
    chart.series[0].addPoint([j, parseInt(puntiletti.d[i])], false);
    j += 1
}

// sposto il grafico sull'asse x
var min1 = chart.series[0].xAxis.min + 1
chart.series[0].xAxis.update({
                    min: z
                })

// lo ridisegno
chart.redraw();

z += 262      // aumento la parte per lo spostamento della x



E' veloce e non è lento!!!

Mille grazie Moreno!!!

Torna al forum | Feed RSS

ASPItalia.com non è responsabile per il contenuto dei messaggi presenti su questo servizio, non avendo nessun controllo sui messaggi postati nei propri forum, che rappresentano l'espressione del pensiero degli autori.