Odświeżanie strony bez przeładowania

0

Witam

Bardzo proszę o pomoc. Chcę zmodyfikować przykładowy kod generujący wykres "wind rose" Highcharts tak aby strona była odświeżana automatycznie bez przeładowania. Kod już zaimplementowałem na swoim serwerze, tak więc nie ma ograniczeń JSFiddle. Dane do wykresu pochodzą z pliku windrose.php, który pobiera je z bazy MySQL i nie koduje ich do formatu JSON. Wylicza tylko zmienne, które podstawiam zamiast liczb w polach tabeli jak w przykładzie. Skrypt java pobiera wartości z tej tabeli i generuje wykres. W jaki sposób należy zbudować zapytanie AJAX, aby wykres był generowany co 1 minutę z nowymi wartościami z pliku windrose.php?

Kod, który chcę zmodyfikować:
[http://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/highcharts/demo/polar-wind-rose/]

Pozdrawiam

0

Tutaj jest przykład dynamicznych danych w Highcharts:
http://www.highcharts.com/stock/demo/dynamic-update
http://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/stock/demo/dynamic-update/

Odpowiada za to dokładnie ten kod:

chart: {
        events: {
            load: function () {
                // set up the updating of the chart each second
                var series = this.series[0];
                setInterval(function () {
                    var x = (new Date()).getTime(), // current time
                        y = Math.round(Math.random() * 100);
                    series.addPoint([x, y], true, true);
                }, 1000);
            }
        }
    },

Wystarczy więc wewnątrz funkcji setInterval zaimplementować ładowanie danych z serwera i zmienić interwał z sekundy na minutę.

0

Bardzo dziękuję. Czuję, że rozwiązanie jest blisko. Umieściłem "events:" w sekcji chart. Dane pobierane są z pliku windrose.php, który inkluduję na początku strony tylko jeden raz. Jak przenieść wywołanie pliku windrose.php do ciała funkcji setInterval? Konieczne jest wywołanie skryptu windrose.php, który dostarczy tylko wyliczonych zmiennych dla tabeli (html), która jest źródłem danych dla serii.

 <tr nowrap bgcolor="#DDDDDD">
                    <td class="dir">NNE</td>
                    <td class="data"><? echo $powtorzenie_nne_1_proc; ?></td>
                    <td class="data"><? echo $powtorzenie_nne_2_proc; ?></td>
                    <td class="data"><? echo $powtorzenie_nne_3_proc; ?></td>
                    <td class="data"><? echo $powtorzenie_nne_4_proc; ?></td>
                    <td class="data"><? echo $powtorzenie_nne_5_proc; ?></td>
                    <td class="data"><? echo $powtorzenie_nne_6_proc; ?></td>
                    <td class="data"><? echo $powtorzenie_nne_7_proc; ?></td>
                    <td class="data"><? echo $suma_nne; ?></td></td>
  </tr>
 data: {
        table: 'freq',
        startRow: 1,
        endRow: 17,
        endColumn: 7
  },

Kod wygląda tak:

 Highcharts.chart('container', {
    
	data: {
        table: 'freq',
        startRow: 1,
        endRow: 17,
        endColumn: 7
    },

      chart: {
			polar: true,
			type: 'column',
			events: {
				load: function () {
					// set up the updating of the chart each second
					var series = this.series[0];
					setInterval(function () {
						var x = (new Date()).getTime(), // current time
							y = Math.round(Math.random() * 100);
						series.addPoint([x, y], true, true);
					}, 5000);
				}
			}
		},
0

Czy ktoś z szanownych Forumowiczów może pomóc?

W jaki sposób zastąpić inkludowanie pliku *.php kodem jQuery, który będzie go ładował co minutę, a tym samym udostępniał wyliczone przez skrypt zmienne?

<?php
			include 'windrose_1.php';
?>
0

Rozwiązaniem Twojego problemu może być użycie zapytania ajax w miejsce pobierania danych.
Sprawdź ten link:
http://stackoverflow.com/questions/1153535/refresh-a-part-of-webpage-in-php

0

Dziękuję. Problem jest prawdopodobnie niemożliwy do rozwiązania w tym układzie programu jaki podałem w pierwszym poście. Po zainkludowaniu pliku *.php wygenerowane przez niego zmienne trafiają do pól tabeli w html, które to pola wykorzystywane są następnie do tworzenia wykresu w javascript. Pola w tabeli musiałyby być dynamicznie podmieniane (odświeżany #container rozumiem), a skrypt "wykresowy" sukcesywnie wywoływany.

1 użytkowników online, w tym zalogowanych: 0, gości: 1