From 4565af1b3552c2a9e6b2514844c150b1e33a73ca Mon Sep 17 00:00:00 2001 From: khalane-roshani Date: Mon, 8 Jun 2026 17:21:23 +0530 Subject: [PATCH 1/3] docs: add horizontal bar chart example --- .../en/how-to/chart-types/bar/basic-bar.md | 19 +++++++++++++++++++ 1 file changed, 19 insertions(+) diff --git a/contents/en/how-to/chart-types/bar/basic-bar.md b/contents/en/how-to/chart-types/bar/basic-bar.md index 89f4dd89a..eaa7f57c5 100755 --- a/contents/en/how-to/chart-types/bar/basic-bar.md +++ b/contents/en/how-to/chart-types/bar/basic-bar.md @@ -27,6 +27,25 @@ option = { In this case, the x-axis is under the category type. Therefore, you should define some corresponding values for `'xAxis'`. Meanwhile, the data type of the y-axis is numerical. The range of the y-axis will be generated automatically by the `data` in `'series'`. +## Horizontal Bar Chart + +A horizontal bar chart can be created by using a value axis on the X-axis and a category axis on the Y-axis. + +```js live +option = { + XAxis: {}, + yAxis: { + data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'] + }, + series: [ + { + type: 'bar', + data: [23, 24, 18, 25, 27, 28, 25] + } + ] +}; +``` + ## Multi-series Bar Chart You may use a series to represent a group of related data. To show multiple series in the same chart, you need to add one more array under the `series`. From e11e3b3bdec906857548bf1e54ced952b990de27 Mon Sep 17 00:00:00 2001 From: khalane-roshani Date: Mon, 8 Jun 2026 17:23:43 +0530 Subject: [PATCH 2/3] bug fix --- contents/en/how-to/chart-types/bar/basic-bar.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/contents/en/how-to/chart-types/bar/basic-bar.md b/contents/en/how-to/chart-types/bar/basic-bar.md index eaa7f57c5..476ee87ef 100755 --- a/contents/en/how-to/chart-types/bar/basic-bar.md +++ b/contents/en/how-to/chart-types/bar/basic-bar.md @@ -33,7 +33,7 @@ A horizontal bar chart can be created by using a value axis on the X-axis and a ```js live option = { - XAxis: {}, + xAxis: {}, yAxis: { data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'] }, From 846e1fdc152281a8b17ac82476c1ba3dc69c1019 Mon Sep 17 00:00:00 2001 From: khalane-roshani Date: Mon, 8 Jun 2026 17:29:53 +0530 Subject: [PATCH 3/3] handle category and value --- contents/en/how-to/chart-types/bar/basic-bar.md | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/contents/en/how-to/chart-types/bar/basic-bar.md b/contents/en/how-to/chart-types/bar/basic-bar.md index 476ee87ef..9fcdca273 100755 --- a/contents/en/how-to/chart-types/bar/basic-bar.md +++ b/contents/en/how-to/chart-types/bar/basic-bar.md @@ -33,8 +33,11 @@ A horizontal bar chart can be created by using a value axis on the X-axis and a ```js live option = { - xAxis: {}, + xAxis: { + type: 'value', + }, yAxis: { + type: 'category', data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'] }, series: [