| mslavko |
23. 07. 2013. 15:56 |
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) |
| mslavko |
23. 07. 2013. 17:40 |
Pojednostavljeno:
Formula za sortiranje ovih tacaka:
 |
| ivanhoe |
23. 07. 2013. 21:23 |
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.
|
| mslavko |
24. 07. 2013. 01:22 |
Pa da upravu si, hvala
tableHeight/tableRows pa se onda dobijaju skupovi tacaka a koje se dalje lako sortiraju po x osi...
|
| mslavko |
29. 07. 2013. 03:22 |
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));
medjutim moze li neko da mi pomogne i kaze kako da resim probem koji se javlja a to je: u Consoli pise
Citat:
" Uncaught TypeError: Cannot call method 'push' of undefined"
|
Kod: http://jsfiddle.net/u58k6/10/ |
| Br@nkoR |
29. 07. 2013. 11:37 |
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] = [];
}
kreiraš prazan dvodomenzionalni niz, pri čemu je i od 0 do 6, zatim pomoću koda:
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);
}
"puniš" gornji rows niz podacima, ali pošto je top pozicija nekih elemenata negativna, tako je i rowNumber negativan, pa je rows[rowNumber] nedefinisan, i onda u nedefinisan niz pokušavaš da ubaciš novi član.
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. |
| mslavko |
29. 07. 2013. 19:30 |
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
|
| Br@nkoR |
29. 07. 2013. 20:33 |
Uzmimo npr. poslednji .draggable elemenat, čija je top pozicija 361px, pa tada imamo:
Kôd:
var rowNumber = Math.floor(position.topPosition / ROW_HEIGHT);
odnosno:
Kôd:
var rowNumber = Math.floor((361 + 200) / 60.7);
dobijamo da je:
Kao što sam u prethodnoj poruci naveo, kod rows[i] i ide od 0 do 6, pa takođe pokušavaš:
Kôd:
undefined.push(position)
|
| mslavko |
30. 07. 2013. 02:14 |
Nasao sam resenje :) Kod mene funcionise:
Citat:
if(rowNumber<0){ rowNumber = 0; }
|
|
| Br@nkoR |
30. 07. 2013. 08:30 |
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
}
],
[]
]
gde se vidi npr. da dan 1 ima 4 elementa ili treba da ima 2, a npr i raspored je malo problematičan 132456789, ili ja nisam nešto dobro razumeo. |
| Vreme je GMT +2. Trenutno vreme je 02:23. |
|
Powered by vBulletin® Verzija 3.6.8
Copyright ©2000 - 2024, Jelsoft Enterprises Ltd.
Copyright © DevProTalk. All Rights Reserved.
Mišljenja, saveti, izjave, ponude ili druge informacije ili sadržaji nastali na Sajtu su vlasništvo onoga ko ih je kreirao, a ne DevProTalk.com, tako da ne morate da se oslanjate na njih.
Autori poruka su jedini odgovorni za ovakve sadržaje. DevProTalk.com ne garantuje tačnost, kompletnost ili upotrebnu vrednost informacija, stavova, saveta ili datih izjava. Ne postoje uslovi pod kojima bi mi bili odgovorni za štetu ili gubitak koji je posledica bilo čijeg oslanjanja na nepouzdane informacije, ili bilo kakve informacije nastale kroz komunikaciju između registrovanih članova.Web sajt može sadržavati linkove na druge web sajtove na Internetu ili neke druge sadržaje. Ne kontrolišemo niti podržavamo te druge web sajtove, niti smo pregledali bilo kakve sadržaje na takvim sajtovima. Mi nećemo biti odgovorni za legalnost, tačnost ili prikladnost bilo kog sadržaja, oglasa, proizvoda, usluga ili informacije lociranim na ili distribuiranih kroz druge web sajtove, niti za bilo kakvu štetu nastalu kao posledica takvih informacija. DevProTalk.com drži i čuva druga prava vlasništva na web sajtu. Web sajt sadrže materijale zaštićene copyright-om, zaštitne znakove i druge informacije o pravu vlasništva ili softver. Članovi mogu poslatu informacije zaštićene pravima vlasništva njihovih nosilaca i ona ostaju zaštićena bez obzira da li su oni koji prenose te informacije to naveli ili ne. Osim informacija koje su u javnom vlasništvu ili za koje dobijete dozvolu, nemate pravo da kopirate, modifikujete ili na bilo koji način menjate, objavljujete, prenosite, distribuirate, izvršavate, prikazujete ili prodajte bilo koju informaciju zaštićenu pravima vlasništva. Slanjem informacija ili sadržaja na bilo koji deo DevProTalk.com, Vi automatski dozvoljavate i predstavljate garanciju da imate pravo da dozvolite DevProTalk.com ili članovima DevProTalk.com bespovratnu, kontinualnu, neograničenu, globalnu dozvolu da koriste, kopiraju, izvršavaju, prikazuju i distribuiraju takve informacije i sadržaje i da iz takvih sadžaja koriste bilo koji deo u bilo koje svrhe, kao i pravo i dozvolu da koriste gore navedene sadržaje. Svi zaštitni znakovi (trademarks), logotipi, oznake usluga, firme ili imena proizvoda koji se pominju na ovom web sajtu su vlasništvo kojim raspolažu njihovi vlasnici.
