SpreadJS 시나리오 매니저를 사용하면 선택한 입력 셀의 여러 버전을 이름으로 저장할 수 있습니다. 시나리오를 적용하면 해당 셀이 대체되고 수식이 새 값으로 다시 계산됩니다.
이 개요에서는 선풍기의 연간 매출 예측을 사용합니다. 1월부터 4월까지는 현재 실적 데이터이고, 5월부터 12월까지는 예측 셀입니다.
사이드 패널에서 재무 손익분기 목표, 비관적 예측 또는 낙관적 예측을 적용할 수 있습니다.
var spread;
window.onload = function () {
spread = new GC.Spread.Sheets.Workbook(document.getElementById('ss'), { sheetCount: 1 });
initSpread(spread);
};
function initSpread(workbook) {
workbook.suspendPaint();
workbook.fromJSON(json);
workbook.resumePaint();
bindControls();
refreshSummary('기준 예측');
}
function bindControls() {
document.getElementById('applyBreakEven').addEventListener('click', function () {
applyForecast('Break-even', '손익분기 예측이 적용되었습니다.');
});
document.getElementById('applyPessimistic').addEventListener('click', function () {
applyForecast('Pessimistic', '비관적 예측이 적용되었습니다.');
});
document.getElementById('applyOptimistic').addEventListener('click', function () {
applyForecast('Optimistic', '낙관적 예측이 적용되었습니다.');
});
document.getElementById('restoreForecast').addEventListener('click', function () {
spread.scenarioManager.restore();
refreshSummary('기준 예측');
showResult('예측이 기준 값으로 복원되었습니다.', 'success');
});
}
function applyForecast(name, message) {
spread.scenarioManager.restore();
if (spread.scenarioManager.apply(name)) {
refreshSummary(name);
showResult(message, 'success');
} else {
showResult('시나리오 "' + name + '"을(를) 찾을 수 없습니다.', 'error');
}
}
function refreshSummary(activeName) {
var sheet = spread.getSheet(0);
var scenarioList = document.getElementById('scenarioList');
scenarioList.innerHTML = '';
spread.scenarioManager.all().map(getScenarioSummary).forEach(function (scenario) {
var item = document.createElement('li');
item.innerHTML = '<strong>' + scenario.name + '</strong><em>' + scenario.owner + '</em><span>' + scenario.description + '</span>';
scenarioList.appendChild(item);
});
document.getElementById('activeScenario').textContent = activeName;
document.getElementById('totalUnits').textContent = formatNumber(sheet.getValue(15, 1));
document.getElementById('totalRevenue').textContent = formatCurrency(sheet.getValue(15, 3));
document.getElementById('totalProfit').textContent = formatCurrency(sheet.getValue(15, 5));
}
function formatNumber(value) {
return Math.round(value || 0).toLocaleString();
}
function formatCurrency(value) {
return '$' + Math.round(value || 0).toLocaleString();
}
function getScenarioSummary(scenario) {
var cellCount = 0;
scenario.overrides.forEach(function (override) {
cellCount += (override.cells || []).length;
});
return {
name: scenario.name,
owner: getScenarioOwner(scenario.userId),
description: getScenarioDescription(scenario.name),
cellCount: cellCount
};
}
function getScenarioOwner(userId) {
var users = json.users || [];
for (var i = 0; i < users.length; i++) {
if (users[i].id === userId) {
return users[i].name;
}
}
return '알 수 없는 소유자';
}
function getScenarioDescription(name) {
var descriptions = {
'Break-even': '재무 목표: 선풍기 제품군의 고정 운영 비용을 충당하는 데 필요한 매출입니다.',
'Pessimistic': '연말까지 표준 가격과 수요 감소를 반영한 매출 전망입니다.',
'Optimistic': '연말까지 수요 증가와 선택적 가격 인상을 반영한 매출 전망입니다.'
};
return descriptions[name] || '시나리오는 5월부터 12월까지의 예측 셀을 재정의합니다.';
}
function showResult(message, resultClass) {
var result = document.getElementById('result');
result.className = 'result-container ' + resultClass;
result.textContent = message;
}
<!doctype html>
<html style="height:100%;font-size:14px;">
<head>
<meta charset="utf-8" />
<meta name="spreadjs culture" content="ko-kr" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" type="text/css" href="$DEMOROOT$/ko/purejs/node_modules/@mescius/spread-sheets/styles/gc.spread.sheets.excel2013white.css">
<script src="$DEMOROOT$/ko/purejs/node_modules/@mescius/spread-sheets/dist/gc.spread.sheets.all.min.js" type="text/javascript"></script>
<script src="$DEMOROOT$/ko/purejs/node_modules/@mescius/spread-sheets-resources-ko/dist/gc.spread.sheets.resources.ko.min.js" type="text/javascript"></script>
<script src="$DEMOROOT$/spread/source/js/license.js" type="text/javascript"></script>
<script src="data.js" type="text/javascript"></script>
<script src="app.js" type="text/javascript"></script>
<link rel="stylesheet" type="text/css" href="styles.css">
</head>
<body>
<div class="sample-tutorial">
<div id="ss" class="sample-spreadsheets"></div>
<div class="options-container">
<div class="panel-title">시나리오 개요</div>
<div class="option-group action-group">
<input type="button" value="손익분기 예측 적용" id="applyBreakEven" />
<input type="button" value="비관적 예측 적용" id="applyPessimistic" />
<input type="button" value="낙관적 예측 적용" id="applyOptimistic" />
<input type="button" value="복원" id="restoreForecast" />
</div>
<div id="result" class="result-container success">작업 설명</div>
<div class="option-group forecast-summary">
<div><span>보기</span><strong id="activeScenario">기준 예측</strong></div>
<div><span>연간 수량</span><strong id="totalUnits">0</strong></div>
<div><span>매출</span><strong id="totalRevenue">$0</strong></div>
<div><span>이익</span><strong id="totalProfit">$0</strong></div>
</div>
<div class="option-group">
<label>준비된 시나리오</label>
<ul id="scenarioList" class="scenario-list"></ul>
</div>
</div>
</div>
</body>
</html>
var json = {
"version": "18.0.0",
"name": "",
"docProps": {
"docPropsApp": {},
"docPropsCore": {}
},
"sheetCount": 1,
"users": [
{
"id": "{483FF98B-BB90-4EB4-8329-761CD05F2BAE}",
"name": "Ethan(VP of Sales)",
"color": "#26A69A"
},
{
"id": "{483FF98B-BB90-4EB4-8329-761CD56778AE}",
"name": "Emma(Finance Director)",
"color": "#A6A634"
}
],
"customList": [],
"defaultSheetTabStyles": {},
"builtInFileIcons": {},
"sheets": {
"연간 매출 예측": {
"name": "연간 매출 예측",
"isSelected": true,
"rowCount": 19,
"columnCount": 7,
"activeRow": 11,
"activeCol": 4,
"visible": 1,
"theme": "Office",
"data": {
"dataTable": {
"0": {
"0": {
"value": "선풍기 연간 매출 예측",
"style": {
"autoFormatter": {},
"font": "bold 16px Arial",
"fontWeight": "bold",
"fontSize": "16px",
"fontFamily": "Arial"
}
}
},
"1": {
"0": {
"value": "4월까지의 실제 매출과 나머지 기간의 예측 입력입니다."
}
},
"2": {
"0": {
"value": "월",
"style": {
"backColor": "#e8f4ff",
"font": "bold 12px Arial",
"fontWeight": "bold",
"fontSize": "12px",
"fontFamily": "Arial"
}
},
"1": {
"value": "수량",
"style": {
"backColor": "#e8f4ff",
"font": "bold 12px Arial",
"fontWeight": "bold",
"fontSize": "12px",
"fontFamily": "Arial"
}
},
"2": {
"value": "단가",
"style": {
"backColor": "#e8f4ff",
"font": "bold 12px Arial",
"fontWeight": "bold",
"fontSize": "12px",
"fontFamily": "Arial"
}
},
"3": {
"value": "매출",
"style": {
"backColor": "#e8f4ff",
"font": "bold 12px Arial",
"fontWeight": "bold",
"fontSize": "12px",
"fontFamily": "Arial"
}
},
"4": {
"value": "비용",
"style": {
"backColor": "#e8f4ff",
"font": "bold 12px Arial",
"fontWeight": "bold",
"fontSize": "12px",
"fontFamily": "Arial"
}
},
"5": {
"value": "이익",
"style": {
"backColor": "#e8f4ff",
"font": "bold 12px Arial",
"fontWeight": "bold",
"fontSize": "12px",
"fontFamily": "Arial"
}
}
},
"3": {
"0": {
"value": "1월",
"style": {
"backColor": "#eef8f1"
}
},
"1": {
"value": 622,
"style": {
"backColor": "#eef8f1",
"formatter": "#,##0"
}
},
"2": {
"value": 48,
"style": {
"backColor": "#eef8f1",
"formatter": "$#,##0.00"
}
},
"3": {
"value": 29856,
"style": {
"backColor": "#eef8f1",
"formatter": "$#,##0.00"
},
"formula": {
"si": 0
}
},
"4": {
"value": 17416,
"style": {
"backColor": "#eef8f1",
"formatter": "$#,##0.00"
},
"formula": {
"si": 1
}
},
"5": {
"value": 12440,
"style": {
"backColor": "#eef8f1",
"formatter": "$#,##0.00"
},
"formula": {
"si": 2
}
}
},
"4": {
"0": {
"value": "2월",
"style": {
"backColor": "#eef8f1"
}
},
"1": {
"value": 631,
"style": {
"backColor": "#eef8f1",
"formatter": "#,##0"
}
},
"2": {
"value": 48,
"style": {
"backColor": "#eef8f1",
"formatter": "$#,##0.00"
}
},
"3": {
"value": 30288,
"style": {
"backColor": "#eef8f1",
"formatter": "$#,##0.00"
},
"formula": {
"si": 0
}
},
"4": {
"value": 17668,
"style": {
"backColor": "#eef8f1",
"formatter": "$#,##0.00"
},
"formula": {
"si": 1
}
},
"5": {
"value": 12620,
"style": {
"backColor": "#eef8f1",
"formatter": "$#,##0.00"
},
"formula": {
"si": 2
}
}
},
"5": {
"0": {
"value": "3월",
"style": {
"backColor": "#eef8f1"
}
},
"1": {
"value": 713,
"style": {
"backColor": "#eef8f1",
"formatter": "#,##0"
}
},
"2": {
"value": 48,
"style": {
"backColor": "#eef8f1",
"formatter": "$#,##0.00"
}
},
"3": {
"value": 34224,
"style": {
"backColor": "#eef8f1",
"formatter": "$#,##0.00"
},
"formula": {
"si": 0
}
},
"4": {
"value": 19964,
"style": {
"backColor": "#eef8f1",
"formatter": "$#,##0.00"
},
"formula": {
"si": 1
}
},
"5": {
"value": 14260,
"style": {
"backColor": "#eef8f1",
"formatter": "$#,##0.00"
},
"formula": {
"si": 2
}
}
},
"6": {
"0": {
"value": "4월",
"style": {
"backColor": "#eef8f1"
}
},
"1": {
"value": 854,
"style": {
"backColor": "#eef8f1",
"formatter": "#,##0"
}
},
"2": {
"value": 48,
"style": {
"backColor": "#eef8f1",
"formatter": "$#,##0.00"
}
},
"3": {
"value": 40992,
"style": {
"backColor": "#eef8f1",
"formatter": "$#,##0.00"
},
"formula": {
"si": 0
}
},
"4": {
"value": 23912,
"style": {
"backColor": "#eef8f1",
"formatter": "$#,##0.00"
},
"formula": {
"si": 1
}
},
"5": {
"value": 17080,
"style": {
"backColor": "#eef8f1",
"formatter": "$#,##0.00"
},
"formula": {
"si": 2
}
}
},
"7": {
"0": {
"value": "5월",
"style": {
"backColor": "#fff8dc"
}
},
"1": {
"style": {
"backColor": "#fff8dc",
"formatter": "#,##0"
}
},
"2": {
"style": {
"backColor": "#fff8dc",
"hAlign": 3,
"vAlign": 0,
"themeFont": "Body",
"formatter": "$#,##0.00",
"imeMode": 1
}
},
"3": {
"value": 0,
"style": {
"backColor": "#fff8dc",
"formatter": "$#,##0.00"
},
"formula": {
"si": 0
}
},
"4": {
"value": 0,
"style": {
"backColor": "#fff8dc",
"formatter": "$#,##0.00"
},
"formula": {
"si": 1
}
},
"5": {
"value": 0,
"style": {
"backColor": "#fff8dc",
"formatter": "$#,##0.00"
},
"formula": {
"si": 2
}
}
},
"8": {
"0": {
"value": "6월",
"style": {
"backColor": "#fff8dc"
}
},
"1": {
"style": {
"backColor": "#fff8dc",
"formatter": "#,##0"
}
},
"2": {
"style": {
"backColor": "#fff8dc",
"hAlign": 3,
"vAlign": 0,
"themeFont": "Body",
"formatter": "$#,##0.00",
"imeMode": 1
}
},
"3": {
"value": 0,
"style": {
"backColor": "#fff8dc",
"formatter": "$#,##0.00"
},
"formula": {
"si": 0
}
},
"4": {
"value": 0,
"style": {
"backColor": "#fff8dc",
"formatter": "$#,##0.00"
},
"formula": {
"si": 1
}
},
"5": {
"value": 0,
"style": {
"backColor": "#fff8dc",
"formatter": "$#,##0.00"
},
"formula": {
"si": 2
}
}
},
"9": {
"0": {
"value": "7월",
"style": {
"backColor": "#fff8dc"
}
},
"1": {
"style": {
"backColor": "#fff8dc",
"hAlign": 3,
"vAlign": 0,
"themeFont": "Body",
"formatter": "#,##0",
"imeMode": 1
}
},
"2": {
"style": {
"backColor": "#fff8dc",
"hAlign": 3,
"vAlign": 0,
"themeFont": "Body",
"formatter": "$#,##0.00",
"imeMode": 1
}
},
"3": {
"value": 0,
"style": {
"backColor": "#fff8dc",
"formatter": "$#,##0.00"
},
"formula": {
"si": 0
}
},
"4": {
"value": 0,
"style": {
"backColor": "#fff8dc",
"formatter": "$#,##0.00"
},
"formula": {
"si": 1
}
},
"5": {
"value": 0,
"style": {
"backColor": "#fff8dc",
"formatter": "$#,##0.00"
},
"formula": {
"si": 2
}
}
},
"10": {
"0": {
"value": "8월",
"style": {
"backColor": "#fff8dc"
}
},
"1": {
"style": {
"backColor": "#fff8dc",
"hAlign": 3,
"vAlign": 0,
"themeFont": "Body",
"formatter": "#,##0",
"imeMode": 1
}
},
"2": {
"style": {
"backColor": "#fff8dc",
"hAlign": 3,
"vAlign": 0,
"themeFont": "Body",
"formatter": "$#,##0.00",
"imeMode": 1
}
},
"3": {
"value": 0,
"style": {
"backColor": "#fff8dc",
"formatter": "$#,##0.00"
},
"formula": {
"si": 0
}
},
"4": {
"value": 0,
"style": {
"backColor": "#fff8dc",
"formatter": "$#,##0.00"
},
"formula": {
"si": 1
}
},
"5": {
"value": 0,
"style": {
"backColor": "#fff8dc",
"formatter": "$#,##0.00"
},
"formula": {
"si": 2
}
}
},
"11": {
"0": {
"value": "9월",
"style": {
"backColor": "#fff8dc"
}
},
"1": {
"style": {
"backColor": "#fff8dc",
"hAlign": 3,
"vAlign": 0,
"themeFont": "Body",
"formatter": "#,##0",
"imeMode": 1
}
},
"2": {
"style": {
"backColor": "#fff8dc",
"hAlign": 3,
"vAlign": 0,
"themeFont": "Body",
"formatter": "$#,##0.00",
"imeMode": 1
}
},
"3": {
"value": 0,
"style": {
"backColor": "#fff8dc",
"formatter": "$#,##0.00"
},
"formula": {
"si": 0
}
},
"4": {
"value": 0,
"style": {
"backColor": "#fff8dc",
"formatter": "$#,##0.00"
},
"formula": {
"si": 1
}
},
"5": {
"value": 0,
"style": {
"backColor": "#fff8dc",
"formatter": "$#,##0.00"
},
"formula": {
"si": 2
}
}
},
"12": {
"0": {
"value": "10월",
"style": {
"backColor": "#fff8dc"
}
},
"1": {
"style": {
"backColor": "#fff8dc",
"hAlign": 3,
"vAlign": 0,
"themeFont": "Body",
"formatter": "#,##0",
"imeMode": 1
}
},
"2": {
"style": {
"backColor": "#fff8dc",
"hAlign": 3,
"vAlign": 0,
"themeFont": "Body",
"formatter": "$#,##0.00",
"imeMode": 1
}
},
"3": {
"value": 0,
"style": {
"backColor": "#fff8dc",
"formatter": "$#,##0.00"
},
"formula": {
"si": 0
}
},
"4": {
"value": 0,
"style": {
"backColor": "#fff8dc",
"formatter": "$#,##0.00"
},
"formula": {
"si": 1
}
},
"5": {
"value": 0,
"style": {
"backColor": "#fff8dc",
"formatter": "$#,##0.00"
},
"formula": {
"si": 2
}
}
},
"13": {
"0": {
"value": "11월",
"style": {
"backColor": "#fff8dc"
}
},
"1": {
"style": {
"backColor": "#fff8dc",
"hAlign": 3,
"vAlign": 0,
"themeFont": "Body",
"formatter": "#,##0",
"imeMode": 1
}
},
"2": {
"style": {
"backColor": "#fff8dc",
"hAlign": 3,
"vAlign": 0,
"themeFont": "Body",
"formatter": "$#,##0.00",
"imeMode": 1
}
},
"3": {
"value": 0,
"style": {
"backColor": "#fff8dc",
"formatter": "$#,##0.00"
},
"formula": {
"si": 0
}
},
"4": {
"value": 0,
"style": {
"backColor": "#fff8dc",
"formatter": "$#,##0.00"
},
"formula": {
"si": 1
}
},
"5": {
"value": 0,
"style": {
"backColor": "#fff8dc",
"formatter": "$#,##0.00"
},
"formula": {
"si": 2
}
}
},
"14": {
"0": {
"value": "12월",
"style": {
"backColor": "#fff8dc"
}
},
"1": {
"style": {
"backColor": "#fff8dc",
"hAlign": 3,
"vAlign": 0,
"themeFont": "Body",
"formatter": "#,##0",
"imeMode": 1
}
},
"2": {
"style": {
"backColor": "#fff8dc",
"hAlign": 3,
"vAlign": 0,
"themeFont": "Body",
"formatter": "$#,##0.00",
"imeMode": 1
}
},
"3": {
"value": 0,
"style": {
"backColor": "#fff8dc",
"formatter": "$#,##0.00"
},
"formula": {
"si": 0
}
},
"4": {
"value": 0,
"style": {
"backColor": "#fff8dc",
"formatter": "$#,##0.00"
},
"formula": {
"si": 1
}
},
"5": {
"value": 0,
"style": {
"backColor": "#fff8dc",
"formatter": "$#,##0.00"
},
"formula": {
"si": 2
}
}
},
"15": {
"0": {
"value": "Year Total",
"style": {
"backColor": "#dff3e3",
"font": "bold 12px Arial",
"fontWeight": "bold",
"fontSize": "12px",
"fontFamily": "Arial"
}
},
"1": {
"value": 2820,
"style": {
"backColor": "#dff3e3",
"font": "bold 12px Arial",
"formatter": "#,##0",
"fontWeight": "bold",
"fontSize": "12px",
"fontFamily": "Arial"
},
"formula": {
"si": 3
}
},
"2": {
"style": {
"backColor": "#dff3e3",
"font": "bold 12px Arial",
"fontWeight": "bold",
"fontSize": "12px",
"fontFamily": "Arial"
}
},
"3": {
"value": 135360,
"style": {
"backColor": "#dff3e3",
"font": "bold 12px Arial",
"formatter": "$#,##0.00",
"fontWeight": "bold",
"fontSize": "12px",
"fontFamily": "Arial"
},
"formula": {
"si": 3
}
},
"4": {
"value": 78960,
"style": {
"backColor": "#dff3e3",
"font": "bold 12px Arial",
"formatter": "$#,##0.00",
"fontWeight": "bold",
"fontSize": "12px",
"fontFamily": "Arial"
},
"formula": {
"si": 3
}
},
"5": {
"value": 56400,
"style": {
"backColor": "#dff3e3",
"font": "bold 12px Arial",
"formatter": "$#,##0.00",
"fontWeight": "bold",
"fontSize": "12px",
"fontFamily": "Arial"
},
"formula": {
"si": 3
}
}
},
"17": {
"0": {
"value": "시나리오 재정의 셀",
"style": {
"font": "bold 12px Arial",
"fontWeight": "bold",
"fontSize": "12px",
"fontFamily": "Arial"
}
},
"1": {
"value": "B8:C15",
"style": {
"font": "bold 12px Arial",
"fontWeight": "bold",
"fontSize": "12px",
"fontFamily": "Arial"
}
}
}
},
"defaultDataNode": {
"style": {
"themeFont": "Body"
}
}
},
"rowHeaderData": {
"defaultDataNode": {
"style": {
"themeFont": "Body"
}
}
},
"colHeaderData": {
"defaultDataNode": {
"style": {
"themeFont": "Body"
}
}
},
"columns": [
{
"size": 143
},
{
"size": 88
},
{
"size": 92
},
{
"size": 116
},
{
"size": 108
},
{
"size": 116
}
],
"defaultData": {
"7": {},
"8": {},
"9": {},
"10": {},
"11": {},
"12": {},
"13": {},
"14": {}
},
"leftCellIndex": 0,
"topCellIndex": 0,
"selections": {
"0": {
"row": 11,
"col": 4,
"rowCount": 1,
"colCount": 1
},
"length": 1
},
"rowOutlines": {
"items": []
},
"columnOutlines": {
"items": []
},
"cellStates": {},
"states": {},
"outlineColumnOptions": {},
"autoMergeRangeInfos": [],
"sharedFormulas": {
"0": {
"formula": "B4*C4",
"baseRow": 3,
"baseColumn": 3,
"lastRow": 14,
"lastColumn": 3
},
"1": {
"formula": "B4*28",
"baseRow": 3,
"baseColumn": 4,
"lastRow": 14,
"lastColumn": 4
},
"2": {
"formula": "D4-E4",
"baseRow": 3,
"baseColumn": 5,
"lastRow": 14,
"lastColumn": 5
},
"3": {
"formula": "SUM(B4:B15)",
"baseRow": 15,
"baseColumn": 1,
"lastRow": 15,
"lastColumn": 5
},
"nextIndex": 4
},
"printInfo": {
"paperSize": {
"width": 850,
"height": 1100,
"kind": 1
}
},
"gridline": {
"showVerticalGridline": false
},
"index": 0,
"order": 0
}
},
"sheetTabCount": 0,
"namedPatterns": {},
"scenarios": {
"Break-even": {
"name": "Break-even",
"userId": "{483FF98B-BB90-4EB4-8329-761CD56778AE}",
"overrides": [
{
"sheetName": "연간 매출 예측",
"dataTable": {
"7": {
"1": {
"value": 900
},
"2": {
"value": 48
}
},
"8": {
"1": {
"value": 1000
},
"2": {
"value": 48
}
},
"9": {
"1": {
"value": 1200
},
"2": {
"value": 48
}
},
"10": {
"1": {
"value": 1200
},
"2": {
"value": 48
}
},
"11": {
"1": {
"value": 1000
},
"2": {
"value": 48
}
},
"12": {
"1": {
"value": 800
},
"2": {
"value": 48
}
},
"13": {
"1": {
"value": 600
},
"2": {
"value": 48
}
},
"14": {
"1": {
"value": 600
},
"2": {
"value": 48
}
}
}
}
]
},
"Pessimistic": {
"name": "Pessimistic",
"userId": "{483FF98B-BB90-4EB4-8329-761CD05F2BAE}",
"overrides": [
{
"sheetName": "연간 매출 예측",
"dataTable": {
"7": {
"1": {
"value": 960
},
"2": {
"value": 48
}
},
"8": {
"1": {
"value": 1100
},
"2": {
"value": 48
}
},
"9": {
"1": {
"value": 1800
},
"2": {
"value": 48
}
},
"10": {
"1": {
"value": 1800
},
"2": {
"value": 48
}
},
"11": {
"1": {
"value": 1200
},
"2": {
"value": 48
}
},
"12": {
"1": {
"value": 800
},
"2": {
"value": 48
}
},
"13": {
"1": {
"value": 600
},
"2": {
"value": 48
}
},
"14": {
"1": {
"value": 600
},
"2": {
"value": 48
}
}
}
}
]
},
"Optimistic": {
"name": "Optimistic",
"userId": "{483FF98B-BB90-4EB4-8329-761CD05F2BAE}",
"overrides": [
{
"sheetName": "연간 매출 예측",
"dataTable": {
"7": {
"1": {
"value": 1000
},
"2": {
"value": 48
}
},
"8": {
"1": {
"value": 1400
},
"2": {
"value": 55
}
},
"9": {
"1": {
"value": 2300
},
"2": {
"value": 55
}
},
"10": {
"1": {
"value": 2300
},
"2": {
"value": 55
}
},
"11": {
"1": {
"value": 1400
},
"2": {
"value": 48
}
},
"12": {
"1": {
"value": 1000
},
"2": {
"value": 48
}
},
"13": {
"1": {
"value": 700
},
"2": {
"value": 48
}
},
"14": {
"1": {
"value": 700
},
"2": {
"value": 48
}
}
}
}
]
}
},
"scenarioAdditionalInfo": {
"appliedScenarios": {},
"baseValues": {
"연간 매출 예측": {}
}
},
"pivotCaches": {}
};
html,
body {
height: 100%;
margin: 0;
overflow: hidden;
}
.sample-tutorial {
position: relative;
height: 100%;
overflow: hidden;
font-family: Arial, sans-serif;
}
.sample-spreadsheets {
width: calc(100% - 340px);
height: 100%;
overflow: hidden;
float: left;
}
.options-container {
float: right;
width: 340px;
height: 100%;
padding: 16px;
box-sizing: border-box;
background: #fafafa;
border-left: 1px solid #ddd;
overflow: auto;
}
.panel-title {
color: #243447;
font-size: 18px;
font-weight: bold;
margin-bottom: 8px;
}
.panel-copy {
color: #555;
font-size: 12px;
line-height: 1.5;
margin-bottom: 14px;
}
.option-group {
margin-bottom: 14px;
}
.option-group label {
display: block;
margin-bottom: 8px;
color: #333;
font-weight: bold;
font-size: 12px;
}
input[type=button] {
width: 100%;
padding: 9px 8px;
margin-bottom: 8px;
background: #1668a8;
color: #fff;
border: none;
border-radius: 4px;
cursor: pointer;
font-weight: bold;
}
input[type=button]:hover {
background: #0f4f82;
}
.action-group input:nth-child(1) {
background: #6f5a2c;
}
.action-group input:nth-child(1):hover {
background: #584621;
}
.action-group input:nth-child(3) {
background: #287a3e;
}
.action-group input:nth-child(3):hover {
background: #1f6431;
}
.action-group input:nth-child(4) {
background: #6f5a2c;
}
.action-group input:nth-child(4):hover {
background: #584621;
}
.result-container,
.forecast-summary {
border: 1px solid #ddd;
border-radius: 4px;
background: #fff;
}
.result-container {
min-height: 34px;
padding: 9px;
margin-bottom: 14px;
box-sizing: border-box;
font-size: 12px;
line-height: 1.35;
}
.success {
color: #155724;
background: #d4edda;
border-color: #c3e6cb;
}
.error {
color: #721c24;
background: #f8d7da;
border-color: #f5c6cb;
}
.forecast-summary {
padding: 10px;
font-size: 12px;
}
.forecast-summary div {
display: flex;
justify-content: space-between;
gap: 10px;
margin-bottom: 8px;
}
.forecast-summary div:last-child {
margin-bottom: 0;
}
.scenario-list {
margin: 0;
padding: 0;
list-style: none;
}
.scenario-list li {
padding: 10px;
margin-bottom: 8px;
border: 1px solid #ddd;
border-radius: 4px;
background: #fff;
}
.scenario-list strong,
.scenario-list em,
.scenario-list span {
display: block;
}
.scenario-list strong {
margin-bottom: 4px;
}
.scenario-list em {
color: #555;
font-size: 11px;
font-style: normal;
margin-bottom: 4px;
}
.scenario-list span {
color: #555;
font-size: 12px;
line-height: 1.35;
}