Usando processamento no servidor para criar imagens dos bastidores
-
19-09-2019 - |
Pergunta
A forma como eu vejo a maioria das pessoas usam Processamento é para desenhar uma imagem diretamente em uma tela ou página da web no lado do cliente.
Como seria um usar o processamento para criar uma imagem sem uma tela visual, em seguida, salvar esta imagem em um arquivo?
Aqui estão os passos específicos Estou interessado em:
- visitas Alguém uma página web, que faz com que o programa de processamento para começar a correr
- O programa Processamento iria trabalhar nos bastidores para criar uma imagem, em seguida, guardá-lo para um nome de arquivo conhecidos
- A página web iria carregar o nome do arquivo conhecido (que só existe após o programa de processamento é executado? - Então, como pode o site saber para carregar a imagem quando estiver terminado)
Estou assumindo que o programa de processamento é executado em um servidor (que é contrário à forma como Processamento normalmente funciona), eo arquivo será armazenado no servidor. Eu também estou supondo que algum código no programa de processamento de acelerador o número de arquivos que são criados -. Por exemplo, não vai criar uma nova imagem se uma imagem existente foi criado dentro de 5 minutos
Solução
Eu fiz isso, usando processamento em um Servlet para renderizar imagens em tempo real. Um problema que eu encontrei é que o processamento não é thread-safe, então eu tive que criar várias instâncias de Processamento e compartilhá-los em uma fila.
Aqui está um servlet que torna fractais Mandelbrot, para ser usado pelo Google Maps como uma sobreposição:
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();
}
}
}
Outras dicas
O processamento foi originalmente escrito para Java se bem me lembro. Em seguida, foi portado para Javascript. Você poderia usar Java para criar a imagem.
Você pode baixar a versão java de processamento aqui e usar isso. Processamento não se limita a javascript. Como Ben menciona, ele começou como um programa java. A página inicial também lista implementações em javascript, clojure, rubi, e scala.
Como integrar este para o resto da sua página web depende principalmente de seu framework web.
Você pode executar um motor de um javascript no servidor e usar o processamento apenas como você deseja usá-lo no navegador.
Veja como você pode instalar o interpretador V8:
Correndo JavaScript V8 do motor independente.
Eu não tenho certeza se isso lhe permite acessar arquivos, mas estou certo de que há maneiras de fazer isso.
O processamento é Java. O modo de JavaScript, de novo no 2.0 (beta x) é uma integração de processingjs uma biblioteca que "pré processos de" processamento de código em javaScript. Na verdade, há menos recursos e biblioteca nenhum processamento é compatível. Isto é de desenvolvedores de processamento sobre esta mudança de 2.0:
apoio Applet Java está a ser removida, a partir de 2,0 alfa 7. É simplesmente não faz sentido para apoiar estes mais, dada a nossa prioridades, a falta de suporte ao navegador web, ... enquanto os fabricantes de browsers e OS fornecedores fazem applets ainda mais difícil e desagradável é um perdendo a batalha ... No momento, usando Processamento JS (ou Processamento 1.5) é, ao invés, geralmente uma opção melhor para as coisas que são executados na web ... (ver texto completo)
Não é este artigo na wiki Processamento sobre como usar o PHP para salvar arquivos para o servidor. Não tenho certeza se ele pode ajudar.