Waves upon waves

Patterns and Code
1

Still working on this, but figured it was a good Saturday to share.

// Wave display - v0.5 Alpha by Scruffynerf
// You can change the number of lines, equations used, and colors below.

var linecount = 3
var lines = array(linecount)
lines[0] = (x) => sin(t + x) * 3
lines[1] = (x) => sin(-t + x) * 7
lines[2] = (x) => cos(x - (t *.618) ) * 4

var colors = array(linecount)
colors[0] = 0
colors[1] = .2
colors[2] = .33

var width = sqrt(pixelCount)
var height = width

export var linethickness
export function sliderThickness(v){
  linethickness = v*2 + .75
}

export var range
export function sliderRange(v){
  range = v * width
}

export var speed
export function sliderSpeed(v){
  speed = v * 20
}

export var min,max,totalmin,totalmax
function autoscale(value){
    return height * ((value - totalmin) / (totalmax - totalmin))
}

function minmax(){
  if (totalmin > min) {totalmin = min}
  if (totalmax < max) {totalmax = max}
  if ( abs(totalmin) > abs(totalmax) ) { totalmax = -totalmin }
  if ( abs(totalmax) > abs(totalmin) ) { totalmin = -totalmax }
  min = 1
  max = 0
  return;
}

export var t,w
export function beforeRender(delta) {
  t += (delta / 1000) * speed
  w = wave(time(0.1))
  minmax();
}

var brightness = array(pixelCount)
export function render2D(index,x,y) {
  nomatch = true;
  brightness[index] = 0
  x = (x-.5) * range
  for (i = 0; i < linecount; i++) {
    result = lines[i](x);
    result = result * width 
    if (min > result) {min = result}
    if (max < result) {max = result}
    answer = linethickness - (abs(y*height - autoscale(result)) + 0.001)
    if (answer >= brightness[index]/2){
      brightness[index] = answer;
      nomatch = false;
      hsv(colors[i], 1, brightness[index])
    }
  }
  if (nomatch) {hsv(0,0,0)}
}
2 Likes
2

This is quite cool – nice looking pattern just as it is, and the idea behind it is useful for lots of things!

1 Like
3

It’ll end up being similar to graphtoy, hopefully.
It’s got features like autoscaling, and I really like the way I implemented the brightness as it approaches the actual point, which makes very smooth lines and adjustable thickness.

I see this as part of a series:

Graphtoy-ish:. Give it X, plus extras (time, math) to graph lines
Tixy-ish: give it X, Y, and extras, to graph planes
Trazxy (name to be decided): give it x,y,z,r,a,etc and it’ll graph volumes
Complixyz (also name to be decided): graphs complex plane, domains and more.

Enjoying learning and developing this entire space of coding, and the results are both gorgeous and infinitely explorable.

4

Lol… it instantly made me want to hook weird hardware up to my Pixelblaze. “Hey! Check out my new low frequency oscilloscope!”

1 Like
5

Works great on my 32x8 matrix!

1 Like
6

Just for grins, I threw this pattern on my mapped nanoleafs. With the sliders dialed down, you can see the waves, though it helps to know what you’re looking for, and I think it was a bit more obvious when I had the covers off and you could see the LEDs.Too big to inline

1 Like
7

How many LEDs on that? 3 waves might be a bit much for that. The final version will be even more tunable.

8
  1. 4 at each corner of 12 panels.
9

Yeah, that’s very clustered, so I’m glad it works nicely even at a very low res compared to the intended matrix. You probably would benefit from playing with the “line thickness” and also trying to find waves with a frequency that lines up with the corners, which would make them pulse in series.

Nifty setup though.

10

Yeah, the thickness, range, and speed sliders are all way down close to minimum values here.
Mad props to the “make a map from a picture” tool that I used to make the map for this setup. It’s a real testament to the power of the mapping functionality that you can still apply patterns meant for a matrix to a sparsely populated, weirdly shaped “matrix” like this and see the pattern.