dataLabels (plotOptions properties)
데이터 라벨의 속성을 설정 합니다.
Info
name |
type |
required |
description |
dataLabels |
object |
선택 |
데이터 라벨 속성 |
dataLabels.align |
string |
선택(center) |
정렬 방법 |
dataLabels.allowOverlap |
boolean |
선택(false) |
데이터 중복 허용 여부 |
dataLabels.backgroundColor |
color |
선택(undefined) |
데이터 레이블 배경 색상 |
dataLabels.borderColor |
color |
선택(undefined) |
데이터 레이블 테두리 색상 |
dataLabels.borderRadius |
number |
선택(0) |
데이터 레이블 테두리 radius 값 |
dataLabels.borderWidth |
number |
선택(0) |
데이터 레이블 테두리 너비 |
dataLabels.distance |
number |
선택(30) |
끝지점 부터의 표시 위치
pie, dependency-wheel 차트에서만 사용 가능 |
dataLabels.enabled |
boolean |
선택(false) |
표시 여부 |
dataLabels.filter |
object |
선택 |
데이터 레이블이 표시될 값 필터 Ex) filter: {property: 'percentage', operator: '>', value: 4} |
dataLabels.format |
string |
선택({y}) |
출력 포맷 Ex) format: ‘{y} mm’ |
dataLabels.formatter |
function() |
선택 |
출력 포맷을 정의하는 callback Ex) this.y 현재 y값 |
dataLabels.inside |
boolean |
선택 |
상자 내부의 레이블 정렬 여부 true일 경우 내부의 정렬 |
dataLabels.linkFormat |
string |
선택 |
노드를 잇는 링크(선) 위에 나타나는 데이터 레이블 문자열
graph 차트에서만 사용 가능 |
dataLabels.rotation |
number |
선택(0) |
기울기 |
dataLabels.shadow |
boolean |
선택(false) |
그림자 여부 |
dataLabels.style |
object |
선택 |
스타일 속성 |
dataLabels.useHTML |
boolean |
선택 |
HTML 사용 여부 |
dataLabels.verticalAlign |
string |
선택(bottom) |
수직 정렬 여부 |
dataLabels.x |
number |
선택 |
좌우 포지션 이동 값 |
dataLabels.y |
number |
선택 |
상하 포지션 이동 값 |
name |
type |
required |
description |
color |
color |
선택 |
폰트 색상 |
fontSize |
string |
선택 |
폰트 크기(px) |
fontWeight |
string |
선택(bold) |
폰트 bold 여부 |
name |
type |
required |
description |
operator |
operator |
선택 |
비교할 연산자 ( ">" , "<" , ">=" , "<=" , " == " , "===" , "!=" , "!==") |
property |
string |
선택 |
필터링 기준 데이터 포인트 속성 (x, y, name, percentage, sum 등) |
value |
number |
선택(bold) |
필터링 기준 값 |
Enum
value |
description |
center |
중앙 정렬 |
left |
좌측 정렬 |
right |
우측 정렬 |
value |
description |
top |
위쪽 정렬 |
middle |
중간 정렬 |
bottom |
아래쪽 정렬 |
Example
myChart.setOptions({
plotOptions: {
column: {
dataLabels : {
enabled:true,
align:"left",
backgroundColor:"#ffdab9",
style:{
color:"#800000"
},
formatter:function(){
return this.y + "개";
}
}
}
},
series: [{
type: "column",
name : "서울",
data : [60,40,20,80]
},{
name : "인천",
data : [30,50,90,70]
},{
name : "부산",
data : [40,70,30,60]
}]
}, {
append: true,
redraw: true
});

제공 버전