How to save a sketch as a high-res image

annika

Hi,

I want to print my sketch as a somewhat large poster (11x17in). What's the best way to save it so it won't get pixelated?

I tried adding the pdf library but when I search for it in libraries it doesn't show up. I also tried taking a screenshot and changing the ppi to 300 but that made the image too small.

Thanks a lot, Annika

koogs

It is literally the first link on the libraries page (and it's built in, doesn't need to be added)

https://processing.org/reference/libraries/pdf/index.html

Here's some useful overview, which might explain why you can't just change the DPI to 300.

https://processing.org/tutorials/print/

annika

Thanks. I'm a graphic designer so this is not what I do on a daily basis.

For some reason, this doesn't seem to work for my code. I have a function setup() and function draw() instead of void. Does that change anything?

koogs

you'll need void - it's the return value from the methods setup() and draw() - void means they don't return a value...

void setup() {
  // this happens once
}

void draw() {
  // this happens about 60 times a second
}

the more detail you give the better the answers will be. currently we have nothing so you get generalities and vagueness.

annika

This is one of the codes I'd like to use for a composition:

/* Fork of https://gist.github.com/jacobjoaquin/615a11ed2e8d2ff704a368e692d74ce0 */

var xOffset = 0; // Perlin x-offset var yOffset = 0; // Perlin y-offset var offsetInc = 0.006; // Perlin offset increment var inc = 1; // Perin increment var s = 3; // Start size of perlin ring var m = 1.005; // Size multiplier

function setup() { createCanvas(3000, 2400); background(255); noFill(); stroke(255, 130, 140, 120); }

function draw() { translate(width * 0.5, height * 0.5);

if (s < 2000) { // Create a series of perlin rings from big to small for (var nTimes = 0; nTimes < 250; nTimes++) {

  // Less points for smaller rings
  nPoints = int(4 * PI * s);
  nPoints = min(nPoints, 500);

  // Create ring
  beginShape();
  for (var i = 0; i < nPoints; i++) {
    var a = i / nPoints * TAU;
    var p = p5.Vector.fromAngle(i / nPoints * TAU);
    var n = noise(xOffset + p.x * inc, yOffset + p.y * inc) * s;
    p.mult(n);
    vertex(p.x, p.y);
  }
  endShape(CLOSE);

  // Increment perlin offset for next ring
  xOffset += offsetInc;
  yOffset += offsetInc;

  // Update size
  s *= m;
}

} else { noLoop(); } }

Any way I can get a high res file (doesn't have to be pdf, can be jpeg or any other image file) out of the last frame?

koogs

You need to mark the code as code or the forum displays it as text, which is no use to anyone.

Edit post, highlight the code, press Ctrl-o

koogs

oh, that's javascript... not sure it's suitable for hi-def as it's designed for web output...

someone else might have other ideas though.

koogs

ok, rewritten as java processing. i had to convert it to use lines rather than beginshape because those didn't show up in the pdf. and i've split the pvector into sin(a) and cos(a) because, er, because i thought there was a bug there but it was actually in the integer division...

screen also now 1000x800 (it used to resize sketches if you used a resolution higher than the screen. plus it's harder to debug fullscreen programs because if they crash the window gets in the way)

import processing.pdf.*;

/**
forum.processing.org/two/discussion/24646/how-to-save-a-sketch-as-a-high-res-image
Fork of gist.github.com/jacobjoaquin/615a11ed2e8d2ff704a368e692d74ce0
*/

float xOffset = 0;       // Perlin x-offset
float yOffset = 0;       // Perlin y-offset
float offsetInc = 0.006; // Perlin offset increment
float inc = 1;           // Perin increment
float s = 3;             // Start size of perlin ring
float m = 1.005;         // Size multiplier

void setup() {
  size(1000, 800);
  background(255);
  noFill();
  stroke(255, 130, 140, 120);
  beginRecord(PDF, "jacobjoaquin.pdf");
}

void draw() {
  translate(width / 2, height / 2);

  stroke(255, 130, 140, 120);
  if (s < 2000) {
    // Create a series of perlin rings from big to small
    for (int nTimes = 0; nTimes < 250; nTimes++) {

      // Less points for smaller rings
      int nPoints = int(4 * PI * s);
      nPoints = min(nPoints, 500);
      //println(nPoints);

      // Create ring
      for (int i = 0; i < nPoints; i++) {
        float a = (float)i / nPoints * TAU;
        float n = noise(xOffset + cos(a) * inc, yOffset + sin(a) * inc) * s;
        float a1 = (float)(i + 1) / nPoints * TAU;
        float n1 = noise(xOffset + cos(a1) * inc, yOffset + sin(a1) * inc) * s;
        line(n * cos(a), n * sin(a), n1 * cos(a1), n1 * sin(a1));
      }

      // Increment perlin offset for next ring
      xOffset += offsetInc;
      yOffset += offsetInc;

      // Update size
      s *= m;
    }
  } else {
    println("done");
    endRecord();
    noLoop();
  }
}

koogs

annika

You're amazing. Thank you so so much. Been trying to figure this out for the longest time now. Really appreciate your help!!!