Picture Maker and noise function

Several months ago I was working on some javascript that I was hoping would be able to draw random pictures that look like paintings.  The drawing would be guided by the user clicking on the image as it randomly changes.  This would alter the random drawing to use more of the color that you clicked on.



I eventually got something working that is kind of cool.  It draws random circles and changes colors based on colors that you click on.  It is kind of cool, but the pictures don't look very good.  They look like a bunch of confetti thrown on a page.  I wanted it to look like a painting.

More recently I went through a training course on Khan Academy called Natural Simulations.  One of the topics covered was noise.  More specifically Perlin noise.  It just recently occurred to me that I could use noise to make my painting script look a lot better.

This is a picture of some clouds that I generated using one of the exercises in the course.

The Khan Academy course uses processing.js which has a noise function built in.  To get processing.js working on your page you have to setup your code in kind of a weird way.  I don't like it but there are other javascript implementations of Perlin noise so it doesn't really matter.

I have started working on changing my old random drawing code to use some of these ideas from the course.  Hopefully in the next couple of days I will have something working.  I'll make another post when I do.