# Heatmap: Assign colors to discrete values

**URL:** <https://discourse.julialang.org/t/heatmap-assign-colors-to-discrete-values/47739>\
**Category:** New to Julia\
**Created:** [October 4, 2020, 3:24pm UTC](https://discourse.julialang.org/t/heatmap-assign-colors-to-discrete-values/47739 "2020-10-04T15:24:48Z")\
**Posts on this page:** 20\
**Page:** 1

<div class="post-metadata">

**Author:** ![pascal-mueller](https://avatars.discourse-cdn.com/v4/letter/p/e47774/32.png) [@pascal-mueller](https://discourse.julialang.org/u/pascal-mueller)\
**Post date:** [October 4, 2020, 3:24pm UTC](https://discourse.julialang.org/t/heatmap-assign-colors-to-discrete-values/47739/1 "2020-10-04T15:24:48Z")

</div>

Hi,

I want to plot a 2D array with heatmap. The array consists of 1s, 2s and 3s. Now I want to assign each value a color, e.g. 1: black, 2: green, 3: blue.

I just can’t figure out how I can do that. 😕

---

<div class="post-metadata">

**Author:** ![BLI](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/bli/32/37206_2.png) [@BLI](https://discourse.julialang.org/u/BLI)\
**Post date:** [October 4, 2020, 4:45pm UTC](https://discourse.julialang.org/t/heatmap-assign-colors-to-discrete-values/47739/2 "2020-10-04T16:45:24Z")

</div>

Something like this?

```julia
julia> using Plots
julia> colGRAD = cgrad([colorant"red",colorant"green",colorant"blue"]);
julia> m=5
julia> n=5
julia> array = rand(1:3,m,n)
5×5 Array{Int64,2}:
 3 1 2 1 1
 2 2 3 2 3
 2 1 1 1 3
 2 1 2 1 2
 2 3 3 2 3
julia> contour(array,fill=true,lw=0,c=colGRAD)

```

leading to:

 ![image](https://global.discourse-cdn.com/julialang/original/3X/e/4/e4f09830c692105eaafdd1eb395767aa1c987945.png)

With `m=100`, `n=100`, I get:

 ![image](https://global.discourse-cdn.com/julialang/original/3X/5/9/59c67fc89804e3b5ff6a1e6074f7d4f067091e37.png)

---

<div class="post-metadata">

**Author:** ![pascal-mueller](https://avatars.discourse-cdn.com/v4/letter/p/e47774/32.png) [@pascal-mueller](https://discourse.julialang.org/u/pascal-mueller)\
**Post date:** [October 4, 2020, 4:49pm UTC](https://discourse.julialang.org/t/heatmap-assign-colors-to-discrete-values/47739/3 "2020-10-04T16:49:50Z")

</div>

Nope, sorry. I meant something like

If I have the Matrix

0 1 2  
2 1 0  
1 0 1

I just want an image out of it. So I have a 3x3 grid with the cells having those values and those colors. 🙂  
I think images.jl does something like that but I’m still trying to figure out how it works.

---

<div class="post-metadata">

**Author:** ![BLI](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/bli/32/37206_2.png) [@BLI](https://discourse.julialang.org/u/BLI)\
**Post date:** [October 4, 2020, 5:04pm UTC](https://discourse.julialang.org/t/heatmap-assign-colors-to-discrete-values/47739/4 "2020-10-04T17:04:40Z")

</div>

Hm. Your description is not very clear to me. In the first question, you referred to a matrix of 1s, 2s, and 3s, where you associated certain colors to each number.

This time you use numbers 0, 1 and 2, instead of 1s, 2s and 3s, and you suggest a 3x3 matrix.

Anyway, you also refer to an image. So:

```julia
julia> im = rand([colorant"red", colorant"green", colorant"blue"],100,100)
julia> plot(im)

```

leads to:

 ![image](https://global.discourse-cdn.com/julialang/original/3X/d/5/d59c1a904805197ebf4b20b8a4cb5be58e21569e.png)

[Of course, the only reason why I use `rand` is because I have no clue as to what matrix layout you want.]

---

<div class="post-metadata">

**Author:** ![BLI](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/bli/32/37206_2.png) [@BLI](https://discourse.julialang.org/u/BLI)\
**Post date:** [October 4, 2020, 5:13pm UTC](https://discourse.julialang.org/t/heatmap-assign-colors-to-discrete-values/47739/5 "2020-10-04T17:13:02Z")

</div>

Using your example:

```julia
mat = [0 1 2;2 1 0;1 0 1]
#
function num2col(i)
    if i == 0
        return colorant"red"
    elseif i == 1
        return colorant"green"
    else
        return colorant"blue"
    end
end
#
num2col.(mat)

```

leads to

 ![image](https://global.discourse-cdn.com/julialang/original/3X/7/9/792fbaed0213a419f5b2648a1396d633ce008d8c.png)  
while:

```julia
plot(num2col.(mat))

```

gives:

 ![image](https://global.discourse-cdn.com/julialang/original/3X/2/1/21d213a5aad22bed55484c44e3a54b57eaa6c65a.png)

```julia

```

---

<div class="post-metadata">

**Author:** ![pascal-mueller](https://avatars.discourse-cdn.com/v4/letter/p/e47774/32.png) [@pascal-mueller](https://discourse.julialang.org/u/pascal-mueller)\
**Post date:** [October 4, 2020, 5:13pm UTC](https://discourse.julialang.org/t/heatmap-assign-colors-to-discrete-values/47739/6 "2020-10-04T17:13:07Z")

</div>

Let me clarify:

0: white  
1: green  
2: red  
3: black

Now, if I have the matrix

```julia
0 3
2 1

```

I’d like to see  
 ![](https://global.discourse-cdn.com/julialang/original/3X/4/5/4592b5efc98ca5edf204743f261e48973a730c37.png)

The problem with plots() is that it introduces an orientation of my data. It flips and/or rotates my data since the axis to have a direction. I just want an image. 🙂

I think images.jl can do that but I didn’t figure it out in the last few hours.

---

<div class="post-metadata">

**Author:** ![pascal-mueller](https://avatars.discourse-cdn.com/v4/letter/p/e47774/32.png) [@pascal-mueller](https://discourse.julialang.org/u/pascal-mueller)\
**Post date:** [October 4, 2020, 5:14pm UTC](https://discourse.julialang.org/t/heatmap-assign-colors-to-discrete-values/47739/7 "2020-10-04T17:14:28Z")

</div>

That looks interesting. How would I generate a image, like .png or .jpg out of this?

---

<div class="post-metadata">

**Author:** ![lmiq](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/lmiq/32/18314_2.png) [@lmiq](https://discourse.julialang.org/u/lmiq)\
**Post date:** [October 4, 2020, 5:14pm UTC](https://discourse.julialang.org/t/heatmap-assign-colors-to-discrete-values/47739/8 "2020-10-04T17:14:33Z")

</div>

> [@BLI](#):
>
> `contour(array,fill=true,lw=0,c=colGRAD)`

Isn’t the confusion here only because you used `contour` here, instead of `heatmap`? This is what you want (replacing that line in @BLI answer):

```julia
heatmap(array,fill=true,lw=0,c=colGRAD)

```

![x](https://global.discourse-cdn.com/julialang/original/3X/d/d/ddf813bb7959ef229a2f1987600a07927df87c26.png)

---

<div class="post-metadata">

**Author:** ![lmiq](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/lmiq/32/18314_2.png) [@lmiq](https://discourse.julialang.org/u/lmiq)\
**Post date:** [October 4, 2020, 5:17pm UTC](https://discourse.julialang.org/t/heatmap-assign-colors-to-discrete-values/47739/9 "2020-10-04T17:17:03Z")

</div>

> [@pascal-mueller](#):
>
> How would I generate a image, like .png or .jpg out of this?

```julia
savefig("./file.png")

```

---

<div class="post-metadata">

**Author:** ![pascal-mueller](https://avatars.discourse-cdn.com/v4/letter/p/e47774/32.png) [@pascal-mueller](https://discourse.julialang.org/u/pascal-mueller)\
**Post date:** [October 4, 2020, 5:17pm UTC](https://discourse.julialang.org/t/heatmap-assign-colors-to-discrete-values/47739/10 "2020-10-04T17:17:45Z")

</div>

I wasn’t able to try that out. What exactly is colGRAD? Furthermore: The axis have an direction, they grow which probably again does introduce an orientation of my data and thus not exactly what I want. Otherwise, the axis would be useless. Thanks 🙂

---

<div class="post-metadata">

**Author:** ![BLI](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/bli/32/37206_2.png) [@BLI](https://discourse.julialang.org/u/BLI)\
**Post date:** [October 4, 2020, 5:19pm UTC](https://discourse.julialang.org/t/heatmap-assign-colors-to-discrete-values/47739/11 "2020-10-04T17:19:12Z")

</div>

`colGRAD` is just a utility variable to store a color gradient set up by the colors in the argument of the `cgrad` function.

---

<div class="post-metadata">

**Author:** ![lmiq](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/lmiq/32/18314_2.png) [@lmiq](https://discourse.julialang.org/u/lmiq)\
**Post date:** [October 4, 2020, 5:19pm UTC](https://discourse.julialang.org/t/heatmap-assign-colors-to-discrete-values/47739/12 "2020-10-04T17:19:26Z")

</div>

```julia
heatmap(array,fill=true,lw=0,c=colGRAD,
        framestyle=:box,xticks=nothing,yticks=nothing,legend=false,
        size=(400,400))
savefig("file.png")

```

![x](https://global.discourse-cdn.com/julialang/original/3X/5/e/5eaa73c413a7d794e00497680a2ccb2320542976.png)

---

<div class="post-metadata">

**Author:** ![pascal-mueller](https://avatars.discourse-cdn.com/v4/letter/p/e47774/32.png) [@pascal-mueller](https://discourse.julialang.org/u/pascal-mueller)\
**Post date:** [October 4, 2020, 5:22pm UTC](https://discourse.julialang.org/t/heatmap-assign-colors-to-discrete-values/47739/14 "2020-10-04T17:22:00Z")

</div>

I’m very confused by Julias docs. What type is colGrad or rather what type does the argument c take? SO I know what kind of “object” I can pass there.

---

<div class="post-metadata">

**Author:** ![BLI](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/bli/32/37206_2.png) [@BLI](https://discourse.julialang.org/u/BLI)\
**Post date:** [October 4, 2020, 5:24pm UTC](https://discourse.julialang.org/t/heatmap-assign-colors-to-discrete-values/47739/15 "2020-10-04T17:24:50Z")

</div>

This is run directly in a Jupyter notebook:

 ![image](https://global.discourse-cdn.com/julialang/original/3X/a/4/a404cfdb1e3b32a9c57865b704ad839c7ab5dfcb.png)

---

<div class="post-metadata">

**Author:** ![BLI](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/bli/32/37206_2.png) [@BLI](https://discourse.julialang.org/u/BLI)\
**Post date:** [October 4, 2020, 5:25pm UTC](https://discourse.julialang.org/t/heatmap-assign-colors-to-discrete-values/47739/16 "2020-10-04T17:25:28Z")

</div>

To find the type, simply do:

```julia
typeof(colGRAD)

```

---

<div class="post-metadata">

**Author:** ![pascal-mueller](https://avatars.discourse-cdn.com/v4/letter/p/e47774/32.png) [@pascal-mueller](https://discourse.julialang.org/u/pascal-mueller)\
**Post date:** [October 4, 2020, 5:29pm UTC](https://discourse.julialang.org/t/heatmap-assign-colors-to-discrete-values/47739/17 "2020-10-04T17:29:49Z")

</div>

Yeah - had a dependency issue on my system I didn’t catch. I’m also very new to Jupyter and probably did some stupid thing.

Got it working, thanks.

---

<div class="post-metadata">

**Author:** ![BLI](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/bli/32/37206_2.png) [@BLI](https://discourse.julialang.org/u/BLI)\
**Post date:** [October 4, 2020, 5:32pm UTC](https://discourse.julialang.org/t/heatmap-assign-colors-to-discrete-values/47739/18 "2020-10-04T17:32:45Z")

</div>

I’m using the `Plots.jl` package (usually). The documentation is somewhat difficult to figure out, but when you work through it and do some examples, it is possible to figure out most (?) possibilities: `http://docs.juliaplots.org/latest/`.

---

<div class="post-metadata">

**Author:** ![pascal-mueller](https://avatars.discourse-cdn.com/v4/letter/p/e47774/32.png) [@pascal-mueller](https://discourse.julialang.org/u/pascal-mueller)\
**Post date:** [October 4, 2020, 5:39pm UTC](https://discourse.julialang.org/t/heatmap-assign-colors-to-discrete-values/47739/19 "2020-10-04T17:39:18Z")

</div>

I wished there were a thing like the C++ Reference.

With dependencies I meant ImageMagick Package + local installation of it. Somehow it needs that. 🙂

---

<div class="post-metadata">

**Author:** ![BLI](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/bli/32/37206_2.png) [@BLI](https://discourse.julialang.org/u/BLI)\
**Post date:** [October 4, 2020, 5:45pm UTC](https://discourse.julialang.org/t/heatmap-assign-colors-to-discrete-values/47739/20 "2020-10-04T17:45:00Z")

</div>

Well, I don’t think it is fair to complain about the documentation. Remember that these are free tools; the contributors provide code which is often developed in their free time.

---

<div class="post-metadata">

**Author:** ![pascal-mueller](https://avatars.discourse-cdn.com/v4/letter/p/e47774/32.png) [@pascal-mueller](https://discourse.julialang.org/u/pascal-mueller)\
**Post date:** [October 4, 2020, 5:52pm UTC](https://discourse.julialang.org/t/heatmap-assign-colors-to-discrete-values/47739/21 "2020-10-04T17:52:41Z")

</div>

Of course and I appreciate everyone spending time on something like that. I try myself to report bugs and write stuff if possible.

[Next page](https://discourse.julialang.org/t/heatmap-assign-colors-to-discrete-values/47739.md?page=2)