Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [jQuery] siatka
Forum PHP.pl > Forum > Przedszkole
by_ikar
Witam, nie znalazłem podobnego tematu na forum, więc postanowiłem założyć nowy. Od kilku dni borykam się z problemem siatki, najprościej będzie mi to wytłumaczyć na zasadzie gry w statki. Mamy siatkę 10x10 składającą się z 100 pól. Mój problem polega na tym, że przykładowo w grze w statki, można ustawić sobie statek poziomo jak i pionowo. Na kartce łatwo jest wyznaczyć jego kordy i określić jakby "wielkość" statku. Powiedzmy 4 masztowy statek 1x4 i wiemy że jest poziomo cztery razy. 4x1 i wiemy że jest pionowy, 2x2 i jest kwadratem. Chodzi mi właściwie tylko o samo określenie tej jakoby "wielkości" czyli 2x2, 1x4 i tym podobne. Całość chciałbym wykonać za pomocą jquery, żeby można było sobie zaznaczyć dany element i wtedy gdzieś chciałbym wyciągnąć właśnie tą informację. Nie wiem w sumie kompletnie jak się do tego zabrać, zliczyć elementy mogę, ale jak to zliczyć żeby wiedział kiedy jest pionowy, to stanowi dla mnie, póki co największy problem.

Jeżeli ktoś jest mi w stanie jakoś pomóc, byłbym wdzięczny wink.gif

PS. każdy element to jest zwykły div który ma ID od 1 do 100.
maviozo
Kiedyś robiłem podobny projekt z tym, że pól nie było dziesięć w rzędzie, tylko 8. Stanowiło to problem przy obliczeniach, dlatego wtedy tworzyłem sobie model "abstrakcyjny" do obliczeń, natomiast samo wyświetlanie realizował inny skrypt. Pola gry przedstawiała tablica dwuwymiarowa pole[5][6] oznaczało 5 wiersz 6 kolumnę. W przy takim oznaczeniu dość prosto sprawdzać co sąsiaduje z obiektem. W Twoim przypadku zrobiłbym coś w tym stylu:
Kod
if (pole[x-1][y]==statek||pole[x+1][y]==statek)//statek leży pionowo
else if (pole[x][y-1]==statek||pole[x][y+1]==statek) //statek leży pionowo
Oczywiście jest to uproszczenie, dla sprawdzenia, czy statek "jest kwadratem" musisz sprawdzić 8 sąsiadujących pól. Co do sprawy, iż masz 100 divów, obliczenie odbywa się na podobnej zasadzie
Kod
if (id-1==statek||id+1==statek) else if (id-10==statek||id+10==statek)
Aczkolwiek wygodniej jest pracować na tablicy. Oczywiście zmienna statek może oznaczać 1, pudło 2, pole bez interakcji 0. itp.
by_ikar
Nie do końca chodzi mi o statki, lecz działanie ma być bardzo zbliżone. Cały problem polega na tym że musiałbym to zrobić w JS, dodać do tego jakieś warunku które by sprawdzały że dane zaznaczone pola, nie mogą mieć kształtu innego niż kwadrat/prostokąt. To co podałeś sprawdzi się moim zdaniem tylko przy wersjach [1][n] oraz [n][1], a to może być dowolny kwadrat/prostokąt więc może być nawet [10][10].

Najgorsze z tego wszystkiego jest chyba aby nie zaznaczył ktoś innego pola niż kwadrat/prostokąt.. i chyba sobie tą kwestię odpuszczę wink.gif A co do sposobu z tablicami, to chyba spróbuje to trochę przerobić i zobaczymy co z tego wyjdzie.

Nie mniej dzięki za pomoc smile.gif
CuteOne
Ja bym to zrobił troszkę inaczej.
- każdemu obiektowi nadać id
- zarówno początek jak i koniec obiektu posiadają "flagi"

Dzięki temu obiekty mogą wyglądać tak:
Kod
[][][][]
     [][][][][]

[][]
   []

itd...


Samo rozróżnienie czy leż pionowo/poziomo to kwestia dopasowania położenia flag wzg siebie

Kod
// przykładowe położenie obiektu o id 2
tab[2][1][5] = 1; // 1 oznacza flagę start
tab[2][2][5] = 2; // 2 to normalne pole obiektu
tab[2][3][5] = 2;
tab[2][4][5] = 3; // 3 oznacza flagę końca

if(tab[id][x][y] == 1 && tab[id][x+3][y]==3)- pion
if(tab[id][x][y] == 1 && tab[id][x][y+3]==3)- poziom

if(tab[id][x][y] == 1 && tab[id][x+3][y+1]==3)- pion o dziwnym kształcie
if(tab[id][x][y] == 1 && tab[id][x+1][y+3]==3)- poziom o dziwnym kształcie


Całość zamknąć w switch i po problemie wink.gif
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.