Download

Sample - Islands

This is a tool written in Javascript and uses HTML5. I recommend that you use the latest version of Firefox, Chrome, or Opera.

Chrome and Opera seem to run faster than Firefox.

When local HTML files (e.g., those located on your hard drive) are loaded into the browser, the scripts and links within have restrictions on what they can see and do. Those restrictions are determined by the same-origin policy for local files.

Chrome and Firefox have a default same-origin policy for local files that prevents this heightmap colorer from working correctly.

Firefox users:
1. Open a new tab and type about:config
2. Search for security.fileuri.strict_origin_policy
3. Double click this entry and set it to false.

Chrome users:
1. Right click the shortcut that you use to open Chrome and select properties
2. Add " --allow-file-access-from-files" to the end of the target box (no quotes)
3. Push ok

Open heightmap.html to get started.

How it works:
The heightmap is a 512x512 grayscale image. The color of each pixel represents the height that the blocks will be at that point when run through the converter. For gray images at a given pixel, the red, blue, and green color channels will all have the same value.

This program goes through every pixel of the heightmap, takes the value of its red channel, then looks up the corresponding pixel on the gradient image. This color from the gradient image determines the color of the pixel in the color map.

For example, take a pixel on the heightmap at (52,67) with a rgb value of (124,124,124). When the color map is generated, the color of the pixel at (52,67) will be set to the same color as the color at (124,0) of the gradient.

After you've pressed the generate button, you can save the output heightmap, color, and gradient images by right clicking them.

Options:

Color filename
This filename is needed if you arn't generating the colors, but are instead using this program to add shadows or extract the gradient.

Heightmap filename
This heightmap determines how high certain areas of the map are.

Gradient filename
This filename is needed if you are generating colors from a heightmap.

Generate colors
If this box is checked, then the program will use the gradient to make a color map. For example, you would uncheck this if you want to add shadows to an already existing colormap.

Generate shadows
If this box is checked, then shadows are added to the color map based on the heights given by the height map.

Autofix heightmap
The bitmap converter does not allow pixels to have an rgb value below (4,4,4). If this box is checked, any pixels on the heightmap below (4,4,4) will be set to (4,4,4).

Sun angle (degrees)
This setting determines how long the shadows will appear. This number should be in the range of 0-90.

Sun lightness
The red, green, and blue channels of areas not in shadows will be multiplied by this value.

Shadow darkness
The red, green, and blue channels of areas in shadows will be multiplied by this value.

Shadow blur radius
This determines the size of the box blur to be used to blur the shadows to make them look nicer.

Shadow blur passes
This determines the number of times that the box blur algorithm will be run on the shadows.

Noise
This determines the amount of noise that is added to the color map when everything is completed.

Generate gradient
If this box is checked, then a gradient will be generated based on the given color and height maps. The gradients sent with the program were extracted from the default map using this.

sounds more detailed than more of these other map maker things

great! i'll be playing with this, should come in handy

thanks for releasing it

that looks pretty cool, i might give it a try. i hope to see some interesting stuff with this tool

First he makes the coolest mod around, then the coolest map editor!! Awesome work!
BTW , i added a new server to promote your classes mod! :)
Jojoe 1 and 2, now we can go in and play our own stuff, without waiting in line too long :)

Hope to see you playing soon, i will join your squad :)

++ Thanks for the tool!

I added that to Chrome's target, but the Generate button does absolutely nothing. Help?

^ Use Firefox?

Just discovered this little toy and added it to my collection of tools. Well done.

Doesn't do anything when I press Generate. I tried using Firefox and Chrome D: Help??

You're doing it wrong.

How exactly do I do it "right?"

Off topic: TWSS

Okay, I am getting my friend to try it. If this works, we have endless mapmaking possibilities!

Doesn't work in chrome 16.0.889.0 dev. Works in Opera Next.

It works in opera?

Sorry to annoy you.
But how do I use this?
I get a bit confused with map makers.

@Winston_

To use this, you need to first make a heightmap. This can be easily done with JoJoeStinky's heightmap creator in Blender. After you render it in Blender (F12) you have to save it as a bmp (F3) This will create a heightmap. Then, you put this BMP in the folder you get from this thread, input it into the .HTML file, and there you go.

My question: Does it work in Opera?