#HowTo color charts and maps with 23degrees.io

How to change, add or remove colors

Since one of the first things you’ll probably want to edit when creating a data visualization are colors, we made it really easy for you to add, remove and change colors as well as save entire color palettes.

When picking colors for your visualization you start off from a pre-defined set of colors: color set or color palette. This palette can be edited at any time.

Simply click on a color in the color palette and the color picker will open. Add colors to the palette by clicking the Add New Color icon, remove them by clicking on the bin icon.

There are two ways to change the colors inside the color palette.
Either by moving the cursor on the color picker or by typing in the values for RGB, HSL or HEX color models.

Color picker
Color picker

You can save a color set and create as many palettes as you want. Organize palettes in folders and retrieve them whenever you create new charts or maps.

Keep in mind that the coloring of charts and maps is based on the elements (value, text, time, geo) that occur inside a column of a dataset. Depending on whether these elements are “strings” (text, time, geo) or “values” the coloring options will vary.

Coloring your map according to a value field will leave you with the most options in the color editor. This is best illustrated by creating a map and then going to the color section inside the editor. The value field should already be set as default in the color editor when working with maps.

You can now choose between 4 types to color your map (Continuous, Range, Gradient, Solid).

If you want to color your map or chart according to categories (i.e text, geo, time) instead of values, simply klick on the dropdown menu and select your preferred Data Field. In this case we chose the Import / Export field to color the bars but you could select any other column in your dataset.

Keep in mind that if you switch between value and category fields, it can be beneficial to also switch your visualization type. In this case we switched from Map to Barchart.

Below the color palette you will find the Settings. Here, all the elements contained in your selected data field are listed and colors can be attributed to them simply by clicking on the color.

If there a lot of different items in your data field (e.g. all world countries ) klick on the + icon to see the entire list of items contained in the data field column.

Tired of color theory? Go to 23degrees.io and create your own data visualizations.

Follow us!

twitter: @23degrees_io
fb: @23degrees.io
ig: @23degrees_io

Data visualization tool. Discover & create interactive #dataviz at http://app.23degrees.io

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store