Waiting for QGIS 2.2 – Gradient Fills

One of the big features I worked on for QGIS 2.2 is gradient fill symbols for polygons. In my view QGIS’ symbol support is one of its biggest strengths — the versatility of its symbol layers coupled with the powerful data defined properties support allows for so many effects which just aren’t possible in other GIS packages. Gradient fill support is a nice addition to these features and should help make QGIS even more attractive to cartographers. In this post I’m going to give a quick run through of how gradient fills work in QGIS, and some of the options available for tweaking them.

Gradient fills are enabled through the Style tab in the properties for a vector layer. The default fill for a polygon in QGIS is “Simple fill”, so to switch a layer to a gradient fill you first need to select the “Simple fill” layer, then change the “Symbol layer type” dropdown  to “Gradient fill”:

Gradient Fill type

As you can see, there’s a lot of options in QGIS which can be tweaked for gradient fills. I’ll run through each of them now and explain a little bit about how each one can be used.

Colour modes

QGIS supports two different types of colour modes for gradient fills. The first is a simple “Two color” gradient, where the colour smoothly blends from the first colour to the second. The second mode, “Color ramp” allows you to use any of the standard or user-defined QGIS colour ramps, which can consist of multiple colour stops:

Colour options in gradient fills

Colour options in gradient fills

So, when would you use these options? Well, any time you need more than two colours or need to tweak the position of any of the colours in the gradient you’ll have to use a colour ramp.  If instead you’re just wanting a quick-and-easy gradient then the two colour option might be more suitable.

One last important distinction is that the colours in a two colour gradient can be set using a data defined expression:

Data defined gradient colours

Data defined gradient colours. Please try to use them more tastefully then this!

Gradient types

The next option for gradient fills is rather self-explanatory: gradient types. QGIS supports linear, radial and conical gradients:

Gradient types

Coordinate modes

The coordinate mode option is a little trickier to explain. The default setting, “Object“, will cause the gradient to be drawn entirely within each separate feature. You can see in the example below that every lake feature is coloured with a gradient which starts with light blue in the top left and darkens to a deeper blue in the bottom right. This gradient fill is repeated for all the lake features:

Gradient object coordinate mode

The “Object” coordinate mode for gradient fills

In contrast, the “Viewport” coordinate mode causes the gradient to be drawn across the entire current view of the map. So only the lakes in the top left of the map are drawn with the light blue colour, and the lakes in the bottom right with the deeper blue:

Gradient "viewport" coordinate mode

The “Viewport” coordinate mode for gradient fills

The choice of coordinate mode will depend entirely on your cartographic desires for your map!

Reference points

QGIS gradient fills allow the setting of two “reference points“. These points control where the gradient fill begins and ends. It’s easiest to visualise how these work by imagining a square defined by the points (0, 0) in the top left and (1, 1) in the bottom right. The two reference points fall somewhere within this square. So, the default reference points of (0.5, 0) and (0.5, 1.0) represent points mid way along the top edge and and the bottom edge, respectively.

Now imagine that this square forms the bounding box for the feature being drawn (or the current map window, if in “viewport” coordinate mode). The default reference points mean that the gradient will be drawn from the middle of the top edge to middle of the bottom edge of the feature. Reference points of (0, 0) and (1, 1) would mean the gradient is drawn from the top-left to the bottom-right. Similarly, reference points of (0.5, 0.5) to (1.0, 1.0) would draw a gradient from the middle of the feature to the bottom right (good for radial gradients).

Example gradient reference points

There’s also the option to set either of the reference points as the feature centroid, which again can come in handy for radial or conical gradient types.

Gradient spread

If you’ve got your head around the reference points concept, then the next setting for gradient fills affects how the gradients spread. This takes effect whenever a gradient starts or ends before the bounds of the feature. The default setting of “pad” means that the gradient will simple “pad” out any extra space with the start or end gradient colour:

Gradient "pad" spread

“Pad” spread – notice how the darker blue is stretched across the right side of each feature

Repeat” mode will tile the gradient across the feature:

Gradient "repeat" spread

“Repeat” spread

Finally, “reflect” mode will draw a reflected version of the gradient to fill up any extra space:

"Reflect" spread

“Reflect” spread


Last of all, there’s a simple “angle” parameter, which allows you to rotate the entire gradient fill. This option is included mostly for use with data defined symbols, since a similar effect can be achieved by changing the gradient reference points. Amongst other effects, this is useful for achieving a “sun glint” on water, where each gradient is drawn in a random direction (more on this in a later blog post):

Data defined gradient angles

Random data defined gradient angles

This leads me into my final note… all of these properties can be data defined! So you could have a column in your data controlling whether each feature is drawn with a radial or linear gradient, or whether the gradient in a given feature should be drawn at a specific angle, or that the gradient in a feature should start at the centroid and end at the top right of the feature!

I’m excited to see what the QGIS user community is able to create using this new gradient fill feature when 2.2 is released. If you’ve already had a chance to play with the dev version of 2.2 and have something to show off, make sure you submit your map to the Flickr QGIS Map Showcase!

Tagged , , , ,

11 thoughts on “Waiting for QGIS 2.2 – Gradient Fills

  1. Chourmo says:

    Nice ! It would be even better if gradients could be started from the limit of a feature. For instance to make a gradient on a distance from a seashore.

    • Nyall Dawson says:

      I totally agree – for me the holy grail is buffered gradients inside a feature. Kind of like this map http://mapdesign.icaci.org/wp-content/uploads/2012/04/Atlas_NatGeo.jpg (although imo that’s not a particularly great example). Linear/spherical/conical gradients were much easier to implement as a starting point — buffered gradients are significantly harder!

    • Jakub Sisak says:

      Could not agree more. Nothing revolutionary here. ESRI have had these features including buffered which I do not see as an option here for over a decade.
      Unfortunately not even buffered gradients are ideal for cartographic emulations of waterbody depths for example; the esri tool can only buffer using intervals, symbology cannot ignore holes hence larger complex polygons look inconsistent, and mainly it is so painfully slow which renders this tool pretty much unusable for real cartography.

      I always end up doing these things manually because even though options exist they are meant for extremaly simplistic scenarions. What would be nice to see is a parameter driven gradient tool that can be interval independent (true gradient not negative buffers), would allow to ignore holes of certain size, and would render as fast as a solid symbol.

      • Nyall Dawson says:

        Guess I missed the part where ArcMap became free and open source 😉

        And yes, as I mentioned, a better variant of buffered gradients would be a fantastic feature to have. It’s not an easy task though — are you interested in sponsoring work on this feature?

      • Nyall Dawson says:

        btw – nice photos!

  2. […] allow you to visualize polygons with a gradient fill. See Nyall Dawson show some great examples on his blog. Additionally you will be able to easily flip the color ramp for features in QGIS 2.2. This seems […]

  3. […] IMPROVEMENTS (PART 2) Nyalldawson.net – WAITING FOR QGIS 2.2 COMPOSER IMPROVEMENTS (PART 3) Nyalldawson.net – WAITING FOR QGIS 2.2 GRADIENT FILLS Nathan’s – Waiting for QGIS 2.2: Highlighting current Atlas feature Digital-Geography.com […]

  4. […] dostępnym przy wypełnieniu obiektów gradientem barw. Więcej szczegółów można znaleźć pod tym adresem. Symbolizacja Wartość unikalna i Symbol stopniowy pozwalają kategoryzować dane na podstawie […]

  5. […] existentes: de este modo ahora podremos definir el color de relleno de los polígonos mediante un gradiente, aplicado bien desde el centroide del polígono, bien como un gradiente de tipo cónico, radial, […]

  6. […] a bit of background, QGIS 2.2 introduced a gradient fill style for polygons, which included linear, radial and conical gradients. While this was a nice […]

  7. […] intensa tasca per tal de millorar les possibilitats existents: color de farcit dels polígons amb gradient aplicat des del centroide, gradient cònic, radial, lineal,… inversió de les rampes de […]

Leave a Reply

Your email address will not be published.