#latest
#options
wing 차트 고유 옵션입니다.
extend.wing.gapHeight
차트간 사이 높이를 설정합니다. (default: 30)
extend.wing.startColor
데이터가 1개일 경우 상단 차트의 색상을 설정합니다. (default: blue)
extend.wing.endColor
데이터가 1개일 경우 하단 차트의 색상을 설정합니다. (default: red)
extend.wing.wingTitle.subTitle
윙차트의 서브타이틀을 설정합니다.
배열형태로 2개의 값을 입력받습니다.
extend.wing.wingTitle.position
서브타이틀을 표시할 위치를 설정합니다. (default: left)
rotated시 left는 bottom에, right은 top에 표시됩니다.
var chart = sb.chart.render("#chartWrap", {
title: {
text: "2015년 주정차 위반 단속실적 집계 현황",
},
data: {
type: "wing",
json : [
{ "id" : "1월", "2015" : [8359, 4699] },
{ "id" : "2월", "2015" : [10148, 7381] },
{ "id" : "3월", "2015" : [10577, 7977] },
{ "id" : "4월", "2015" : [10314, 7644] },
{ "id" : "5월", "2015" : [9820, 7726] },
{ "id" : "6월", "2015" : [11596, 9279] },
{ "id" : "7월", "2015" : [7377, 3946] },
{ "id" : "8월", "2015" : [10058, 7202] },
{ "id" : "9월", "2015" : [9541, 7116] },
{ "id" : "10월", "2015" : [7781, 6608] },
{ "id" : "11월", "2015" : [9917, 7331] },
{ "id" : "12월", "2015" : [12035, 8157] },
],
keys : {
x : "id",
value : ["2015"]
},
labels: false
},
legend: {
show: false,
},
global: {
size: {
width: 1000,
height: 450,
},
padding: {
left: 50,
bottom: 30,
},
pattern: false,
color: {
pattern: [
"#00BD9F","#785FFF","#83b14e","#00A9FF","#FFB840","#FF5A46"
],
},
animation: {
show: true,
},
export: {
show: true,
},
},
axis: {
rotated: false,
x: {
type: "category",
categories: ["1월","2월","3월","4월","5월","6월","7월","8월","9월","10월","11월","12월"],
zoom: {
type: "drag",
maxScale: 15,
},
},
y: {
zerobased: true,
tick: {
line: {show: true},
},
domain: {
show: true,
},
},
},
grid: {
x: {
show: true,
},
y: {
show: true,
},
},
tooltip: {
sort: "desc",
format: {
title: function(x){
return (x+1)+"월 실적";
},
name: function(name, ratio, id, index){
return name + "년도";
},
value: function(value, ratio, id, index, value2){
return value + " / " + value2;
},
},
},
extend: {
wing: {
gapHeight: 25,
startColor: "skyblue",
endColor: "pink",
wingTitle: {
subTitle : ["부과건수","징수건수"],
position: "left"
},
},
},
});
// type