Click here to Skip to main content
13,406,109 members (47,456 online)
Click here to Skip to main content
Add your own
alternative version


22 bookmarked
Posted 7 May 2008

A C++ blob editor in less than 128 lines of code

, 7 May 2008
Rate this:
Please Sign up or sign in to vote.
A very simple C++ source code showing how to create an interactive 2D graphical blobs editor, using the CImg library.



This article provides a very small piece of C++ code (less than 128 lines) that creates a simple but functional 2D blobs editor.

The editor consists of a main window where the user can create, delete, and move blobs having random sizes and colors. The underlying algorithm is based on implicit functions to create and merge blobs together. This is very similar to the famous Metaballs technique, but here, applied on 2D functions.

A video of this proposed blobs editor can be seen here.


This project illustrates the use of a very handy and simple image class provided by the CImg Library, a C++ template image processing toolkit. It allows to shorten the code by focusing on the algorithm itself, instead of having to do all the low-level image stuffs.

CImg is a very portable library, so I've been able to provide both Windows and Linux executables of the same program in the above archive.

Using the code

The code is quite small, and mainly consists of a main event loop, waiting for user interaction. When the user clicks the mouse with the left button, it creates a blob (or moves an existing one). Using the right mouse button deletes a blob. The colors and sizes of the created blobs are randomly chosen.

The code uses the main image structure of the CImg library, which is, in our case, a CImg<unsigned int>, i.e., a 2D container of pixels of type unsigned int. Pixel access and modification are classically done through the function CImg<T>::operator(), which is provided with the image class.

The blob positions, sizes, and colors are stored in lists structures, also provided by the CImg library (although, it would be possible to use std::vector<> instead).

Finally, the display window is created and updated using the CImgDisplay class of the CImg library, which is great since it is simple to use and multi-platform, so the same code will work the same way on different architectures.

From a mathematical point of view, each blob is considered as an implicit Gaussian function. All the blobs are added into a potential field (here, described by the main image img). Then, this potential field is colored and threshold-ed according to the blob colors and sizes. As a result, a color version of the potential field that contains the blobs is created. Additionally, small reflections are drawn with successive spheres located relative to the blob coordinates, in order to create the final rendered blob image.

Points of interest

I think this code is a nice way to discover the use of implicit functions to model simple mathematical objects. The same kind of techniques are applied in 3D rendering for doing metaballs, and is heavily used nowadays to model smooth 3D objects.

From a more technical point of view, it may make you discover the CImg library, which is a nice C++ toolkit for doing generic image processing. It really simplifies the coding of algorithms related to images, as well as provides a lightweight and multi-platform development framework for image/signal processing.

I really hope you'll enjoy this piece of code.


This article, along with any associated source code and files, is licensed under The GNU General Public License (GPLv3)


About the Author

France France
No Biography provided

You may also be interested in...


Comments and Discussions

GeneralTres Jolie Pin
Member 364564823-Aug-08 17:06
memberMember 364564823-Aug-08 17:06 
Generalsome minor issues Pin
peterchen7-May-08 1:04
memberpeterchen7-May-08 1:04 
GeneralRe: some minor issues Pin
Ronounours7-May-08 1:54
memberRonounours7-May-08 1:54 
GeneralRe: some minor issues Pin
Guillaume Geffard7-May-08 2:56
memberGuillaume Geffard7-May-08 2:56 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.

Permalink | Advertise | Privacy | Terms of Use | Mobile
Web03 | 2.8.180221.1 | Last Updated 7 May 2008
Article Copyright 2008 by Ronounours
Everything else Copyright © CodeProject, 1999-2018
Layout: fixed | fluid