Witam! Piszę grę na zaliczenie w javascript. Ładuję obrazek .gif z dysku np. 50x50px i potrzebuję aby wydobyć 4 piksele z tego obrazka i wyświetlenie ich w takiej formie (cztery kolorowe kwadraciki w kwadracie). Czy ma ktoś jakiś pomysł jak to zrobić?
No możesz zrobić div'a 4x4 i w tym divie przesunąć obrazek np. potrzebujesz 20-24x20-24 to przesuwasz ten obrazek top, left na 20 i masz te 4x4 ale nie wiem czy o to ci chodziło
@konrados:
Szkoda, że seba Ci nie odpisał, bo niby coś takiego mogłoby mu pomóc, ale z drugiej strony, jeśli chciałby np. przeskalować te 4 piksele tak, żeby wyświetlić je jako większe kafelki lub gdyby chciał z nich zrobić cokolwiek bardziej użytecznego, to potrzebowałby czegoś innego...
@seba25:
A w jakich przeglądarkach ma to działać?
W nowoczesnych może pomóc Ci obiekt canvas
. Służy do rysowania obrazków piksel po pikselu; umożliwia też pobranie koloru piksela o danych współrzędnych. Ma też funkcję drawImage()
, która rysuje na canvasie obrazek z elementu img
(czyli np. GIF-a) -- i wtedy możesz pobrać kolor danego piksela za pomocą normalnego interfejsu canvasa.
Masz to opisane np. tutaj:
http://stackoverflow.com/questions/1041399/how-to-use-javascript-or-jquery-to-read-a-pixel-of-an-image
Nawet w IE, gdzie nie ma natywnego wsparcia dla canvasa, można użyć biblioteki explorercanvas: http://code.google.com/p/explorercanvas/downloads/list Nie pamiętam, czy wspiera drawImage()
, ale możesz spróbować.