맨위로가기
 

SBCHART

닫기

Donut Options

#latest  #options

도넛(donut) 차트 고유 옵션입니다.

Options

  • extend.donut.title

    내부 원 안에 타이틀을 지정합니다.

Example

Code

#chartWrap .sbchart-arcs-title { font-size: 2em; }	/* 폰트사이즈 */
var chart = sb.chart.render("#chartWrap", {
    data: {
        type: "donut",
        columns: [
            ["2015",3.51],
            ["2016",0.71],
            ["2017",1.48]
        ]
    },
    extend: {
        donut: {
            title: { 
                type : document.getElementById("selTitleType").value,
                text : document.getElementById("txtTitle").value
            }
        }
    }
});

// title type
document.getElementById("selTitleType").onchange = function() {
    chart.extend({
        donut: {
            title: {
            	type : this.value
                text : document.getElementById("txtTitle").value,
            }    
        }
    }).render();
};

// title text
document.getElementById("txtTitle").onchange = function() {
    chart.extend({
        donut: {
            title: {
            	type : document.getElementById("selTitleType").value,
                text : this.value
            }    
        }
    }).render();
};