(X)HTML, JavaScript, DHTML, XML, CSS Client scripting tehnologije, Dynamic HTML, Cascading Stylesheets, XML i standardi |
|
Alati teme | Način prikaza |
23. 07. 2013. | #1 |
profesionalac
Professional
Datum učlanjenja: 25.10.2012
Poruke: 278
Hvala: 16
32 "Hvala" u 9 poruka
|
Odredjivanje pozicije div-a
Imam tabelu http://jsfiddle.net/6QhuF/ i divovi su razbacani na sve strane i sad mi je potrebno da znam na osnovu njihove top i left poziije ko je na kom mestu u toj tabeli.
Preko DOM analize se ne moze doci do pozicija zato moram da koristim top i left pa me zanima postoji li neka matematicka formula kojom bi to odredio. Znaci imam .draggable divove sa razlicitim top i left vrednstima i moram da znam ko je na najvisoj poziciji a ko najnize u tabeli. (ja sam pokusao u pocetku da mnozim top*left i da ondak pravim redosled ali je to glupo i netacno naravno) Poslednja izmena od mslavko : 23. 07. 2013. u 15:59. |
23. 07. 2013. | #2 |
profesionalac
Professional
Datum učlanjenja: 25.10.2012
Poruke: 278
Hvala: 16
32 "Hvala" u 9 poruka
|
Pojednostavljeno:
Formula za sortiranje ovih tacaka: |
23. 07. 2013. | #3 |
Ivan Dilber
Sir Write-a-Lot
|
ako pozicije u tabeli definises po redosledu kao u html source-u, onda treba prvo sortirati po floor(Y / visina_reda_tabele), pa onda tacke unutar svakog reda po X.
__________________
Leadership is the art of getting people to want to do what you know must be done. |
24. 07. 2013. | #4 |
profesionalac
Professional
Datum učlanjenja: 25.10.2012
Poruke: 278
Hvala: 16
32 "Hvala" u 9 poruka
|
Pa da upravu si, hvala
tableHeight/tableRows pa se onda dobijaju skupovi tacaka a koje se dalje lako sortiraju po x osi... |
29. 07. 2013. | #5 | |
profesionalac
Professional
Datum učlanjenja: 25.10.2012
Poruke: 278
Hvala: 16
32 "Hvala" u 9 poruka
|
code
Da ne tvaram novu temu nadovezacu se na ovo, Ja sam pokusao problem da resim ovako:
Kôd:
var arrayOfDivs = []; //izdvajam sve divove iz tabele i njihove pozicije top i left $("#table .draggable").each(function(index, item){ var lat = $(item).attr("lat"); var lng = $(item).attr("lng"); var top = $(this).position().top; var left = $(this).position().left; arrayOfDivs.push({topPosition : top, leftPosition: left, lat : lat, lng : lng}); }); //kreiram osnovne varijable potrebne za funciju koja sledi var height = $('table').height(); var rowsCount = $('table tr').length; var ROW_HEIGHT = height/rowsCount; var rows = []; //racuna se u kom redu se nalazi koji div i dodaje se u novi array for(var i = 0; i < rowsCount; i++) { rows[i] = []; } for(var i = 0; i < arrayOfDivs.length; i++) { var position = arrayOfDivs[i]; var rowNumber = Math.floor(position.topPosition / ROW_HEIGHT); //PROBLEM SE JAVLJA OVDE rows[rowNumber].push(position); } for(var i = 0; i < rowsCount; i++) { rows[i].sort(function(a, b) { return a.leftPosition - b.leftPosition; }); } console.log(JSON.stringify(rows, null, 3)); Citat:
Kod: http://jsfiddle.net/u58k6/10/ Poslednja izmena od mslavko : 29. 07. 2013. u 03:26. |
|
29. 07. 2013. | #6 |
banned
Professional
Datum učlanjenja: 04.06.2005
Poruke: 371
Hvala: 0
738 "Hvala" u 83 poruka
|
Problem je u tome što je pozicija nekih .draggable elemenata negativna, odnosno zato što se elementi nalaze izvan .ui-droppable elementa.
Sa kodom: Kôd:
var rows = []; for(var i = 0; i < rowsCount; i++) { rows[i] = []; } Kôd:
for(var i = 0; i < arrayOfDivs.length; i++) { var position = arrayOfDivs[i]; var rowNumber = Math.floor(position.topPosition / ROW_HEIGHT); rows[rowNumber].push(position); } Možeš na primer da umesto što .draggable elemente sortiraš u odnosu na top-left poziciju, sortiraš ih u odnosu centar elementa (vertikalna i horizontalna sredina) ili videti zašto .draggable elementi izlaze izvan .ui-droppable elementata ili je to normalno ponašanje.
__________________
Don't look at me; I'm lost too. “If you can't dazzle them with brilliance, baffle them with bul*s**t.” |
29. 07. 2013. | #7 |
profesionalac
Professional
Datum učlanjenja: 25.10.2012
Poruke: 278
Hvala: 16
32 "Hvala" u 9 poruka
|
Hvala na objasnjenju ali dodao sam:
var top = $(this).position().top + 200; kako top pozicija nikad ne bila negativna, ali open isto. U ovom primeru nema negativnih pozicija: http://jsfiddle.net/u58k6/16/embedded/result/ ali opet consola prikazuje: rows[rowNumber].push(position); Uncaught TypeError: Cannot call method 'push' of undefined Poslednja izmena od mslavko : 29. 07. 2013. u 19:58. |
29. 07. 2013. | #8 |
banned
Professional
Datum učlanjenja: 04.06.2005
Poruke: 371
Hvala: 0
738 "Hvala" u 83 poruka
|
Uzmimo npr. poslednji .draggable elemenat, čija je top pozicija 361px, pa tada imamo:
Kôd:
var rowNumber = Math.floor(position.topPosition / ROW_HEIGHT); Kôd:
var rowNumber = Math.floor((361 + 200) / 60.7); Kôd:
var rowNumber = 9 Kôd:
undefined.push(position)
__________________
Don't look at me; I'm lost too. “If you can't dazzle them with brilliance, baffle them with bul*s**t.” |
30. 07. 2013. | #9 | |
profesionalac
Professional
Datum učlanjenja: 25.10.2012
Poruke: 278
Hvala: 16
32 "Hvala" u 9 poruka
|
Nasao sam resenje Kod mene funcionise:
Citat:
|
|
30. 07. 2013. | #10 |
banned
Professional
Datum učlanjenja: 04.06.2005
Poruke: 371
Hvala: 0
738 "Hvala" u 83 poruka
|
Drago mi je da si našao rešenje, mada kada u gornje navedeni kod dodam ovo rešenje, kao izlaz dobijam:
Kôd:
[ [ { "topPosition": -3, "leftPosition": 54 }, { "topPosition": 57, "leftPosition": 197 }, { "topPosition": -3, "leftPosition": 245 }, { "topPosition": 57, "leftPosition": 330 } ], [], [ { "topPosition": 178, "leftPosition": 147 }, { "topPosition": 178, "leftPosition": 286.46875 }, { "topPosition": 178, "leftPosition": 454 } ], [], [ { "topPosition": 302, "leftPosition": 373.46875 } ], [ { "topPosition": 361, "leftPosition": 480 } ], [] ]
__________________
Don't look at me; I'm lost too. “If you can't dazzle them with brilliance, baffle them with bul*s**t.” Poslednja izmena od Br@nkoR : 30. 07. 2013. u 08:35. |
|
|