Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[#1145] Bar Chart > cPadRatio 옵션 추가 #1145

Merged
merged 5 commits into from
Apr 22, 2022
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions docs/views/barChart/api/barChart.md
Original file line number Diff line number Diff line change
Expand Up @@ -98,6 +98,7 @@ const chartData = {
| width | String / Number | '100%' | 차트의 너비 | '100%', '150px', 150 |
| height | String / Number | '100%' | 차트의 높이 | '100%', '150px', 150 |
| thickness | Number | 1 | 차트 막대의 너비 | 0.1 ~ 1 |
| cPadRatio | Number | 0 | 카테고리(각 라벨간)내부 padding 영역의 비율 | 0 ~ 0.99 (1 미만) |
| borderRadius | Number | 0 | 막대 가장자리 부분의 border-radius 값. | 0 ~ |
| horizontal | Boolean | false | 차트 막대의 방향 - 수평 전환 여부 | true, false |
| axesX | Object | 없음 | X축에 대한 속성 | [상세](#axesx-axesy) |
Expand Down
1 change: 1 addition & 0 deletions docs/views/barChart/example/Default.vue
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,7 @@

const chartOptions = {
type: 'bar',
cPadRatio: 0.1,
axesX: [{
type: 'step',
}],
Expand Down
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "evui",
"version": "3.3.15",
"version": "3.3.16",
"description": "A EXEM Library project",
"author": "exem <dev_client@ex-em.com>",
"license": "MIT",
Expand Down
4 changes: 2 additions & 2 deletions src/components/chart/chart.core.js
Original file line number Diff line number Diff line change
Expand Up @@ -189,8 +189,8 @@ class EvChart {
break;
}
case 'bar': {
const { thickness, borderRadius } = this.options;
series.draw({ thickness, borderRadius, showSeriesCount, showIndex, ...opt });
const { thickness, cPadRatio, borderRadius } = this.options;
series.draw({ thickness, cPadRatio, borderRadius, showSeriesCount, showIndex, ...opt });
if (series.show) {
showIndex++;
}
Expand Down
9 changes: 8 additions & 1 deletion src/components/chart/element/element.bar.js
Original file line number Diff line number Diff line change
Expand Up @@ -67,7 +67,14 @@ class Bar {

const dArea = isHorizontal ? yArea : xArea;
const cArea = dArea / (this.data.length || 1);
const cPad = 2;

let cPad;
const isUnableToDrawCategoryPadding = param.cPadRatio >= 1 || param.cPadRatio <= 0;
if (isUnableToDrawCategoryPadding) {
cPad = 2;
} else {
cPad = Math.max((dArea * (param.cPadRatio / 2)) / this.data.length, 2);
}

let bArea;
let w;
Expand Down
1 change: 1 addition & 0 deletions src/components/chart/uses.js
Original file line number Diff line number Diff line change
Expand Up @@ -43,6 +43,7 @@ const DEFAULT_OPTIONS = {
width: '100%',
height: '100%',
thickness: 1,
cPadRatio: 0,
borderRadius: 0,
combo: false,
tooltip: {
Expand Down