.NET 응용 프로그램에 손익 분기 차트 도입
페이지 정보
작성자 GrapeCity 작성일 2021-01-05 17:29 조회 5,573회 댓글 0건본문
관련링크
2020 v2 릴리스에 손익 분기 차트를 도입했습니다. 손익분기점 분석은 한계 비용을 계산하는 데 사용됩니다.
이 기법은 프로덕션 관리 및 관리 회계사가 많이 사용합니다.
손익분기점 분석 차트에서는 총 비용이 매출액과 같아지는 판매량을 표시합니다.
총비용이 매출액과 같아지는 지점을 손익분기점이라고 합니다.
손익분기점은 다음 공식을 사용해 파악할 수 있습니다.
손익 분기 수량 = (총 고정 비용 / (판매 가격 – 가변 비용)) 손익 분기 값 = 손익 분기 수량 * 판매 가격
이 값은 다음 세 가지 값을 사용해 계산할 수 있습니다.
총 고정 비용: 총 고정 비용은 생산 수량에 따라 변하지 않는 모든 조직의 비용입니다. 예: 기계 대여 또는 연간 유지 관리 비용
공헌 가격: 이 값은 고정되어 있지 않으며 생산되는 양에 따라 달라집니다.
판매 가격: 제공되는 제품이 시장에서 판매되는 가격입니다.
이 내용을 더 잘 이해하기 위해 한 가지 예를 들어 보겠습니다.
어떤 조직의 고정 비용이 100만 달러이고, 단위당 가격은 20달러, 이 제품 한 단위는 120달러에 판매된다고 가정해 봅시다.
그러면 이제 손실이 없고 수익 역시 없는 손익분기점을 계산해 보겠습니다.
손익 분기 수량 = 1,000,000/ (120-20) = 10,000
손익 분기 값 = 10,000*120 = 1,200,000달러
위 계산에 따르면 손익 분기 수량은 10,000 단위입니다. 위 공식을 확인해 보겠습니다.
| 1 단위 | 9999 단위 | 10000 단위 | 10001 단위 |
판매가격 | 1 x 120 = 120 | 120 x 9, 999 = 1,199,880 | 120 x 10,000 = 1,200,000 | 120 x 10,001 = 1,200,120 |
비용 | 20 x 1 = 20 | 20 x 9,999 = 199,980 | 20 x 10,000 = 200,000 | 20 x 10,001 = 200,020 |
공헌 | 120 - 20 = 100 | 1,199,880 - 199,980 = 999,900 | 1,200,000 - 20,000 = 1,000,000 | 1,200,120 - 200,020 = 1,000,100 |
고정 비용 | 1,000,000 | 1,000,000 | 1,000,000 | 1,000,000 |
이익/손실 | (999,900)달러 | (100)달러 | $(0) | 100달러 |
위 데이터를 손익 분기 차트로 나타내면 다음과 같습니다.
위 차트에서 보시는 바와 같이 단위는 X축에, 가격은 Y축에 표시되어 있습니다. 수량과 가격은 위에서 계산한 것과 동일합니다.
손익 분기 차트의 개념을 이해했으므로 이 차트를 MVC 응용 프로그램에 추가하는 방법을 알아보겠습니다.
프로젝트에서 손익 분기 차트를 추가하려면 아래와 같은 단계를 따라야 합니다.
C1 Nuget 패키지 설치
리소스 등록
손익 분기 차트 추가
C1 Nuget 패키지 설치 방법:
C1 차트를 사용하려면 C1.AspNetCore.MVC 패키지를 프로젝트에 설치해야 합니다. 필요한 패키지를 추가하려면 다음 단계를 따르십시오.
Asp. Net Core MVC 프로젝트에서 의존성을 마우스 오른쪽 버튼으로 클릭
Nuget 패키지 관리 옵션을 선택하고 찾아보기 탭을 선택
C1.AspNetCore.MVC 패키지 검색
이 패키지를 선택하고 설치를 클릭
이렇게 하면 필요한 패키지가 설치됩니다.
리소스 등록:
패키지가 설치되었으면 리소스를 등록하여 프로젝트의 필수 컨트롤을 추가해야 합니다.
다음과 같은 단계를 거치시기 바랍니다.
~/_ViewImports.cshtml 파일을 열고 다음 코드를 추가합니다.
@using C1.Web.Mvc @using C1.Web.Mvc.Fluent @addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers @addTagHelper *, C1.AspNetCore.Mvc
‘~/Shared/_Layout.cshtml’ 파일을 열고 헤드 섹션에서 다음 태그를 추가합니다.
<head> ... <c1-styles /> <c1-scripts /> </head>
손익 분기 차트를 추가하는 방법
위 두 단계를 마쳤으면 손익 분기 차트를 프로젝트에 추가할 준비가 된 것입니다. 이 섹션에서는 프로젝트에 손익 분기 차트를 추가하는 방법을 배웁니다.
이익 및 손실 영역이 표시된 손익 분기 차트
손익분기점이 표시된 손익 분기 차트
다양한 변수가 표시된 손익 분기 차트
이익 및 손실 영역이 표시된 손익 분기 차트
위 차트는 단순한 손익 분기 차트로, 이익 및 손실 영역만 표시되어 있습니다.
다음 코드 조각에 이 차트를 추가하십시오.
<c1-flex-chart id="breakeven"> <c1-flex-chart-breakeven fixed-cost=1000000" variable-cost="20" sales-price="120"> </c1-flex-chart-breakeven> </c1-flex-chart>
손익분기점이 표시된 손익 분기 차트
위 차트는 이익 및 손실 영역이 표시된 단순한 손익 분기 차트와 동일합니다.
이 차트는 파란색 직선이 추가된 손익 분기 차트이며, 파란색 선은 다른 색을 설정하여 수정할 수 있습니다.
다음 코드 조각을 참조하시기 바랍니다.
@{ var _styles = new BreakEvenStyles(); _styles.BreakEven = new SVGStyle() { Stroke = "blue", StrokeWidth = 3 }; } <c1-flex-chart id="breakeven2"> <c1-flex-chart-breakeven fixed-cost="1000000" variable-cost="20" sales-price="120" styles="_styles"> </c1-flex-chart-breakeven> </c1-flex-chart>
여러 변수가 표시된 손익 분기 차트
위 차트에는 기타 계산된 변수(안전 마진, 영업 매출, 총 비용 등)가 표시되어 있습니다.
이렇게 하려면 각 변수에 SVGStyle을 사용하여 표시 스타일을 설정하면 됩니다.
이 작업을 위해 다음 코드 조각을 사용하시기 바랍니다.
@{ var styles = new BreakEvenStyles() { BreakEven = new SVGStyle() { Stroke = "rgb(69,171,235)", StrokeWidth = 2}, FixedCost = new SVGStyle() { Stroke = "grey", StrokeWidth = 2 }, MarginalProfit = new SVGStyle() { Stroke = "green", StrokeWidth = 2 }, SafetyMargin = new SVGStyle() { Stroke = "lightgreen", StrokeWidth = 0 }, SalesRevenue = new SVGStyle() { Stroke = "rgb(127,42,250)",StrokeWidth =2 }, TotalCost = new SVGStyle() { Stroke = "red",StrokeWidth =2}, VariableCost = new SVGStyle() { Stroke = "black", StrokeWidth = 2} }; } <h3>BreakEven Chart with various values</h3> <c1-flex-chart id="breakeven3"> <c1-flex-chart-breakeven fixed-cost="1000000" variable-cost="20" sales-price="120" styles="styles"> </c1-flex-chart-breakeven> </c1-flex-chart>
위 코드 조각에 따라 스타일을 수정하고 차트에 속성이 표시되도록 설정할 수 있습니다.
자세히 알아보려면 을 확인하십시오.
댓글목록
등록된 댓글이 없습니다.