wspólny rysunek/rysowanie na żywo

Question

Nie byłem pewien, w którym miejscu na świecie mógłbym opublikować ten ... Więc mam pomysł na wykonanie małej zabawki do rysowania, ale nie jestem pewien, w jaki sposób mógłbym to zaimplementować (na poziom struktury danych) ...

Chciałbym mieć okno 1920 x 1080, w którym mogę mieć pędzel i rysować linie (tak jak farba), ale tutaj jest kopacz. Chcę móc zapisać ten rysunek w czasie rzeczywistym. Chodzi o to, że mogę otworzyć przeglądarkę internetową i obserwować, jak rysuję z innego okna ... w zasadzie na zasadzie współpracy.

Czy to już zostało zrobione i czy są jakieś projekty, które każdy może mi wskazać, w jaki sposób mogę zacząć to rozwijać?

Podobny post był do tego, ale miał trzy lata i chciałbym otrzymać jakiś nowy wkład.

Największym pytaniem jest szczególnie najlepsza struktura danych można używać do przechowywania tego w bazie danych do edycji w czasie rzeczywistym (lub jeśli jest to nawet dobre rozwiązanie)

dzięki !! :)

Answer 1

Byłoby to stosunkowo proste do zrobienia.

Z aspekcie opartej internetowej ...

Można użyć coś jak HTML5 Canvas.

Następnie można użyć JavaScript i zrobić coś takiego:

document.onmousemove = function(event){ 
xcoor = event.pageX; 
ycoor = event.pageY; 
} 

przechwytywanie ruchów myszy, gdy poruszasz myszą.

Można również użyć kodu położyć koło lub kwadrat (kwadrat w tym przypadku, ale można użyć koło łatwo) w następujący sposób:

document.onmousemove = function(event){ 
xcoor = event.pageX; 
ycoor = event.pageY; 
mapcan.fillStyle = "#000000"; 
mapcan.fillRect(-1*(11617845.3461), -1*(8093417.14653), 10, 10); 
} 

Teraz można użyć PHP lub inny język, aby wstawić łączy się z bazą danych.

Próba wykonania edycji na żywo dla wielu użytkowników jest w najlepszym wypadku skomplikowana. Sugerowałbym zamiast tego trzymanie się widoku na żywo.

Chociaż wymaga to dużej ilości zasobów, będzie działać.

Mam nadzieję, że to pomoże, jeśli zdecydujesz się go zbudować!