pixelplanet/utils/ocean-tiles/README.md

45 lines
1.1 KiB
Markdown
Raw Normal View History

2020-01-02 16:58:06 +00:00
# ocean tiles
In order to have the ocean and land on the canvas, or any other background pic, we have to create tiles that we can later upload to the canvas with drawOcean.js.
2020-01-02 16:58:06 +00:00
Those are the commands to create tiles in subfolders:
- create folder for tiles:
```
2020-01-02 16:58:06 +00:00
mkdir ./ocean
cd ocean
```
2020-01-02 16:58:06 +00:00
- to split image into tiles:
```
2020-01-02 16:58:06 +00:00
convert ../ocean.png -crop 128x128 +adjoin ocean_tiles%02d.png
```
2020-01-02 16:58:06 +00:00
- upscale and convert to black and white
```
2020-01-02 16:58:06 +00:00
mogrify -resize 2048x2048 -colors 2 -white-threshold 80% -black-threshold 80% ocean_tiles*.png
```
2020-01-02 16:58:06 +00:00
or without dithering:
```
2020-01-02 16:58:06 +00:00
mogrify +dither -resize 2048x2048 -colors 2 -white-threshold 80% -black-threshold 80% ocean_tiles*.png
```
2020-01-02 16:58:06 +00:00
- create subfolders
```
2020-01-02 16:58:06 +00:00
for i in {0..31}; do mkdir $i; done
```
2020-01-02 16:58:06 +00:00
- put into subfolders
```
2020-01-02 16:58:06 +00:00
for file in ./ocean_tiles*.png; do NUM=`echo $file | sed -e 's/.*ocean_tiles//' -e 's/.png//'`; Y=$(expr $NUM / 32); X=$(expr $NUM % 32); newfile="$X/$Y.png"; mv $file $newfile; done
```
2020-01-02 16:58:06 +00:00
- to remove the subfolders again
```
2020-01-02 16:58:06 +00:00
for i in {0..31}; do rm -r $i; done
```
# createOceanTiles.js
createOceanTiles is splitting the generated ocean tiles into 256x256 tiles, skipping the ones that are empty (aka all ocean).