javascript & html5 προβλημα με εμφανιση id

[slevinkelevra]

γεια σας...

φτιαχνω ενα site και χρησιμοποιω html5 canvas ο οποιος γινεται διαδραστικος με js...

 

εχω μια function που φτιαχνει objects, ουσιαστικα τυπωνει τετραγωνακια στον canvas...

τα objects εχουν διαφορες ιδιοτητες οπως x,y για το που θα τυπωθουν και ενα μοναδικο id, με το οποιο, αν γινει κλικ στο object, θελω να to "πιανω" και να κανω query στη db...

 

το προβλημα ειναι οτι δεν μπορω να εμφανισω με τιποτα το id του καθε στοιχείου...

εχω βρει 2 τροπους αλλα δεν με καλυπτουν :

 

1-υπαρχει η getImageData που φερνει πληροφοριες για το χρωμα των pixel τα οποια κλικαριστικαν...οποτε με if τσεκαρω αν εκει που εγινε κλικ ηταν μαυρο, οποτε ξερω οτι ηταν ενα στοιχείο (μιας και ειναι ολα μαυρα)...απλα δεν μπορω να "πιασω" το id γιατι η getImageData φερνει πληροφοριες μονο για το χρωμα...

 

2-μεσα στη function που φτιαχνει τα στοιχεια βαζω

>this.onclick=alert(this.id);

μου τα εμφανιζει ολα στη σειρα πριν καν φορτωσει ολη η σελιδα και πριν εμφανιστει ο canvas με τα γραφικα...

αυτο πιστευω εχει να κανει καθαρα με js...

 

και πανω απ ολα να θυμισω οτι ο canvas δεν εχει "μνημη", δηλαδη φτιαχνεις κατι με js, το τυπωνεις, το ζωγραφιζει, και μετα τελος, σαν να μην εγινε ποτε, δεν κραταει id με καποιο τροπο

 

πλιζ παιδια βοηθηστε...και αν θελετε διευκρινιση παραπανω, πειτε

 

thanxz

[prekageo]

Ρίξε μία ματιά στην εξής έννοια:

 

http://en.wikipedia.org/wiki/Hit-testing

 

Εν ολίγοις, πρέπει εσύ να αντιστοιχίσεις το Χ και το Υ στο id. Δε μπορεί να το κάνει το canvas για σένα. Μία λύση είναι να στραφείς στο SVG αλλά δεν ξέρω αν θα σε καλύψει.

[slevinkelevra]

χμ...thanxz...αλλα κοιτα, δεν παιζει svg γιατι δεν ειναι στις προδιαγραφες του εργου...

ναι προσπαθω manually να αντιστιχισω το κλικ με το σημειο που υπαρχει καποιο object

αλλα οτι λυση εχω βρει μεχρι τωρα απλα σου λεει οτι "ναι εγινε κλικ σε ενα τετραγωνο" πχ...

εγω που εχω 500, πως θα τα ξεχωρισω? οτι μεθοδο εχω τσεκαρει μεχρι τωρα (και ξεμενω και απο μεθοδους σιγα σιγα)

φτανει μεχρι εκει...δεν "παινει" το id...και αυτο ειναι που χρειαζομαι για να κανω επειτα query στη βαση

[defacer]

Καταρχήν να πω ότι δεν φαίνεται να έχεις σκεφτεί τι γίνεται στην περίπτωση που κάνουν overlap πολλά τετράγωνα στο ίδιο pixel (ή ενδεχομένως ξέρεις κάτι παραπάνω και δε μας το λες).

 

Δεύτερον, αντί να φας τα συκώτια σου για να κάνεις μόνος σου το hit testing, μήπως παιδεύεσαι ενώ δε χρειάζεται;

 

Αν όλα τα σχήματα που έχεις είναι τετράγωνα, δε χρειάζεται canvas και μπορείς κάλλιστα να έχεις absolutely positioned divs μέσα σε κάποιο container, στην οποία περίπτωση βάζοντας click event στο καθένα θα έχεις έτοιμο στο πιάτο το element που έγινε κλικ. Αν πρόκειται να έχεις πολλά και δεν θέλεις να βάλεις 1000 click handlers, μπορείς με jQuery να κάνεις delegate το click event και στην ουσία να αφήσεις έτσι το jQuery να κάνει μόνο του το hit testing για σένα.

[slevinkelevra]

so... defacer, we meet again...

πλακα κανω, hello

overlaping ε?ναι ειμαι και πολυ μπροστα, δεν το ειχα σκεφτει καν

μιας και φτιαχνω χαρτη με zoom, οποτε στο zoom παιζει και το overlaping...οχι ρε μαμωτο

τεσπα, οι προδιαγραφες τις εργασιας απαιτουν να γινει html5, οποτε θεωρησα λογικο εξ αρχης να χρησιμοποιησω canvas

στο canvas ειναι πανευκολο να κανεις zoom, στο conteiner πως θα κανω zoom στην εικονα?

καμια ιδεα?μηπως και ξεκινησω κατι αντιστοιχο και σωθω????

 

και ναι, σωστα το εθεσες εχω οντως φαει τα συκωτια μου

 

thanxz