How to get this mesh running?

Roupen

Bear with me guys :) am very new to this.

Could you point out what's the problem/s here? can't really figure out why this is not running.

thank you!

---

var i, x, w = 70,
  h = 500,
  y, s = 10;
var k, m, r, j = .008,
  n;

function setup() {
  createCanvas(700, 600, WEBGL);
  noStroke();
}

function draw() {
  background(190, 181, 175);
  beginShape(9);
  stroke(255, 102, 75);
  noFill();

  for (i = 0; i < w * h; i += s) {
    x = i % w;
    y = i / w;
    k = y + s;
    m = x + s;
    vertex(x, n(y * w + x), y);
    vertex(m, n(y * w + m), y);
    vertex(m, n(k * w + m), k);
    vertex(m, n(k * w + m), k);
    vertex(x, n(k * w + x), k);
    vertex(x, n(y * w + x), y);
    i += i % w == 0 ? w * (s - 1) : 0;
  }
  endShape();
  r -= j;
}

function n(i) {
  return noise(i % w * j, i * j / w + r) * s * 10 + h / 2;
}

Chrisir

this version runs in standard JAVA processing

// 

int i, x, w = 70, 
  h = 500, 
  y, s = 10;
float k, m, r, j = .008, 
  n;

void setup() {
  size(700, 600, OPENGL);
  // noStroke();
}

void draw() {
  background(190, 181, 175);

  lights();  // slower but looks better with lights 

  translate (310, 30); 
  beginShape(9);


  // only mesh *****
  //stroke(255, 102, 75);
  //noFill();

  // OR with fill *****
  fill(255, 102, 75);
  // noStroke();
  stroke(0); 

  for (i = 0; i < w * h; i += s) {
    x = i % w;
    y = i / w;
    k = y + s;
    m = x + s;
    vertex(x, n(y * w + x), y);
    vertex(m, n(y * w + m), y);
    vertex(m, n(k * w + m), k);
    vertex(m, n(k * w + m), k);
    vertex(x, n(k * w + x), k);
    vertex(x, n(y * w + x), y);
    i += i % w == 0 ? w * (s - 1) : 0;
  }
  endShape();
  r -= j;
}

float n(float i) {
  return noise(i % w * j, i * j / w + r) * s * 10 + h / 2;
}
//

blindfish

@Roupen: go to hello.p5js.org and confirm your PC/browser supports WebGL. The old laptop I'm using here doesn't, and I see a message to that effect on the above site...

Roupen

thank you @Chrisir. It doesn't really solve my problem :)

@blindfish: I have tried other examples that use that use WebGL, and they work.

Roupen

still struggling with this >>>

    var i, x, w = 500, 
      h = 500, 
      y, s = 10;
    var k, m, r, j = .008, 
      n;

    function setup() {
      createCanvas(700, 600, WEBGL);
    }

    function draw() {
      background(0);

      beginShape(9);
      fill(255);

      for (i = 0; i < w * h; i += s) {
        x = i % w;
        y = i / w;
        k = y + s;
        m = x + s;
        vertex(x, n(y * w + x), y);
        vertex(m, n(y * w + m), y);
        vertex(m, n(k * w + m), k);
        vertex(m, n(k * w + m), k);
        vertex(x, n(k * w + x), k);
        vertex(x, n(y * w + x), y);
        i += i % w == 0 ? w * (s - 1) : 0;
      }
      endShape();
      r -= j;
    }

    function n(i) {
      return noise(i % w * j, i * j / w + r) * s * 10 + h / 2;
    }

blindfish

@Roupen: looks like there are some significant discrepancies between p5js and Processing. This is getting some of the way there; but the triangles don't appear to line up properly at present:

var w = 250,
    halfW = w/2,
    h = 500,
    quarterH = h/4,
    s = 50,
    // since r can be any variable type it won't default to 0!
    r = 0,
    speed = .008;

function setup() {
    createCanvas(700, 500, WEBGL);
}

function draw() {
    var x, y, k, m;

    background(0);

    for (var i = 0, limit = w * h; i < limit; i += s) {
        x = i % w - halfW;
        y = i / w;
        k = y + s;
        m = x + s;

        ywx = n(y * w + x);
        kwm = n(k * w + m)

        fill(255, 166, 0);
        beginShape(9);
            vertex(x, n(y * w + x), y);
            vertex(m, n(y * w + m), y);
            vertex(m, n(k * w + m), k);
        endShape();

        fill(0, 166, 255);
        beginShape(9);
            vertex(m, n(k * w + m), k);
            vertex(x, n(k * w + x), k);
            vertex(x, n(y * w + x), y);
        endShape();

        i += i % w == 0 ? w * (s - 1) : 0;
    }

    r -= speed;
}

function n(input) {
    return noise(input % w * speed, input * speed / w + r) * s * 10 - quarterH;
}