합계/평균
SBGrid는 부분합계(subtotal) 기능을 제공합니다.
요약
그리드에서 표현되는 숫자 데이터를 연산하는 기능을 제공합니다.입력값
String 첫번째 : 연산함수 (sum, average)
Number 두번째 : groupColumn, 그룹으로 묶여질 Key, 계산을 수행 할 영역의 기준이 되는 열의 인덱스<
Number 세번째 : totalColumn, 계산을 수행 할 실제 데이터 값을 갖는 열의 인덱스
String 네번째 : format, 계산결과를 표시할 때 사용할 포맷을 지정
String 다섯번째 : style, 계산결과를 표시하는 행의 스타일 지정
Number 여섯번째 : caption, 추가되는 행의 제목
Number 일곱번째 : fill text, 부분합계 Row 의 Title 의 문자열, 병합을 하기 위해서 데이터 영역의 처음 위치부터 groupColumn 전까지 모든 텍스트로 추가되는 행에 복사
Number 여덟번째 : [true : 모든 텍스트를 추가되는 행에 복사 , false : 텍스트 복사하지 않음]
예) datagrid1.subtotal("sum", datagrid1.colRef("Country"), datagrid1.colRef("CO2emissions"), "#,###", "font-weight:bold;color:#0000FF;", 0, "sum : ");
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<%@page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<html xmlns="http://www.w3.org/1999/xhtml" lang="ko" xml:lang="ko">
<head>
<meta content="IE=9" http-equiv="X-UA-Compatible">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>SoftBowl SBGrid Example</title>
<script type="text/javascript" src="../../kr/co/softbowl/js/Library/json-minified.js"></script>
<script type="text/javascript" src="../../js/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="../../kr/co/softbowl/js/Library/json2.js"></script>
<script type="text/javascript" src="../../kr/co/softbowl/SBGrid.js"></script>
<script type="text/javascript" src="../../js/DATA_World_Bank_Statistics_small.js"></script>
<script type="text/javascript">
SBGrid.DEF.DOMAIN = "../../";
<script>
<script type="text/javascript">
var datagrid1;
$(document).ready(function () {
__createElements();
});
function __createElements() {
var GridInitInfo = {
"strParentId": "sbGridArea",
"strId": "datagrid1",
"strCaption": "Country^Year^CO2\nemissions^Electric\npower consumption^Energy use^Fertility rate, total\n(births per woman)^GNI per capita, Atlas method\n(current US$)^Internet users\n(per 1,000 people)^Life expectancy at birth,\ntotal(years)^Military expenditure\n(% of GDP)^Population, total^Prevalence of HIV total\n(% of population ages 15-49)",
"strColWidth": "100,50,100,150,100,150,200,150,180,180,130,200",
"strRowHeight": "50",
"strJsonRef": "grid_data",
"strDataHeight": "29",
"strBackColorAlternate": "#f7f7f7",
"strStyle": "width:100%; height:480px; ",
"bAutoResize": true
};
var SBGridColumnInitInfo = [
{ "id": "col1", "type": "output", "ref": "Country", "style": "text-align:center" },
{ "id": "col2", "type": "output", "ref": "Year", "style": "text-align:center" , "bDataMerge" : false},
{ "id": "col3", "type": "output", "ref": "CO2emissions", "style": "text-align:right;padding-right:5px" , "bDataMerge" : false},
{ "id": "col4", "type": "output", "ref": "Electric_power_consumption", "style": "text-align:right;padding-right:5px" ,"bDataMerge" : false},
{ "id": "col5", "type": "output", "ref": "Energy_use", "style": "text-align:right;padding-right:5px" , "bDataMerge" : false},
{ "id": "col6", "type": "output", "ref": "Fertility_rate", "style": "text-align:right;padding-right:5px" , "bDataMerge" : false},
{ "id": "col7", "type": "output", "ref": "GNI", "style": "text-align:right;padding-right:5px" , "bDataMerge" : false},
{ "id": "col8", "type": "output", "ref": "Internet_users", "style": "text-align:right;padding-right:5px" , "bDataMerge" : false},
{ "id": "col9", "type": "output", "ref": "Life_expectancy", "style": "text-align:right;padding-right:5px" , "bDataMerge" : false},
{ "id": "col10", "type": "output", "ref": "Military_expenditure", "style": "text-align:right;padding-right:5px", "bDataMerge" : false },
{ "id": "col11", "type": "output", "ref": "Population", "format": "#,###", "style": "text-align:right;padding-right:5px" , "bDataMerge" : false},
{ "id": "col12", "type": "output", "ref": "Prevalence_of_HIV", "style": "text-align:right;padding-right:5px", "bDataMerge" : false }
];
if (SBGrid.getGrid('datagrid1') != null) {
datagrid1.destroy();
datagrid1 = null;
}
datagrid1 = createSBGrid(GridInitInfo, SBGridColumnInitInfo);
}
function createSBGrid(SBGridInitInfo, SBGridColumnInitInfo) {
var objJSONdata = new Object();
objJSONdata.objSBGridInitInfo = SBGridInitInfo;
objJSONdata.arSBGridColumnInitInfo = SBGridColumnInitInfo;
return SBGrid.DEF.createSBGrid(objJSONdata);
};
var bIsSubtotal = false;
function executeSubtotal_above()
{
executeSubtotal("above");
}
function executeSubtotal_below()
{
executeSubtotal("below");
}
function executeSubtotal(type)
{
if (!bIsSubtotal) {
datagrid1.setSubTotalPosition(type);
datagrid1.subtotal("clear", 0, 0);
datagrid1.subtotal("sum", datagrid1.colRef("Country"), datagrid1.colRef("CO2emissions"), "", "font-weight:bold;color:#0000FF;", 0, "sum : ");
datagrid1.subtotal("sum", datagrid1.colRef("Country"), datagrid1.colRef("Electric_power_consumption"), "", "font-weight:bold; color:#0000FF;", 0, "sum : ");
datagrid1.subtotal("sum", datagrid1.colRef("Country"), datagrid1.colRef("GNI"), "#,###.##", "font-weight:bold; color:#0000FF;", 0, "sum : ");
datagrid1.subtotal("average", datagrid1.colRef("Country"), datagrid1.colRef("CO2emissions"), "", "font-weight:bold;color:#FF0000;", 0, "average : ");
datagrid1.subtotal("average", datagrid1.colRef("Country"), datagrid1.colRef("Electric_power_consumption"), "", "font-weight:bold; color:#FF0000;", 0, "average : ");
datagrid1.subtotal("average", datagrid1.colRef("Country"), datagrid1.colRef("GNI"), "#,###.##", "font-weight:bold; color:#FF0000;", 0, "average : ");
var columnsArr = ["CO2emissions", "Electric_power_consumption", "GNI"];//조회시 데이터를 변경할 컬럼의 ref값
dataReplace(columnsArr, 2);
bIsSubtotal = true;
}
}
function dataReplace(columnsArr, nDecimalPlaces) {
var columnsIndexArr = [];
// 해당 컬럼에 대한 index 를 찾는다.
for (var k = 0; k < columnsArr.length; k++) {
for (var j = 0; j < datagrid1.getCols() ; j++) {
if (columnsArr[k] == datagrid1.getRefOfCol(j)) {
columnsIndexArr.push(j);
}
}
}
// header 에 대한 skip 으로 1부터 시작
for (var i = 1; i < datagrid1.getRows() ; i++) {
for (var j = 0; j < columnsIndexArr.length; j++) {
var originData = datagrid1.getTextMatrix(i, columnsIndexArr[j]);
datagrid1.setTextMatrix(i, columnsIndexArr[j], parseFloat(originData).toFixed(nDecimalPlaces).replace(/\B(?=(\d{3})+(?!\d))/g, ","));
}
}
}
</script>
</head>
<body onload="__createElements()" class="sbgrid_body">
<div class="topNav">
<div class="hdTxt">Subtotal</div>
</div><br/>
<div id="contents">
<div class="sbgrid_explanation">
<font id="sbgrid_explanation1">SBGrid는 부분합계 기능을 제공합니다.</font>
</div>
<div class="sep_group"><img class="sep_line" alt="공지사항" src="../../images/sep_line1.png" /></div>
<div id="button_group">
<input type="button" class="sbgrid_demo_button" style="width:700px; height:30px;" id="button_subtotal" value="부분합계 구하기" onclick="executeSubtotal();"></input>
</div>
<div class="content_group">
<div id="sbGridArea"></div>
</div>
</div>
</body>
</html>