2009-12-11 5 views
5

Die gängigste Methode, mit der die meisten Benutzer Processing verwenden, besteht darin, ein Bild direkt auf einen Bildschirm oder eine Webseite auf der Clientseite zu zeichnen.Verwenden der Verarbeitung auf einem Server zum Erstellen von Bildern im Hintergrund

Wie würde man mit Processing ein Bild ohne eine visuelle Leinwand erstellen und dann dieses Bild in einer Datei speichern?

Hier sind die einzelnen Schritte Ich habe Interesse an:

  1. Jemand eine Webseite besucht, die das Verarbeitungsprogramm bewirkt
  2. das Verarbeitungsprogramm starten läuft hinter den Kulissen funktionieren würde, eine schaffen Bild, dann speichern Sie es unter einem bekannten Dateinamen
  3. Die Webseite würde den bekannten Dateinamen laden (die nur existiert, nachdem das Verarbeitungsprogramm ausgeführt wird - so, wie kann die Webseite wissen, das Bild zu laden, wenn es fertig ist?)

Ich gehe davon aus, dass das Verarbeitungsprogramm auf einem Server ausgeführt wird (was im Gegensatz zu Verarbeitung normalerweise funktioniert), und die Datei wird auf dem Server gespeichert. Ich nehme auch an, dass ein Code im Verarbeitungsprogramm die Anzahl der erstellten Dateien drosselt - zum Beispiel wird kein neues Bild erstellt, wenn ein vorhandenes Bild innerhalb von 5 Minuten erstellt wurde.

+0

Warum wählen Sie Verarbeitung für die Aufgabe, anstatt lassen die Aufgabe, die Wahl der Sprache direkt helfen? –

+1

gültige Frage. Ich mag Processing, weil es nicht-triviale Grafiken einfach zu erstellen macht. Aber ich nehme an, ich bin nicht daran gebunden, wenn es im System keinen Sinn macht (versuche ich einen quadratischen Stift in ein rundes Loch zu stecken?) –

+0

Abhängig von der Komplexität des Bildes und der Zeit zu rendern, du könnte in Erwägung ziehen, mit processing.js das Bild am Frontend im Canvas zu rendern. – JAMESSTONEco

Antwort

10

Ich habe dies mit der Verarbeitung in einem Servlet zum Rendern von Bildern im laufenden Betrieb getan. Ein Problem, das ich fand, ist, dass die Verarbeitung nicht threadsicher ist, also musste ich mehrere Verarbeitungsinstanzen erstellen und sie in einer Warteschlange teilen.

Hier ist ein Servlet, die Mandelbrots Fraktale macht, als Overlay von Google Maps verwendet werden:

import java.awt.image.BufferedImage; 
import java.io.IOException; 
import java.util.concurrent.LinkedBlockingQueue; 

import javax.imageio.ImageIO; 
import javax.servlet.ServletException; 
import javax.servlet.http.HttpServlet; 
import javax.servlet.http.HttpServletRequest; 
import javax.servlet.http.HttpServletResponse; 

import processing.core.PApplet; 

public class Tile extends HttpServlet { 
    private static final long serialVersionUID = 1L; 
    private static LinkedBlockingQueue<PApplet> pQueue = new LinkedBlockingQueue<PApplet>(); 

    private PApplet createPApplet() { 
     PApplet p = new PApplet(); 
     p.init(); 
     p.size(256, 256); 
     p.noLoop(); 
     p.textFont(p.createFont("Monospace", 8, true)); 
     p.stroke(0x22FFFFFF); 
     p.colorMode(PApplet.HSB, 256, 1, 1); 
     return p; 
    } 

    protected void doGet(HttpServletRequest request, 
      HttpServletResponse response) throws ServletException, IOException { 
     PApplet p; 

     if (pQueue.size() == 0) { 
      p = createPApplet(); 
     } else { 
      try { 
       p = pQueue.take(); 
      } catch (InterruptedException e) { 
       p = createPApplet(); 
      } 
     } 

     int zoom = Integer.parseInt(request.getParameter("z")); 
     int tileX = Integer.parseInt(request.getParameter("x")); 
     int tileY = Integer.parseInt(request.getParameter("y")); 
     int tiles = 1 << zoom; 

     p.loadPixels(); 

     final int N = 256; 
     //final double inverse_N = 2.0/256; 
     final double inverse_N = 2.0/tiles/256; 
     int y = -1; 

     while ((++y) < N) { 
      double Civ = (double) (y + tileY * 256) * inverse_N - 1.0; 
      for (int x = 0; x < N; x++) { 
       double Crv = (double) (x + tileX * 256) * inverse_N - 1.5; 

       double Zrv = Crv; 
       double Ziv = Civ; 

       double Trv = Crv * Crv; 
       double Tiv = Civ * Civ; 

       int i = 256; 
       do { 
        Ziv = (Zrv * Ziv) + (Zrv * Ziv) + Civ; 
        Zrv = Trv - Tiv + Crv; 

        Trv = Zrv * Zrv; 
        Tiv = Ziv * Ziv; 
       } while (((Trv + Tiv) <= 4.0) && (--i > 0)); 

       if (i == 0) { 
        p.pixels[x + y * N] = 0x00000000; 
       } else { 
        p.pixels[x + y * N] = p.color(256 - i,1,1); 
       } 
      } // end foreach column 
     } 
     p.updatePixels(); 

     // render info 
     p.fill(0x22000000); 
     p.text("X: " + tileX + "\nY: " + tileY + "\nZ: " + zoom, 1, 13); 
     p.fill(0x22FFFFFF); 
     p.text("X: " + tileX + "\nY: " + tileY + "\nZ: " + zoom, 0, 12); 

     p.line(0, 0, 0, 2); 
     p.line(0, 0, 2, 0); 
     p.line(255, 255, 255, 253); 
     p.line(255, 255, 253, 255); 

     // done 
     p.loadPixels(); 
     BufferedImage img = new BufferedImage(256, 256, 
       BufferedImage.TYPE_INT_ARGB); 
     img.setRGB(0, 0, 256, 256, p.pixels, 0, 256); 
     p.draw(); 

     response.setHeader("Content-Type", "image/png"); 
     ImageIO.write(img, "PNG", response.getOutputStream()); 

     try { 
      pQueue.put(p); 
     } catch (InterruptedException e) { 
      e.printStackTrace(); 
     } 
    } 

} 
+0

Ihr Demo-Link ist 404. – enobrev

+0

Danke, es ist jetzt offline, ich habe den Link entfernt. –

2

Verarbeitung wurde ursprünglich für Java geschrieben, wenn ich mich richtig erinnere. Es wurde dann zu Javascript portiert. Sie könnten Java verwenden, um das Bild zu erstellen.

0

Sie können eine Javascript-Engine auf dem Server ausführen und die Verarbeitung so verwenden, wie Sie sie im Browser verwenden würden.

Hier ist, wie Sie das v8-Interpreter installieren:

Running v8 Javascript Engine standalone.

Ich bin mir nicht ganz sicher, ob diese Dateien zugreifen kann, aber ich bin sicher, es gibt Möglichkeiten, dies zu tun.

+0

während dies möglich ist, warum nicht nur die ursprüngliche (Java) Version der Verarbeitung ausführen? Oder hat die Javascript-Version zusätzliche Funktionen? –

1

Sie können die Java-Version von Processing here herunterladen und verwenden. Die Verarbeitung ist nicht auf Javascript beschränkt. Wie Ben erwähnt, begann es als Java-Programm. Die Homepage listet auch Implementierungen in Javascript, Clojure, Ruby und Scala auf.

Wie Sie dies in den Rest Ihrer Webseite integrieren, hängt hauptsächlich von Ihrem Web-Framework ab.

0

Verarbeitung ist Java. Der javaScript-Modus, neu in 2.0 (Beta x), ist eine Integration von processingjs eine Bibliothek, die Code in javaScript "vorverarbeitet". Tatsächlich gibt es weniger Features und keine Verarbeitungsbibliothek ist kompatibel. Dies ist von Entwicklern über diese Änderung in 2.0:

Java Applet-Unterstützung wird entfernt, beginnend in 2.0 Alpha 7.Es einfach nicht sinnvoll, diese zu unterstützen, angesichts unserer Prioritäten, Mangel an Web-Browser-Unterstützung, ... während Browser-Hersteller und OS-Anbieter machen Applets umso schwieriger und unansehnlich ist ein verlieren Kampf ... im Moment verwendet Verarbeitung JS (oder Verarbeitung 1.5) ist stattdessen im allgemeinen eine bessere Option für Dinge, die auf dem Netz laufen ... (see full text)

Es ist dieser Artikel in Bearbeitung Wiki darüber, wie PHP zu verwenden Speichern Sie Dateien auf dem Server. Nicht sicher, ob es helfen kann.

http://wiki.processing.org/w/Saving_files_to_a_web-server

+0

danke, ich kann nicht 3 Links machen. –

Verwandte Themen