0:01

D3 provides you with different types of

scale when you want to convert numbers to numbers,

but they also provide you with scales when you want to

convert categorical value to numbers.

Those types of scales is what we call ordinal scales.

The way it works is basically,

you want to map a value in the original space to a value on the graphic space.

So, one thing is important here is that,

it doesn't have to be a number on the graphic space.

So, for example you can use ordinal scale is also mapped to color,

so if you want to associate a different color to

each name that you have in your data set,

you can also use ordinal scales and but the idea here is exactly that.

So, the values that are going to come as input are categorical values,

are values that it can be strings,

it can also be numbers but they don't have any specific order or specific range.

So, therefore, when we create this scale ordinal,

we're going to show using the same thing that we had before.

We have d3 scale and here we are creating one that's called scale ordinal.

Then we call our domain,

the difference here the domain is not going to be a range anymore,

it's going to be a list of values,

is how the values that I can assume on this scale.

Then we're going to have the range and the range is specifically for the scale ordinal

is going to be the list of values that are going to assume all my graphic space.

So, for example imagine that I want to map the colors,

I'm going to have the list of names on

my domain and then I'm going to have the list of colors on my range.

So, for example here we create a scale where we want to map A,

B and C, think as that as grades for example.

We want to map those two actual numbers.

So, we can for example change the intensity or the size of things on our graphic space.

So, what we are doing is mapping A to 10,

B to eight and C to six.

So, later if I call my scale and passed as parameter the letter A,

I'm going to get 10 and the same thing's going to happen if I pass my letter C,

I'm going to get six,

and you can add as many items you need in your list.

But you always have this is one to one map between what you put in

the domain and what you get on as output of your scale.

There is other options of ordinal scales and one of such is what we call Scale Band.

Different from ordinal scale that maps the values to a number,

here we're mapping the values to a band.

So, think about a range.

So, for example, here I have 100 and I have three people.

So, now I just basically split this 100 in

three pieces and each of those pieces are my bands.

Now I'm going to map each name to one of those bands.

What's the difference of mapping to a number?

The difference is that first,

instead of getting some number in the middle,

if I give the number to the scale I'm going to actually get the start of the band,

where the band begins.

The second thing is that,

now we have information about the band we need,

that is how tall in this case would be each of those pieces.

This is very helpful if you're drawing a bar chart for example,

because you can use this scale to decide the width of

your bar such that your bar can adjust to the number of elements that you have.

So, if you have many elements,

your bars are going to be thinner or if you have

less elements your bar is going to be a little thicker,

so you can use more of the space that you have.

How we use this scale band?

So, similar to the scale where do now,

we're going to do dot scale band to create the scale.

Then you're going to call dot domain,

and the domain here same thing is going to be the list

of values that we can have in our data.

Then you're going to call range,

so range is different,

because range is going to be similar to a numeric scale.

We want a range of values,

the minimum and the maximum and again it can be zero to 300 to 400.

So, if I'm doing a bar chart for example,

is going to be the width of the places where I can put my bars.

So, if my chart has 300 pixels,

it will be from zero to 300 pixels.

So, here we have the same example.

So, note that we have the same domain,

we have scale band,

the domain is the same,

but now we change the range.

So, the range is a number from zero to 300.

So, what the system is going to do,

is basically take this 300 and split in chunks of 100 pixels each.

So, you basically divide it by three because this

is the number of elements that we have in our domain.

So, once I have those chunks,

if I call this function,

what I get is the beginning of the chunk.

So, note that the beginning of the chunk A is going to be zero,

the beginning of the chunk B is going to be 100,

because that is where the first chunk ends.

So, it's not like an numerical scale that you would think if it's in

the middle we're going to be a 150 because it's half no,

that's the beginning of the chunk.

So, the same thing if I run to see I'm going to get 200,

because then plus the width,

I'm going to get the 300 space that I have available.

If I want to get the width,

I can just use a scale dot bandwidth to get what's the size of each band.

So, keep in mind that we can use ordinal scales to map

values that are mostly categorical or even ordinal

but they are not really numerical you don't do arithmetic functions

with them to information on geographic space that can be a number.

But can also be a categorical value like colors or any type

of information that you may use in your visualization.

So, if we are dealing with data that in the original format has numeric shape,

most of the time you're going to be using numeric scale,

but if we are dealing with data that are categorical or ordinal shape,

than most of the time you're going to be working with ordinal scales.