When you have a lot of data to display and compare, it might fit better in a horizontal bar chart. You can easily convert a vertical bar chart into a horizontal one by changing the type to horizontalBar, as follows:
new Chart(ctx, {
type: "horizontalBar",
data: {…}
}The preceding chart seems better as a horizontal chart, since the category labels don't have to be turned sideways. You can see the full code in Pages/BarChart10.html. The following screenshot shows what the chart looks like now:
A horizontal bar chart (code: Pages/BarChart10.html)
You can add more datasets to a bar chart, and configure it with a new legend label, colors, and data arrays. In the following example, we will load a larger .csv file, which contains the data for plastic waste disposal in 2010, and a forecast for 2025. It has one extra column, as follows:
Country,2010,2025 China,8819717,17814777 Indonesia,3216856,7415202 Philippines,1883659,5088394 ... United States...