Fun mosaic effect with Go

[流星99.Run-Feed2News]

=-= [摘要] -=-
A few months ago I saw a cool mosaic effect in a Wired ad for CA Technologies. Here
’s what part of the ad looked like: I liked the ad, so I wondered how they did it.
Can you see out how to create a similar effect? Take a minute to figure it out as
an […]

=-=-{内容} =-=-=-=-=-=-=-=-=-=-=-=-=-=-

A few months ago I saw a cool mosaic effect in a Wired ad for CA Technologies. Here
’s what part of the ad looked like:

I liked the ad, so I wondered how they did it. Can you see out how to create a similar
effect? Take a minute to figure it out as an exercise.
Here’s what I came up with: divide the image into tiles. For each tile, compute
an average overall color for that tile. Then go back and blend every pixel in that
tile with the average color. So if a tile is partly dark and partly blue, the average
color is a dark blue, so the blue in that tile becomes even darker. I like that
the effect is pretty simple once you figure out how to do it.
Of course, once I had an idea of how to do it, I wanted to write some code and see
whether I could recreate the effect. Go has good libraries for handling images and
I’ve been meaning to try Go. I ended up with about 70 lines of moderately-ghastly
Go code that did the job.
For this Creative Commons image (thanks Fuelrefuel/Wikimedia CommonsFuelrefuel/Wikimedia
Commons!)

I ended up with a photomosaic like this:

As far as I can tell, that’s pretty much the same filter that ran in the ad. Here
’s another example. First, a picture of me:

and here’s the resulting mosaic’ed image:

*That’s all the interesting stuff. You can stop reading now.*
This part is boring. Really. No need to keep reading. The code I came up with is
really ugly, but the pseudo-code is pretty simple:


- Read the picture into a go image

- Number of horizontal tiles = image_width / desired_tile_width

- Number of vertical tiles = image_height / desired_tile_height

- Loop through tiles with nested vertical and horizontal for loops

- For each tile, loop over the tile's pixels to compute average RGB values

- Loop over the tile's pixels again & set new_color = (avg_color+curr_color)/2

- Write the image out as a new picture

That’s it! I wanted a quick and dirty test, so I didn’t worry about things like
the leftover pixels if the tiles didn’t evenly divide the image.
Let’s see, what else. Things I liked about Go:
– It’s super-easy to read and write images, so I could concentrate on the fun
stuff.
– I like that documentation like thisdocumentation like this gives a clear, easy
way to set up your environment. The golang tourgolang tour is great too. And installing
Go on Ubuntu is easy: “sudo apt-get install golang” and you’re done.
– The language makes a lot of sense to me, in a C kind of way.
Some things didn’t make as much sense to me, or at least I need to do more reading:

– My initial program just read a JPEG and wrote it back out, and the output image
was considerably dimmer. I was just using default encoding values, so maybe some
gamma values got left out, but it was a little weird. I was expecting read->decode->encode->write
to be a no-op.
– When I read the JPEG into an image and tried to write directly to that image,
Go gave me an error. That was a little strange. I ended up copying the JPEG to a
new image and then I could write.
– In the spirit of just doing stuff without reading the documentation, it seemed
like Go images stored their At() component colors with 16 bits of range (from 0..65536).
But when I wanted to write colors with Set() it seemed like Go wanted 8 bits in
the example I foundGo wanted 8 bits in the example I found. So for a while I was
casting stuff with (uint8) and getting totally random bits written into the image.
That also generated a fun image:

but it took me a few minutes to figure out what was going on. I’m sure some reading
would clear things up, but.. who cares? I was also doing some weird float arithmetic
to compute color averagesaverages. This was just quick/dirty code, and I can read
more about the nitty gritty later. As soon as I got the effect I wanted, I rapidly
lost interest. I even hard-coded image filenames because I couldn’t be bothered
to search for go command-line flaggo command-line flag info. All in good fun.
– Arrays and slices are cool, but allocating 2D arrays and slices seems a little
verbose.
– I like that Go’s designers have opinions and enforce them, at least 99% of the
time. When you’re hacking ugly code, it was annoying to get the “you didn’t use
this variableyou didn_t use this variable” errors. But I understand the rationale
and it’s probably a good idea for writing Real Code that’s not intended to be
thrown away.
– I was all set to grouse about go fmt’s enforced indentations/spacing, but it
actually looks pretty reasonablelooks pretty reasonable. Basically, each indent
is a tab. Then if you’re a 3 or 4 space indent kind of guy, you can configure your
editor like vim or emacs to change how the tab width is displayedchange how the
tab width is displayed.
Historically, Python is my language of choice to knock out a quick script thing
–I love Python dictionariesPython dictionaries. But with Go’s speed, support for
dictionaries/maps, and capability to do HTTP servers very easily, I might end up
switching to Go. I think I’ll use Go for my next little fun project.

-=--=-=-=-=-=-=-=-=-=-=-=-=-=-===---===-=--====-=

-=-{ =-= }-=-
组：cn.edu.lang.english
标签: Fun,How to
=-={ -=- }=-=


**链接**：

Photomosaic of people in an office
https://www.mattcutts.com/images/ca-ad.jpg
----

https://www.mattcutts.com/images/ca-ad.jpg
----
Fuelrefuel/Wikimedia Commons
http://commons.wikimedia.org/wiki/File:Teliris_VL_Modular.JPG
----
Photo of people in an office
https://www.mattcutts.com/images/1024px-Teliris_VL_Modular.JPG
----

https://www.mattcutts.com/images/1024px-Teliris_VL_Modular.JPG
----
Photomosaic of people in an office
https://www.mattcutts.com/images/videoconference-mosaic.jpg
----

https://www.mattcutts.com/images/videoconference-mosaic.jpg
----
Matt Cutts
https://www.mattcutts.com/images/matt-cutts-avatar.jpg
----

https://www.mattcutts.com/images/matt-cutts-avatar.jpg
----
Matt Cutts in mosaic form
https://www.mattcutts.com/images/matt-cutts-avatar-mosaic.jpg
----

https://www.mattcutts.com/images/matt-cutts-avatar-mosaic.jpg
----
documentation like this
https://golang.org/doc/code.html
----
golang tour
http://tour.golang.org/welcome/1
----
Go wanted 8 bits in the example I found
http://blog.golang.org/go-image-package
----
Random mosaic from converting a 16 bit-range color to uint8
https://www.mattcutts.com/images/random-squares.jpg
----

https://www.mattcutts.com/images/random-squares.jpg
----
averages
http://www.bennadel.com/blog/1627-create-a-running-average-without-storing-individual-values.htm

----
go command-line flag
https://gobyexample.com/command-line-flags
----
you didn t use this variable
http://golang.org/doc/faq#unused_variables_and_imports
----
looks pretty reasonable
https://groups.google.com/forum/#!topic/golang-nuts/9iwZTmBg8hk
----
change how the tab width is displayed
http://www.reddit.com/r/golang/comments/unc7a/match_go_fmt_to_settings_in_vim_with_4space_tabs/

----
Python dictionaries
https://docs.python.org/2/tutorial/datastructures.html#dictionaries

--
Feed2News：从RSS、ATOM上面转载内容到新闻组里面
作者： NewBlue < beyooo (at) GMail (dot) COM >
管理员：流星99 < liuxing99 (at) GMail (dot) COM >