Czy da się w jakiś sposób stworzyć obrazek z kodu html. Mam edytor do tworzenia planu z góry. Po zakończonej pracy chciałbym zapisać stworzony plan jako obrazek. Jest to możliwe?

szukaj biblioteki do obrazkow w php

To też zależy, jaki format mają dane.

Nie chodzi mi o stworzenie obrazka w php, bo nie ma on takich możliwości. Format danych to powiedzmy:

[HTML] pobierz, plaintext 
<div class="pokoj">
 <img sec="szafa.gif">
</div>
[HTML] pobierz, plaintext 

A co rozumiesz poprzez stworzenie obrazka z kodu? Może SVG?

No tak, ale szafa.gif to jest obrazek, wiec w czym problem?

Chodzi mi mniej więcej o coś takiego:

Ułożyłem sobie pokój za pomocą edytora, mam podłogę, meble, ściany, a w kodzie są to divy, obrazki (img). Chciałbym teraz ten cały kod zapisać w postaci jednego obrazka o rozszerzeni .gif .jpg .png obojętnie. Taki jakby screen.

Magiczne hasło - html2jpg... Bez php to jedynie w js.

No własnie czegoś takiego szukam. Może być w PHP. Jakaś podpowiedź jak stworzyć taki skrypt?

A ja podałem Ci magiczne słowo, otwierające tajemne zasoby Google ;p

Ale czy w ogóle zrozumieliście co ja chcę osiągnąć? W google pod twoim "magicznym" słowem znajduję w większości programy do robienia zrzutów stron www, a mi potrzeba stworzyć funkcję którą po podaniu jej kodu html stworzy mi obrazek.

#Kamil Pietrzak
Uwierz mi że wiem co to biblioteka obrazków w php i póki co nie znalazłem / nie przypominam sobie żeby miała ona możliwość stworzenia obrazka z divów i kodu html.

musisz napisac posrednik
dane ustalone jsem i wyslane do php(albo jakos podobnie) - > posrednik -> biblioteka

No z wysyłaniem danych JSem, biblioteką sobie poradzę, ale interesuję mnie właśnie ten "pośrednik". W ogóle co masz na myśli?

jakis konwerter... danych ze strony na polecenia do biblioteki
konwerter dostanei dane na temat elementow, pozniej bedzie po kolei bazujac na tym robil obrazek
to wydaje mi sie w miare mozliwe, ale na pewno nie bedzie to robota na 5 minut
samo przekazanie danych ze strony do skryptu wydaje sie nielatwe, choc to tez zalezy od tego edytora na stronie i od tego co chcesz nim zrobic

w kazdym razie
powodzenia

Z przekazywaniem danych nie będzie żadnego problemu. No a co do tego konwertera, to wydaje się w miarę logiczne, no ale nadal nie wiem jak stworzyć obrazek z elementu htmla: DIV. To jest kluczowy problem z resztą sobie poradzę.

jam am na mysli przekazanie np. szerokosci, wysokosci, odleglosci od lewej, od gory, i innych parametrow do php
pozniej z tego co widzialem to, ta biblioteka mozna nietrudno zrobic np. prostokat o x i y wymiarach i o x i y polozeniu i tak po kolei z kazdym elementem
tylko moj kontakt z ta biblioteka konczy sie na ogladaniu kodu w ktorym byla uzywana, nie pracowalem na niej, wiec Ci nie pomoge z dokumentacja

A nie możesz odwrócić sposobu wykonania? Po prostu generuj od razu obrazek...

Nie mogę odwrócić, bo zanim użytkownik sobie to zapisze, może sobie dodawać pomieszczenia, dodawać im tło, dodawać ikonki, obracać, przesuwać itd.

No z tym przekazywaniem parametrów to jest chyba do zrobienia, ale jak sobie poradzić z wartością top i left, odnosi się ona do położenia względem okna przeglądarki i o ile od góry będzie zawsze tak samo to od lewej już będzie różnie.

Możesz przekazywać te dane np w sesji, a na koniec zapisać, jako obrazek. Możesz też zapisywać tymczasowo w bazie i potem sklejać. Robiłem kiedyś coś na podobnej zasadzie do gry Polanie Online - komponowanie herbu. Wszystko zależy, jakie masz dane wyjściowe, jak wygląda kod. Bez jego znajomości możemy jedynie proponować rozwiązania, nie konkrety.

Przykładowy, niezbyt skomplikowany kod (normalnie będzie tego dużo dużo więcej):

[HTML] pobierz, plaintext 
<div class="pomieszczenie" id="1265541055921" style="position: absolute; width: 503px; height: 250px; left: 115px; top: 361px; background-image: url(http://localhost/aaa/img/floors/parkiet.gif); background-attachment: initial; background-origin: initial; background-clip: initial; background-color: initial; background-position: initial initial; background-repeat: initial initial; "></div><div class="pomieszczenie" id="1265541061466" style="position: absolute; width: 112px; height: 60px; background-image: url(http://localhost/aaa/img/floors/piasek.gif); background-attachment: initial; background-origin: initial; background-clip: initial; background-color: initial; -webkit-transform: rotate(180deg); left: 493px; top: 613px; background-position: initial initial; background-repeat: initial initial; "></div><img src="/aaa/img/icons/bilard.gif" id="1265541080002" alt="bilard" class=" " style="left: 183px; top: 377px; "><img src="/aaa/img/icons/bar.gif" id="1265541089241" alt="bar" class=" " style="left: 468px; top: 401px; "><img src="/aaa/img/icons/automat.gif" id="1265541091218" alt="automat" class=" " style="left: 338px; top: 580px; "><img src="/aaa/img/icons/rzutki.gif" id="1265541094906" alt="rzutki" class=" " style="left: 239px; top: 596px; "><img src="/aaa/img/icons/stolik_dlugi.gif" id="1265541098666" alt="stolik_dlugi" class="ui-selected" style="-webkit-transform: rotate(45deg); left: 307px; top: 451px; "><img src="/aaa/img/icons/stolik_podluzny.gif" id="1265541110449" alt="stolik_podluzny" class=" " style="left: 178px; top: 484px; "><img src="/aaa/img/icons/automat.gif" id="1265541113250" alt="automat" class=" " style="left: 512px; top: 555px; "><img src="/aaa/img/icons/bilard.gif" id="1265541115834" alt="bilard" class=" " style="left: 404px; top: 410px; "><img src="/aaa/img/icons/pilkarzyki.gif" id="1265541118253" alt="pilkarzyki" class=" " style="left: 429px; top: 531px; ">
[HTML] pobierz, plaintext 

Tak sobie myślę, a po co wogóle zapisywać to jako obrazek, jeżeli można zapisać tylko położenie poszczególnych DIVów i ładować to, przy wyświetlaniu pokoju. Daje to dodatkową możliwość późniejszej edycji.

Wiem że tak można, tak póki co mam to zrobione, ale jeśli jest możliwość zapisania tego jako obrazek byłoby dużo lepiej, no a edycja raczej jest niepotrzebna.

No i jeszcze co do divów co zrobić żeby miały one poprawne położenie na każdej rozdzielczości?

Zapisywać położenie do głównego DIVa a nie go strony.
Co do obrazka, z DIVami pewnie byłby problem, ale nie z grafiką. Możesz przecież wygenerować obraz o parametrach głównego DIVa i uważać go za pokój. Potem nakładać na niego grafiki w odpowiednie miejsca. Parametry już masz, wystarczy je wykorzystać.

mozesz mierzyc rozmiar okna przegladarki
poza tym left i top w ccs na posiition relative masz od bloku w ktorym sie znajduje a nie od okna
ja bym sie martwil o przekazania tak duzej liczby zawrtosco ktore raz moga istniec, a innym razem nie
w koncu uzytkownik moze raz zrobic 1 element, a raz 100 i trzeba to jakos ogarnac
ale jest do zrobienia...