---
code: "SCH-20"
id: "c-sch-vchain"
tab: "schemas"
kind: "schema"
title: "Value Chain · 가치사슬"
library: "SVG"
deps: ["svg"]
load: "low"
pasteKind: "schema-svg"
family: "chain"
dataShape: "9-cell diagram with 본원5+지원4 axis"
tasks: ["structure ideas", "explain process", "choose communication frame"]
tags: ["chain", "본원5+지원4", "9cells", "Value Chain", "Porter", "마진", "원가분석"]
gallery: "https://graph.heal7.com/#SCH-20"
js: "/sku/SCH-20.js"
---

# [SCH-20] Value Chain · 가치사슬

> AI 붙여넣기 카드. 갤러리 런타임(`main.js`)이 아니라 이 파일을 가져와라.

## 언제 가져가나
본원 5활동 + 지원 4활동 → 마진 — 원가/차별화 포인트 진단의 Porter 가치사슬.

**응용** 원가 구조 분석, 차별화 포인트 식별, 아웃소싱 의사결정.

## 데이터 모양
- family: `chain`
- dataShape: 9-cell diagram with 본원5+지원4 axis
- tasks: structure ideas, explain process, choose communication frame
- tags: chain, 본원5+지원4, 9cells, Value Chain, Porter, 마진, 원가분석

- schema.type: `chain`
- schema.cells: `9`
- schema.axis: `본원5+지원4`


## 의존
svg · load `low` · library `SVG`

## 붙여넣는 법
1. 라이브러리 없음. svg viewBox 0 0 400 240
2. 아래 body 를 svg 안에 넣는다
3. 색 변수(`${gold}` 등)는 T 토큰으로 치환한다

```js
const T = {
  "bg": "transparent",
  "fg": "#ece8f5",
  "sub": "#a59bbd",
  "grid": "rgba(255,255,255,.08)",
  "gold": "#e8c069",
  "royal": "#6b8cff",
  "rose": "#e07a9f",
  "teal": "#6dd2c4",
  "plum": "#b487e8"
};
const gold = T.gold, royal = T.royal, rose = T.rose, teal = T.teal, plum = T.plum, fg = T.fg, sub = T.sub;
const stroke = 'rgba(255,255,255,.18)';
const fill1 = 'rgba(232,192,105,.10)';
const fill2 = 'rgba(107,140,255,.10)';
const host = document.querySelector('#chart');
const body = `
    ${['기업 인프라','인적자원 관리','기술 개발','조달 활동'].map((lab,i)=>`
      <rect x="20" y="${20+i*22}" width="320" height="20" rx="3" fill="rgba(180,135,232,.10)" stroke="${plum}" stroke-width="1"/>
      <text x="30" y="${34+i*22}" fill="${fg}" font-size="11">${lab}</text>
    `).join('')}
    <text x="350" y="55" fill="${plum}" font-size="9" font-weight="600" transform="rotate(-90 350 55)">지원활동</text>
    ${['인바운드','운영','아웃바운드','마케팅·영업','서비스'].map((lab,i)=>{
      const x = 20 + i*64;
      return `<polygon points="${x},120 ${x+58},120 ${x+64},140 ${x+58},160 ${x},160 ${x+6},140" fill="rgba(232,192,105,.16)" stroke="${gold}" stroke-width="1.5"/>
              <text x="${x+32}" y="144" text-anchor="middle" fill="${fg}" font-size="10" font-weight="600">${lab}</text>`;
    }).join('')}
    <text x="350" y="148" fill="${gold}" font-size="9" font-weight="600" transform="rotate(-90 350 148)">본원활동</text>
    <polygon points="20,180 360,180 360,210 350,225 30,225 20,210" fill="rgba(109,210,196,.16)" stroke="${teal}" stroke-width="1.5"/>
    <text x="200" y="205" text-anchor="middle" fill="${teal}" font-size="13" font-weight="700">M A R G I N · 마진</text>
  `;
host.innerHTML = '<svg viewBox="0 0 400 240" width="100%" height="100%" preserveAspectRatio="xMidYMid meet" style="overflow:visible">' + (typeof body === 'string' ? body : '') + '</svg>';
```

## 원본 factory (갤러리 정본 발췌)
- file: `frontend/js/graph-gallery/main.js`
- lines: 3911-4470
- gallery: https://graph.heal7.com/#SCH-20
- raw js: https://graph.heal7.com/sku/SCH-20.js

```js
`
    ${['기업 인프라','인적자원 관리','기술 개발','조달 활동'].map((lab,i)=>`
      <rect x="20" y="${20+i*22}" width="320" height="20" rx="3" fill="rgba(180,135,232,.10)" stroke="${plum}" stroke-width="1"/>
      <text x="30" y="${34+i*22}" fill="${fg}" font-size="11">${lab}</text>
    `).join('')}
    <text x="350" y="55" fill="${plum}" font-size="9" font-weight="600" transform="rotate(-90 350 55)">지원활동</text>
    ${['인바운드','운영','아웃바운드','마케팅·영업','서비스'].map((lab,i)=>{
      const x = 20 + i*64;
      return `<polygon points="${x},120 ${x+58},120 ${x+64},140 ${x+58},160 ${x},160 ${x+6},140" fill="rgba(232,192,105,.16)" stroke="${gold}" stroke-width="1.5"/>
              <text x="${x+32}" y="144" text-anchor="middle" fill="${fg}" font-size="10" font-weight="600">${lab}</text>`;
    }).join('')}
    <text x="350" y="148" fill="${gold}" font-size="9" font-weight="600" transform="rotate(-90 350 148)">본원활동</text>
    <polygon points="20,180 360,180 360,210 350,225 30,225 20,210" fill="rgba(109,210,196,.16)" stroke="${teal}" stroke-width="1.5"/>
    <text x="200" y="205" text-anchor="middle" fill="${teal}" font-size="13" font-weight="700">M A R G I N · 마진</text>
  `
```

## 시나리오
- 원가 구조 분석 — 어디서 비용 발생
- 차별화 포인트 식별 — 어디서 가치 추가
- 아웃소싱 의사결정 — 비핵심 활동
- M&A 시너지 분석 — 가치사슬 통합

## 관련 SKU
`c-sch-porter5`, `c-sch-3flow`

