*108*

# Axis API in D3.js

D3 facilitates the functions to design the axes. It is a build-up of **Labels, Ticks, and Lines**. An axis can also apply a Scale. Thus, the entire axis will require any scale to implement.

## Configuring API

We can use the following mentioned script to configure this API.

### Methods of Axis API

D3 facilitates some essential functions to design the axes, which are discussed below.

**d3.axisTop():** It is a method/function applied to draw the horizontal axis on the top.

**d3.axisRight():** It can be used to draw a vertical axis, i.e., **right-oriented**.

**d3.axisBottom():** It is used to draw a horizontal axis at the bottom.

**d3.axisLeft():** This method is applied to draw the vertical axis on the left.

Let’s understand by a few examples.

**Example 1:**

To include the x-axis on a graph (using d3.axisBottom()).

**Output**

**Example 2:**

Let’s understand how to include the y-axis on a graph (using d3.axisLeft()) in the following illustration:

**Output:**

**Example 3:**

Let’s get the above two mentioned axes together:

**Output:**