Show Sidebar Hide Sidebar

Horizontal Bar Charts in Plotly 2.0

Create one of the most common chart types, in a horizontal fashion.

Step 1

Try an Example

A bar graph is a chart that uses either horizontal or vertical bars to show comparisons among categories.

After selecting 'Bar chart' under 'Chart Type', you can check out an example before adding your own data. Clicking the 'try an example' button will show what a sample chart looks like after adding data and playing with the style. You'll also see what labels and style attributes were selected for this specific chart, as well as the end result.

Example after

You can also use the data featured in this tutorial by clicking on 'Open This Data in Plotly' on the left-hand side. It'll open in Plotly’s online workspace.

Open data

Step 2

Add Your Data to Plotly

Head to Plotly’s new online workspace and add your data. You have the option of typing directly in the grid, uploading your file, or entering a URL of an online dataset. Plotly accepts .xls, .xlsx, or .csv files. For more information on how to enter your data, see this tutorial.

Import data main

Step 3

Create a Chart

After adding your own data, go to GRAPH on the left-hand side, then 'Create'. Choose 'Bar chart' under 'Chart type'.

Choose chart main

Click on GRAPH on the left-hand side to add your y-axis and x-axis to your stacked bar chart. After selecting ‘Bar chart', you should then fill out the Y and X dropdown to create the plot.

Adding x and y axis

This will create a raw stacked chart, as seen below.

Adding x and y axis

For charts that have more than one set of values such as this one, we need to add more data on the y-axis. We do this by clicking on the '+Trace' button at the top right-hand side of that pane.

Trace open

You can add as many traces as you need, until your plot is complete!

Finished traces

This plot looks good so far and has all the traces we need, but we want to make this a horizontal bar chart. By going to the 'Traces' tab under STYLE, we can see that bars are selected as 'Vertical' by default.

Vertical bars

All we need to do is select the bar as 'Horizontal', and it's not even necessary to do this to every trace. As you can see in the GIF below, it changes them all at once.

Select horizontal

While we're here, we'll also mention that you can make this a stacked bar chart by selecting the 'Stacked' option in this very same section. Check out this great tutorial for more information.

Stacked bar

Step 4

Style a Chart

Let's have some fun and style this plot! You can choose your colors, text position, or typeface. Click on STYLE on the left-hand side to play around with the style of your chart.

To change the colors of your bars, select ‘Traces’ under the same STYLE tab, then click on FILL and a color pop-up will appear. As you scroll down that pane, each bar will have its own FILL color that you can change. Note that certain colors and typeface are only available with a PRO subscription. Click here to upgrade!

Colour main

To add a title to your plot, you can type it directly on the title by double-clicking it.

Type directly title

The same can be done for the axis labels and legend.

Type directly legend

Another option is to visit the 'Layout' section under STYLE, click on 'Text' and enter your title in the box, as shown below.

Type in layout panel

We've also added a subtitle, which you can do by going to the 'Notes' section. For more information about annotations and the different types of notes that can be added to your plot, visit this page!

Subtitle

Step 5

Save and Share

Your chart is now done! Click SAVE on the left-hand side.

Save main

After giving your PLOT and DATA a name, select them as 'Public' or 'Private'. For more information on how sharing works, including the difference between private, public and secret sharing, visit this page.

Save pop-up

Still need help?
Contact Us

For guaranteed 24 hour response turnarounds, upgrade to our Premium or Enterprise plans.