Strange display behavior

henklamers

Hi,

I have made some variations on the Generative Design book program P_1_1_1 (color spectrum in a grid). Here they are positioned at the bottom of the page next to the text header P_1_1_1.

http://www.loftmatic.com/_pages/Research/GDV/P_1_0.html

The interesting thing is that some files are taking a lot of time to display. This one for instance…

http://www.loftmatic.com/_pages/Research/GDV/P_1_1_1/GDV_28/P_1_1_1_01_GDV_28.html

…takes more than an hour to display om my MacPro (it is still not on screen). During that hour you see a colored spectrum on the screen accompanied by a cursor which sometimes turns into a colored beach ball. So I tried it on a MacBookPro and there it took 5 seconds to display. Another MacBook Pro is still busy with it. And the iPad Mini is displaying the file after two minutes. And its working fine. Can anyone tell me why this file needs so much time to display?

Greetings,

Henk Lamers

GoToLoop

Hey! Made some tweaks! I believe it's starting faster now: o->

// P_1_1_1_01.pde
// 
// Generative Gestaltung, ISBN: 978-3-87439-759-9
// First Edition, Hermann Schmidt, Mainz, 2009
// Hartmut Bohnacker, Benedikt Gross, Julia Laub, Claudius Lazzeroni
// Copyright 2009 Hartmut Bohnacker, Benedikt Gross, Julia Laub, Claudius Lazzeroni
//
// http://www.generative-gestaltung.de
//
// Licensed under the Apache License, Version 2.0 (the "License");
// you may not use this file except in compliance with the License.
// You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0
// Unless required by applicable law or agreed to in writing, software
// distributed under the License is distributed on an "AS IS" BASIS,
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
// See the License for the specific language governing permissions and
// limitations under the License.

/**
 * draw the color spectrum by moving the mouse
 *    
 * MOUSE
 * position x/y        : resolution
 * 
 * KEYS
 * s                   : save png
 * p                   : save pdf
 */

// Starting point: The grid is created by two nested for loops. In the outer loop, the y-position is
// increased, step by step. The inner loop then draws a line by increasing the value for the rectangle’s 
// x-position, step by step, until the entire width is processed. The step size is set by the value of the 
// mouse position and is located in the variables stepX and stepY. It also determines the length and width
// of the rectangles.

//////////////////////////////////////////////////////////////////////////////////////////////////////////
// Generative Design Variations
//
// P_1_1_1_01_GDV_28
//
// Change as much as possible of the program but keep the essential things.
//
// November 16, 2013
// © 2013 Loftmatic, Henk Lamers.

// Import pdf-generating library and Java Calendar utility.

// tweaked by GoToLoop
// forum.processing.org/two/discussion/1584/strange-display-behaviour
// www.loftmatic.com/_pages/Research/GDV/P_1_1_1/GDV_28/P_1_1_1_01_GDV_28.html

import processing.pdf.*;
import java.util.Calendar;

final static int MIN = 20;

//final static String PATH = "";
final static String PATH = "http://www.loftmatic.com/_pages/Research/GDV/P_1_1_1/GDV_28/";
final static String NAME = "Star.svg";

PShape star;
boolean savePDF;

void setup () {
  size(800, 800);
  frameRate(60);

  initCanvas();

  (star = loadShape(PATH + NAME)).disableStyle();

  mouseX = mouseY = width>>1;
}

void draw () {
  if (savePDF) {
    beginRecord(PDF, "./pdf/" + timestamp() + ".pdf");
    initCanvas();
  }

  background(0);

  // The value range for the hue and saturation is set at 800 or 400 using the command 
  // colorMode(). Hue is no longer defined as a number between 0 and 360 but rather as
  // one between 0 and 800. The same is true of the saturation value.

  // The addition of 2 prevents stepX or stepY from being too small, which would
  // lead to longer display times.
  final int stepX = constrain(mouseX, MIN, width);
  final int stepY = constrain(mouseY, MIN, height);

  final float sx = stepX/1.22, sy = stepY/.9;

  translate(stepX>>1, stepY*.67);

  // With the help of two nested loops all the positions in the grid will now be processed.
  // The y-position of the rectangle to be drawn is defined by gridY in the outer loop.
  // The value increases only when the inner loop has been processed(i. e., once a
  // complete row of rectangles has been drawn).
  for (int gridY = 0; gridY < height; gridY += stepY)
    for (int gridX = 0, gy = height - gridY; gridX < width; gridX += stepX) {

      // The variable gridX and gridY are used not only to position the tile but also to define
      // the fill color. The hue is determined by gridX. Saturation value decreases
      // proportionally to increases in the value gridY.

      stroke(gridX, gy, 100);
      strokeWeight(100);
      shape(star, gridX, gridY, sx, sy);    

      stroke(gridX, gy, 50);
      strokeWeight(60);    
      shape(star, gridX, gridY, sx, sy);

      stroke(gridX, gy, 25);
      strokeWeight(20);
      shape(star, gridX, gridY, sx, sy);
    }

  if (savePDF) {
    savePDF = false;
    endRecord();
  }
}

void keyPressed () {
  final int k = keyCode;

  if (k == 'S') saveFrame("./png/" + timestamp() + "-##.png");
  if (k == 'P') savePDF = true;
}

void initCanvas() {
  colorMode(HSB, width, height, width>>3);
  noFill();
  smooth(4);

  shapeMode(CENTER);
  strokeJoin(ROUND);
}

String timestamp () {
  Calendar now = Calendar.getInstance();
  return String.format("%1$ty%1$tm%1$td_%1$tH%1$tM%1$tS", now);
}

henklamers

Hi,

I will add your essential tweaks

final int stepX = constrain(mouseX + MIN, MIN, width);
final int stepY = constrain(mouseY + MIN, MIN, height);

in the other lazy programs. Thanks for your help! I will mention it in my blog :)

Greetings,

Henk Lamers

GoToLoop

http://mycodehistory.wordpress.com/2013/11/26/gdv-p-1-1-1-color-spectrum-in-a-grid/

I did a test this morning and one program took more than one hour to display. That seems to be solved now. I still have to check what went wrong.

Problem was that sketch started w/ both mouseX & mouseY = 0.
And since stepX & stepY are derived from them, 1st double loops had an immense # of iterations.
And consequently lotsa shape() draws which demanded a very powerful computer to finish! :-&
Once passed that, and user hovers the mouse upon the canvas, we get bigger stepX & stepY.
And program finally soars w/ a smaller # of iterations!

henklamers

I’m not sure but did you add a new version of your tweaks yesterday? If that is true then the point is that I used the older tweaks to incorporate into the sketches. Anyway I will use the version above to study. You introduced a few things I did not see before:

• initCanvas,
• >>
• final static int MIN = 20
• final static STRING PATH
• final static STRING NAME

Thanks again for helping me out.