2010-07-28 17 views
5

Piszę aplikację, która pozwala użytkownikom generować obrazy z Raphael.JS. Jedną z dodatkowych funkcji, którą chcę, jest wygenerowanie PNG płótna Rafaela.Programowe generowanie PNG z obrazu Raphael.JS

Oto ogólna rurociąg w głowie:

  1. wejścia użytkownika Parametry
  2. Generujemy JS z Raphael zwraca
  3. Generujemy owijkę JS, który wykonuje powyższe i wywołuje .innerHTML na zawierającego div , dając nam SVG (które następnie wysłać gdzieś)
  4. Wykonujemy owijki JS
  5. SVG jest wysyłany do ImageMagick i obecnie wyskakuje PNG

Krok 4 jest krokiem, na który potrzebuję wskazówek. Użytkownik może używać IE; nie mamy gwarancji, że JS kiedykolwiek zostanie wykonany w przeglądarce SVG. W każdym razie potrzebowalibyśmy tego, aby uruchomić serwer, aby był niezawodny. Oto trzy możliwości, które do tej pory stworzyłem:

  • Zainstaluj Firefoksa na serwerze i uruchom wynik (3) w Firefoksie. Ta opcja jest do bani, ponieważ zainstalowanie FF oznacza zainstalowanie kilku rzeczy X na naszym serwerze, uruchamianie FF niesie ze sobą wiele kosztów, a ja naprawdę nie chcę marnować czasu na śledzenie procesu i zabijanie go, gdy to zrobi.
  • Użyj Node.js + jsdom (http://github.com/tmpvar/jsdom). Minusem jest to, że nie jest jasne, jak działa obsługiwany jsdom - rzekoma witryna, jsdom.org, tak naprawdę nie istnieje. Ponadto nie mogę znaleźć żadnej dokumentacji.
  • Może zrobić coś z Rhino? O ile mogę powiedzieć, Rhino ma jeszcze bardziej skromne wsparcie dla DOM niż Node.

Więc ... wszystkie te trzy opcje są do dupy. Myślę. Czy myliłem się co do czegoś? Czy istnieje inny sposób?

Odpowiedz

3

Rozwiązano to za pomocą wkhtmltoimage. Brzydkie rozwiązanie, ale działa.

0

Możesz spróbować transforming the VML to SVG on the server przed uruchomieniem poprzez ImageMagick. Wiem, że sam projekt to PHP, ale konwersja odbywa się za pomocą XSL (plik znajduje się w archiwum pobierania), więc powinien być przenośny na dowolną platformę serwerową.

+0

Fajnie ... dzięki. To może faktycznie zadziałać - chociaż mój Spidey wyczuwa mrowienie na myśl polegania na wynikach przeglądarki użytkownika. Nie mogę ryzykować, ale poleganie na tym działającym po stronie klienta przeraża mnie. Jak myślisz - czy po prostu jestem paranoikiem?Nie ma sposobu, aby użytkownik mógł utworzyć obraz Raphaela bez ładowania strony, na której jest renderowany, i myślę, że oczekujemy, że nasi użytkownicy mają włączone JS ... – rfrankel

+0

@rfrankel Oczywiście nigdy nie można ufać wprowadzaniu danych z przeglądarki i zawsze będzie możliwe exploitowanie (na przykład w silniku XSLT) nawet z dobrze ukształtowanym wejściem, ale powinienem pomyśleć, że twoje dane wejściowe są w rzeczywistości dobrym początkiem. – robertc

+0

Oczywiście - nie myślałem nawet o zagrożeniach bezpieczeństwa (z którymi wiem, jak sobie z tym poradzić) tak bardzo, jak o przypadkach skrajnych, gdzie z powodzeniem stworzymy obraz Raphaela, ale nie PNG, ponieważ przeglądarka użytkownika robi coś dziwnego lub rozbija się lub cokolwiek. – rfrankel

1

Po zserializowaniu dokumentu SVG na kliencie, potrzebny jest jedynie renderer SVG i/lub rasteryzer działający na serwerze w celu utworzenia pliku PNG. Nie jest dla mnie jasne, co myślisz, że opakowanie JS zrobi lub dlaczego jest potrzebne. Ponieważ przesyłany dokument SVG nie zawiera treści dynamicznych, wystarczy wysłać zsynchronizowany dokument SVG do rasteryzera na serwerze, aby rasteryzować go jako plik PNG.

Renderowanie/rasteryzator SVG może być po prostu skryptem CGI, który wywołuje ImageMagick, lub może być czymś bardziej wyrafinowanym. Osobiście poleciłbym ustawienie serwletu z uruchomionym Apache Batik, który zawiera SVG Rasterizer i można go nazwać programowo. Szybkie wyszukiwanie google wskazuje, że jest to dość powszechne zadanie dla Batika: http://www.mail-archive.com/[email protected]/msg06116.html

Powiązane problemy