Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

> [PHP][AJAX] Rysowanie jak w paincie, Primo: Czy da się to zrobic? :D
fenix.robi
post
Post #1





Grupa: Zarejestrowani
Postów: 97
Pomógł: 7
Dołączył: 24.06.2008

Ostrzeżenie: (0%)
-----

Witam,

Chciałbym napisać cos w stylu internetowego painta opartego na ajax'ie i php, cos w ten deseń:

http://www.pixlr.com/editor/?loc=pl

tylko nie we flash'u.

1. Czy to jest możliwe.

2. Czy jest już może jakaś biblioteka ajax'a ktora oferuje obrobke grafiki etc.

3. Jeśli macie jakieś materiały, tutoriale bardziej szczegułowe pod tem temat bardzo bym był wdzieczny

PS. http://pl.lmgtfy.com/?q=ajax-image-draw & http://pl.lmgtfy.com/?q=ajax-image-editor szukałem



Na poczatek chciałem zrobić zwykłe rysowanie po utworzunym obrazku 

- tworze obrazek funkcją createimage() w php i go wyswietlam w przegladarce gdzie lewy gorny róg jest zawsze w tej samej odległości od punktu 0px; 0px przegladarki

- na obrazku sprawdzam zdarzenie onClick i jesli jest ono w obszarze obrazka to rysuje kropke funkcja imagesetpixel() we wpółrzednych myszki, i sprawdza czy wspolrzedne są rózne od poprzednich, jesli tak to rysuje nastepny pixel, oczywiśćie dziala dopóki klawisz myszy jest nacisniety.

na poczatek chciałeby cos takiego jak w tej grze: http://www.gry.jeja.pl/652,zbiorowe-rysowanie.html 

Jesli popełniłem jakiś błąd w algorytmie i jesli da się go wykonać to bedę wdzieczy za pomoc/propozycjie/rady

edit: ahh mysłem ze pisze w dziale [xml/ajax] jesli to nie sprawi problemu to prosze o przeniesienie do tego dzialu (IMG:http://forum.php.pl/style_emoticons/default/biggrin.gif)

Ten post edytował fenix.robi 25.03.2009, 20:25:01
Go to the top of the page
+Quote Post
 
 Start new topic
Odpowiedzi (1 - 2)
erix
post
Post #2





Grupa: Moderatorzy
Postów: 15 467
Pomógł: 1451
Dołączył: 25.04.2005
Skąd: Szczebrzeszyn/Rzeszów
Cytat
- na obrazku sprawdzam zdarzenie onClick i jesli jest ono w obszarze obrazka to rysuje kropke funkcja imagesetpixel() we wpółrzednych myszki, i sprawdza czy wspolrzedne są rózne od poprzednich, jesli tak to rysuje nastepny pixel, oczywiśćie dziala dopóki klawisz myszy jest nacisniety.

Raczej onmousedown/up. Z przekazaniem punktów do PHP nie byłoby problemu, gorzej chyba z wyświetlaniem po stronie klienta. I tu zostaje w zasadzie tylko <canvas />, ale to wyklucza IE z użytku. Niestety, więcej nie pozostaje nic prócz Flasha/apletu w Javie.

Cytat
edit: ahh mysłem ze pisze w dziale [xml/ajax] jesli to nie sprawi problemu to prosze o przeniesienie do tego dzialu

Twój problem, to raczej DHTML, nie AJAX. (IMG:http://forum.php.pl/style_emoticons/default/tongue.gif)
Go to the top of the page
+Quote Post
fenix.robi
post
Post #3





Grupa: Zarejestrowani
Postów: 97
Pomógł: 7
Dołączył: 24.06.2008

Ostrzeżenie: (0%)
-----

Dopiero zająłem sie tym skryptem, lecz natrafiłem na pewne trudnosci, funkcja onmousedown nie wywołuje mi funkcji rysuj, gdy dam jak w przykładach onmousedown="alert('cos tam ');" to wyswielta komunikat, a jesli chcem dac onmoisedown="rysuj();" to nic nie pokazuje, nie wiem czy mam cos przekazywac w funkcji i jakie "krzaki" dalej napisałem, a oto kod:

index.php

[PHP] pobierz, plaintext 
  1. <?php session_start(); ob_start();
  2. if (!file_exists("./grafika/obrazek.jpg"))
  3.  include("./inc/nowy.inc.php");
  4. ?>
  5. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  6. "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  7. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pl">
  8. <head>
  9.  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  10.  <link rel="stylesheet" type="text/css" href="main.css" />
  11.  <title>::Rysowanie::</title>
  12.  <script type="text/javascript">
  13.  // <!-- <![CDATA[ 
  14.  function rysuj_start()
  15.  {
  16.      var mysz_x = event.clientX -50; //poniewaz rysunek zaczyna się od wspoóarzednych 50,50 
  17.      var mysz_y = event.clientY -50; //narazie na sztywno
  18.      window.location= './inc/rysuj.inc.php?x='mysz_x'&y='mysz_y;     
  19.  }
  20.  function rysuj_stop()
  21.  { 
  22.      window.opener.location.reload();
  23.      alert("Powinno cos powstac");
  24.   
  25.  }
  26.  function rysuj(handler, event)
  27.  { 
  28.      document.addEventListener('mousemove', rysuj_start(), true);
  29.      document.addEventListener('mouseup', rysuj_stop(), true);
  30.  }
  31.  // --> ]]>
  32.  </script>
  33. </head>
  34. <body id="body">
  35.  <div id="srodek">
  36.          <img src="./grafika/obrazek.jpg" onmousedown="rysuj();"/>
  37.  <div>
  38. </body>
  39. </html>
[PHP] pobierz, plaintext
rysuj.inc.php

[PHP] pobierz, plaintext 
  1. <?php session_start(); ob_start();
  2.  $x = $_GET['x'];
  3.  $y = $_GET['y'];
  4.  $sciezka = "../grafika/obrazek.jpg";
  5.  $img   = imagecreatefromjpeg($sciezka)
  6.  or die("Nie można otworzyc obrazka");  
  7.  $pixel  = ImageColorAllocate($img, 0,0,0); 
  8.  imagesetpixel($img,$x,$y,$pixel);
  9.  imagesetpixel($img,$x-1,$y,$pixel);
  10.  imagesetpixel($img,$x+1,$y,$pixel);
  11.  imagesetpixel($img,$x,$y-1,$pixel);
  12.  imagesetpixel($img,$x,$y+1,$pixel);
  13.  ImageJPEG($img,$sciezka, 100);
  14.  imagedestroy($img);
  15.  header("Location: ../index.php"); // (IMG:http://forum.php.pl/style_emoticons/default/questionmark.gif) 
  16. ?>
[PHP] pobierz, plaintext
Go to the top of the page
+Quote Post
« Następny starszy · Przedszkole · Następny nowszy »
 

Reply to this topicStart new topic
2 Użytkowników czyta ten temat (2 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 

Tryb wyświetlania: Przełącz na: Standardowy · Linearny+ · Przełącz na: Drzewo

Śledź ten temat · Wyślij temat na e-mail · Wydrukuj ten temat · Subskrybuj to forum

RSS Aktualny czas: 22.08.2025 - 19:45
Powered By IP.Board © 2025  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn