Custom Perlin Noise page 2

53 posts

Flag Post

to use the new <int> bit, you just need the flex compiler. CSx has a way to plug into it and use its features along with the normal flash features

Originally posted by Draco18s:

internal const oNoise:OptimizedPerlin = new OptimizedPerlin();
1180: Call to a possibly undefined method OptimizedPerlin.

whoops, missed the import statement that goes above it

 
Flag Post
Originally posted by skyboy:

to use the new &lt;int&gt; bit, you just need the flex compiler. CSx has a way to plug into it and use its features along with the normal flash features

I’d have to figure out how to add/use the flex compiler and I’m too lazy to do that.

 
Flag Post
Originally posted by Draco18s:

I’d have to figure out how to add/use the flex compiler and I’m too lazy to do that.

CSx will use it for you; it gives you access to metadata (such as Embed tags) mxml and the short-hand assignment for Vectors
adding it would be a simple option in preferences/options. if it’s more complex than that, then Adobe’s doing something wrong

also, it gives you access to the spark packages and better portability between FD/CSx (the fl.* packages will still cause problems in regular flex)

 
Flag Post

I’ll look into it….uh, today. But later. After sleep.

In the meantime, relish the awesomeness (3700ms):

 
Flag Post

do you know the max value of alpha that perlinNoise generates? i’m adding color channels to that fill function in a way that will minimally impact speed. so you’ll be able to get that awesomeness in about 1000 ms

 
Flag Post
Originally posted by skyboy:

do you know the max value of alpha that perlinNoise generates? i’m adding color channels to that fill function in a way that will minimally impact speed. so you’ll be able to get that awesomeness in about 1000 ms

Alpha should also be 0×00 to 0xFF. For the BitmapData one, I suspect it has the same fault that shows up in the Red, Green, and Blue channels (i.e. peaks at 174, or 0xAE).

 
Flag Post
Originally posted by Draco18s:

Alpha should also be 0×00 to 0xFF. For the BitmapData one, I suspect it has the same fault that shows up in the Red, Green, and Blue channels (i.e. peaks at 174, or 0xAE).

so far, 3 channels in <1500 ms for 8 octaves on a 320×240 px image. native implementation does it in 96

 
Flag Post

Looking good.
I’m only using 1 octave, but a larger image, so I should get comparable results.
Oh, and the colors are richer than native.

Skyboy, you are amazing. <3

Edit:
Just checked, using 2 octaves. Tried it with 8 (eh, results aren’t better or worse) and it came close to timing out: 14.1 seconds!

Also, it looks like you’re generating turbulence, not fractal, noise.

 
Flag Post
Originally posted by Draco18s:

Looking good.
I’m only using 1 octave, but a larger image, so I should get comparable results.
Oh, and the colors are richer than native.

Skyboy, you are amazing. <3

at 1 octave, i get 173 ms from AS3 and 15 from native; on the original that only generates greyscale, i get 69 ms

keep in mind, my machine is about 3x slower than yours, so you should get around 40ms.
also, 1 octave is about equal to 10 octaves from native, and the result doesn’t have obvious artifacts

i guess Adobe scarified the quality of the output for speed. maybe i should write a blog entry about optimizing and enhancing this…

edit: i honestly have no idea what it’s generating, i just took mario’s work and optimized the shit out of it. there is one artifact of these optimizations, though: the result is rotated 180 degrees compared to the original output, i don’t think anyone will care though

 
Flag Post

Hehe, yes, you should.

Also, if you ever need them:

private const DELTA_INDEX:Array = [
			0,    0.01, 0.02, 0.04, 0.05, 0.06, 0.07, 0.08, 0.1,  0.11,
			0.12, 0.14, 0.15, 0.16, 0.17, 0.18, 0.20, 0.21, 0.22, 0.24,
			0.25, 0.27, 0.28, 0.30, 0.32, 0.34, 0.36, 0.38, 0.40, 0.42,
			0.44, 0.46, 0.48, 0.5,  0.53, 0.56, 0.59, 0.62, 0.65, 0.68, 
			0.71, 0.74, 0.77, 0.80, 0.83, 0.86, 0.89, 0.92, 0.95, 0.98,
			1.0,  1.06, 1.12, 1.18, 1.24, 1.30, 1.36, 1.42, 1.48, 1.54,
			1.60, 1.66, 1.72, 1.78, 1.84, 1.90, 1.96, 2.0,  2.12, 2.25, 
			2.37, 2.50, 2.62, 2.75, 2.87, 3.0,  3.2,  3.4,  3.6,  3.8,
			4.0,  4.3,  4.7,  4.9,  5.0,  5.5,  6.0,  6.5,  6.8,  7.0,
			7.3,  7.5,  7.8,  8.0,  8.4,  8.7,  9.0,  9.4,  9.6,  9.8, 
			10.0
		]
private function adjustBrightness(bitmap, value) {
			var v = (255-Math.abs(value))/255;
			var colorTrans:ColorTransform = new ColorTransform();
			colorTrans.redMultiplier = colorTrans.greenMultiplier = colorTrans.blueMultiplier = v; // - Math.abs (value); // color percent
			colorTrans.redOffset = colorTrans.greenOffset = colorTrans.blueOffset = (value < 0) ? 0 : value;
			bitmap.colorTransform(new Rectangle(0,0,bitmap.width,bitmap.height),colorTrans);
		}
		
		private function adjustContrast(bitmap, value:int) {
			var x:Number;
			if (value<0) {
				x = 127+value/100*127
			} else {
				x = value%1;
				if (x == 0) {
					x = DELTA_INDEX[value];
				} else {
					x = DELTA_INDEX[(value<<0)]*(1-x)+DELTA_INDEX[(value<<0)+1]*x;
				}
				x = x*127+127;
			}
			
			var colorTrans:ColorTransform = new ColorTransform();
			colorTrans.redMultiplier = colorTrans.greenMultiplier = colorTrans.blueMultiplier = x/127;
			colorTrans.redOffset = colorTrans.greenOffset = colorTrans.blueOffset = 1*(127-x);
			bitmap.colorTransform(new Rectangle(0,0,bitmap.width,bitmap.height),colorTrans);
		}

These functions will adjust the brightness and contrast of a bitmap exactly the same as you would in Photoshop. The results are almost identical (this contrast function can’t accept a value over 100 though, whereas GIMP runs from -127 to +127), unlike using a setBrightness or setContrast function, where passing 0 makes the image black/middle gray, making you guess.

 
Flag Post

it now has full support for generating channels as you wish, and greyscale via the fillColor method (0 = greyscale, while on native 0 = black). for 0: 9 native, 87 AS3. so i recommend using fill for greyscale, as it’s 21% faster. it scales very linearly too, 10 octaves = 2 seconds, 100 = 20 seconds
native on 100 octaves takes 8 seconds and generates nothing. the bitmap is completely black

also, perlinNoise(320, 240, 1, 879683, false, false, 15, false, null) makes a neat multi-colored mushroom

edit: also, 78 variables for a single function. and i may yet add more

 
Flag Post

Sweet, link me.

 
Flag Post

https://github.com/skyboy/AS3-Utilities/blob/master/skyboy/math/OptimizedPerlin.as

 
Flag Post

And….Flash doesn’t like these:

t=int(hash==12|hash&2);
1067: Implicit coercion of a value of type Boolean to an unrelated type Number.

And it whines about this:
var grey:Boolean=channels&15==0;
(coercion of an int to a boolean)

I was able to change the vector def to one that Flash compiles;
var vect:Vector.<int> = Vector.<int>([1,2,3,4,5…]);

 
Flag Post
Originally posted by Draco18s:

And….Flash doesn’t like these:

t=int(hash==12|hash&2);
1067: Implicit coercion of a value of type Boolean to an unrelated type Number.

And it whines about this:
var grey:Boolean=channels&15==0;
(coercion of an int to a boolean)

I was able to change the vector def to one that Flash compiles;
var vect:Vector.<int> = Vector.<int>([1,2,3,4,5…]);

odd, in the source i committed those first two are properly parenthesized: t = int(hash == (12 | (hash & 2))); and var grey:Boolean = (channels & 15) == 0;

it’s required because bitwise operators have lower precedence than boolean operators for some stupid reason floating up from when C didn’t have boolean operators. some stupid reason about compatibility between languages that have nothing to do with C and C or something

 
Flag Post

There’s a bunch of them I need to fix, but I should be able to do it with that instruction.

Or…one I missed:

g1+=int(! hash&2)<<1-1*t2*y1+1-t2*t*x1+1-t*z1;

Did I do it right?

g1+=int(! (hash&2))<<1-1*t2*y1+1-t2*t*x1+1-t*z1;

And these?

var blue:Boolean=(channels&4)!=0,red:Boolean=(channels&1)!=0,alpha:Boolean=(channels&8)!=0;
var green:Boolean=(channels&2|int(grey))!=0;

It compiles, at this point, but throws a runtime error:

RangeError: Error #1125: The index 34 is out of range 0.
at skyboy.math::OptimizedPerlin/fill()[skyboy\math\OptimizedPerlin.as:221]
at skyboy.math::OptimizedPerlin$/fill()[skyboy\math\OptimizedPerlin.as:172]
at Main/redraw2()[Main.as:55]

Or this error, if I use .fillColor()

RangeError: Error #1125: The index 126 is out of range 0.
at skyboy.math::OptimizedPerlin/fillColor()[skyboy\math\OptimizedPerlin.as:386]
at skyboy.math::OptimizedPerlin$/fillColor()[skyboy\math\OptimizedPerlin.as:311]
at Main/redraw2()[Main.as:59]

 
Flag Post

i’m not sure what happened to all of the parenthesis. did you autoformat?

the booleans are right, but if the g# area is messed up, it’s a lot of work as you’d need to figure each one out individually because they use different variables. as for the runtime error, it seems like flash is throwing a fit about p Vector being empty

you should be able to copy/paste this without issues: https://raw.github.com/skyboy/AS3-Utilities/master/skyboy/math/OptimizedPerlin.as

 
Flag Post

Ah! I DID!
But when I pasted, it lost all its tab spacing. I didn’t realize it would ditch the parens!
That worked much better. 2879ms vs. the other at ~3700.

Just have to tweak to get the colors I want back (getting lots and lots of full saturation red).

 
Flag Post
Originally posted by Draco18s:

Just have to tweak to get the colors I want back (getting lots and lots of full saturation red).

tweak the seed and $x/$y/$z as well as the falloff (not sure what this does, exactly)

 
Flag Post

Well, yes. I’m also churning the output through several filters.

Oh! I bet that’s the real issue: I’m still using the three renders → three vectors thing, so with only one render and one vector, the Green and Blue channels are 0! Yep, that was it. :D

Will still work from the bottom up again, checking the perlin noise itself to see I’m getting a good color mix.

 
Flag Post

Oh yes, this is pretty sweet. Tweaked my values a bit to get some brighter cyans.

My reds are a little dark on average, but I can live with that.

 
Flag Post

okay, falloff doesn’t do anything for 1 octave: it determines how different each octave is. values <1 generate similar data, and values >=1 generate conflicting data that eventually normalizes at higher octaves. a falloff of 10 at 8 octaves generates solid grey (0×7F7F7F; both greyscale and color)

also, you should generate a grey perlin bitmap and put stars in the brightest areas of that, so it flows as one system better

 
Flag Post
Originally posted by skyboy:

okay, falloff doesn’t do anything for 1 octave: it determines how different each octave is. values <1 generate similar data, and values >=1 generate conflicting data that eventually normalizes at higher octaves. a falloff of 10 at 8 octaves generates solid grey (0×7F7F7F; both greyscale and color)

also, you should generate a grey perlin bitmap and put stars in the brightest areas of that, so it flows as one system better

I’m doing it like this:

Hurl a few thousand random HSV pixels at the bitmap (bitmap width * height * 0.002) where hue and saturation are 0. Tweak brightness and contrast to only keep the brightest ones. Then subtract out a perlin noise (native implementation, grayscale) to get the “clumps.” Then colorize with the AS3 perlin. Then copy, blur, brighten, blur, brighten, blur, and merge back in (screen blendmode).

Next trick is to generate it in sections as to not go over the 15 second time limit.

 
Flag Post

Scratch that, next trick is to play with the whispy-ness of the perlin noise to get a start on doing the nebula structure (versus just stars).

I doubt there’s a better way to do this:

for(var i = vect.length;i--;) {
	x = (i % Width) / (Width/4);
	y = int(i / Width) / (Height/4);
	o = OptimizedPerlin.noise(x,y);
	x += c*o;
	y += c*o;
	o = OptimizedPerlin.noise(x, y, z)*256;
	o -= (o % 1);
	a = (o < 128) ? 0 : o;
	vect[i] = (a << 24) + (o << 16) + (o << 8) + (o);
}

On my work machine it takes about 7.6 seconds to do that, over 4.1 to do the stars (using 1 .fillColor call and then a vector loop to tweak the ouput colors manually, apply 11 matrix transforms, 3 blur filters, and 4 Bitmap.Draw()s using each using a different blend mode).

But it looks awesome:

 
Flag Post

What effect are you trying to achieve here?