Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [JavaScript][PHP][XML] Stworzenie XML, a później pętla w JS
Forum PHP.pl > Forum > Przedszkole
zasadowy
Cześć, zrobiłem sobie w PHP skrypt, który ściągane dane z tabeli i tworzy XML, ale tutaj mam problem, bo struktura mojego XML chyba nie jest odpowiednia:

  1. <countries>
  2. <country>
  3. <iso>af</iso>
  4. <visitors>5</visitors>
  5. </country>
  6. <country>
  7. <iso>ax</iso>
  8. <visitors>4</visitors>
  9. </country>
  10. <country>
  11. <iso>al</iso>
  12. <visitors>0</visitors>
  13. </country>
  14. </countries>


Następnie w JS, powinna być pętla, która leci przez wszystkie kraje po kolei, najpierw pobiera ich ISO, a następnie jeśli np. visitors > 50, to zmienia tło elementu z takim ID jak ma ISO na czarny, jesli visitors < 50, to zmienia na szary. No i nie wiem jak zrobić to tak, aby pętla działała tak jak napisałem. Kombinuję, kombinuję i nic na nic nie mogę wpaść, bo krajów z kodem ISO jest 249, więc najlepiej byłoby to zrobić pętlą, a nie kopiować kod 249 razy i zmieniać iso na af, ax, au, al itd...
maviozo
Czemu nie możesz użyć JSON? Jeżeli to jedyne dane, to można zrobić np. tak:
Kod
{
"af":5,
"ax":4,
"al":0
}
Dostęp do takich danych jest śmiesznie łatwy:
Kod
for (var i in countries)


Natomiast jeśli więcej danych to można też na conajmniej dwa sposoby:
Kod
{
"af":{
"name":"",
"visitors":5},
"ax":{
"cośtam":"",
"visitors":3}
}
Względnie jeśli chcesz w tablicy, to:
Kod
[
{
"iso":"af",
"visitors":5"
},{
"iso":"ax",
"visitors":4}
]
jQuery ma obsługę JSON przez AJAX, chodzi jak złoto. Wszystko w zasadzie podane na tacy, nie musisz niczego więcej robić.
Crozin
Pokaż jak próbowałeś stworzyć tą pętlę. Struktura XML-a jest poprawna, nie powinieneś mieć z niczym problemu.
zasadowy
nie no, to są jedyne dane, po prostu mam kod iso kraju, np. pl i liczbę osób z danego kraju aktualnie na stronie.
{"iso_countries":[{"af":"0"},{"ax":"0"},{"al":"0"} itd...]} to jest budowa mojego pliku json teraz jak go otworzyłem

no i teraz powinienem przejść przez wszystkie elementy w ciągu iso_countries, to ok, zadeklaruję sobie, że i=0 czyli początek ciągu, no i for aż dojdzie do 248, ale teraz jest pytanie, jak jestem w 1 elemencie ciągu, to powinienem wziąć jakoś af z niego i jego wartość, czyli 0, bo jeśli np af będzie mieć 50, to będę musiał zrobić getEmelentByID, aby zmienić mu kolor, to będę do jakiejś zmiennej musiał przypisać aktualną zawartość ciągu, czyli kod iso i visitors, aby w razie czego, jeśli visitors jest > 0, to znajdź ID z takim kodem iso, jaki jset przypisany teraz do zmiennej. To już tego nie łapie, jak to zrobić.
zasadowy
No i jeszcze do tamtego, to czytałem właśnie, że jQuery obsługuje JSON bez problemu, dlatego na początku chciałem tak to zrobić, ale na innym forum polecili mi XML wink.gif
Crozin, problem w tym, że ja nie mam pojęcia, jak taką pętlę zrobić, dlatego tutaj się odezwałem, wiem jak wziąć dane, zrobić sobie XML, lub JSON, ale jak zrobić pętle na podstawie tych danych, to już dla mnie czarna magia...
Crozin
https://www.google.pl/search?q=javascript+t...93&ie=UTF-8 - standardowe operacje na drzewie DOM.
zasadowy
Zrobiłem to z JSON, no i struktura JSON jest

{"iso_countries":[{"country":"af","visitors":"0"},{"country":"ax","visitors":"0"},{"country":"al","visitors":"0"} ... itd ]}

Taki mam kod jak patrzyłem na przykładach rozwiązań z internetu, no i wiem, że nie działa, bo kolor w SVG się nie zmienia, wiecie co jest nie tak?

  1. $(document).ready(function()
  2. {
  3. $.getJSON("results.json", function(data)
  4. {
  5. for(var key in json)
  6. {
  7. var iso = json[key].country;
  8. var visitors = json[key].visitors;
  9.  
  10. if( 50 > visitors > 1)
  11. {
  12. document.getElementById("iso").style.fill="#94d31b";
  13. }
  14. else if( 500 > visitors > 50)
  15. {
  16. document.getElementById("iso").style.fill="#94d31b";
  17. }
  18. }
  19.  
  20. });
  21. });
Crozin
1. Jakbyś włączył konsolę błędów, zobaczyłbyś prawdopodobnie komunikat, o próbie użycia nieistniejącej zmiennej json (chodziło Ci zapewne o data).
2. 50 > visitors > 1 taka składnia nie jest w ogóle poprawna.
zasadowy
hah no tak co do tego if'a biggrin.gif

$(document).ready(function()
{
$.getJSON("results.json", function(data)
{
for(var key in json)
{
var iso = data[key].country;
var visitors = data[key].visitors;

if( visitors > 1 && 50>=visitors)
{
document.getElementById(iso).style.fill="#94d31b";
}
else if( visitors > 50 && 500>=visitors)
{
document.getElementById(iso).style.fill="#94d31b";
}
}

});
});

ale i tak nie działa, nawet jak wstawię w ByID("pl"), aby zmieniło kolor, to kolor i tak się nie zmienia, dodam, że te ID jest w pliku SVG, może to dlatego? Poza tym, czy samo wstawienie (iso) jest poprawne w szukanie po ID?
Crozin
Cytat
1. Jakbyś włączył konsolę błędów, zobaczyłbyś prawdopodobnie komunikat, o próbie użycia nieistniejącej zmiennej json (chodziło Ci zapewne o data).
zasadowy
ech... no tak, poprawiłem to teraz smile.gif dzięki za cierpliwość wink.gif

Konsola nie zwraca już błędów, ale kolor się nie zmienia. Wrzuciłem document.getElementById(pl).style.fill="#94d31b"; przed if'a to pokazuje, że takiego elementu jak pl nie ma, a jak wstawiam do ifa to błędu nie ma, ale kolor i tak się nei zmienia, czyli if w ogóle jakby nie działał, bo gdyby działał, to wywaliłby ten sam błąd, że takiego elementu nie ma

  1. $(document).ready(function()
  2. {
  3. $.getJSON("results.json", function(data)
  4. {
  5. for(var key in data)
  6. {
  7. var iso = data[key].country;
  8. var visitors = data[key].visitors;
  9.  
  10. if( visitors > 1 && 50>=visitors)
  11. {
  12. //sprawdzam, czy w ogóle if działa
  13. document.getElementById("pl").style.fill="#94d31b";
  14. }
  15. else if( visitors > 50 && 500>=visitors)
  16. {
  17. document.getElementById("iso").style.fill="#94d31b";
  18. }
  19. }
  20.  
  21. });
  22. });
Crozin
1. Twoje warunki wewnątrz IF-ów są trochę bez sensu, chyba pomieszały Ci się operatory większości i mniejszości.
2. "iso" to zwykły tekst, iso to zmienna.
3. W obu przypadkach nadajesz ten sam kolor.
zasadowy
Wiem, że nadaję ten sam kolor, bo skopiowałem to, aby w ogóle cokolwiek zmieniał. Musiałem nadać data = data.iso_countries, no i teraz przechodzi już przez if'a, no, ale teraz mam taki błąd

TypeError: document.getElementById(...) is null


(no source for debugger eval code)

  1. $(document).ready(function()
  2. {
  3. $.getJSON("results.json", function(data)
  4. {
  5. data = data.iso_countries;
  6. for(var key in data)
  7. {
  8. var iso = data[key].country;
  9. var visitors = data[key].visitors;
  10.  
  11. if( visitors > 1 && 50>=visitors)
  12. {
  13. document.getElementById(iso).style.fill="#94d31b";
  14. }
  15. else if( visitors > 50 && 500>=visitors)
  16. {
  17. document.getElementById(iso).style.fill="#94d31b";
  18. }
  19. }
  20.  
  21. });
  22. });
owca_82
Proszę bardzo wink.gif => http://jsbin.com/OsIpuTeF/1/edit
zasadowy
Dzięki! Jak będę przy laptopie to od razu sprawdzę to co podałeś na bin'ie smile.gif mam nadzieję, że bęzie trybić z SVG
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.