LinkGrid v2.0 Enterprise Release

단 하나의 솔루션, 무한한 데이터의 가능성

단순한 표(Table)를 넘어선 엔터프라이즈급 UI 컴포넌트. 가상 스크롤, 실시간 렌더링, 트리 구조까지 당신이 상상한 모든 데이터를 완벽하게 제어합니다.

linkgrid.io/dashboard-demo
COMPANY_CODE STATUS PERFORMANCE VOLUME
CORP_1026 Active
70%
↑ 145,000
CORP_2026 Warning
60%
↓ 92,400
CORP_3026 Active
50%
↓ 92,400
DEPARTMENT_NAME HEAD_COUNT BUDGET_USAGE
Executive Board 12
R&D Division 145
Marketing Team
42
SYMBOL CURRENT_PRICE TREND (24H) REAL_TIME_CHART
AAPL $175.50 +1.24%
TSLA $202.10 -3.45%
NVDA $850.20 +5.67%

Unrivaled Capabilities

시선을 사로잡는 강력한 퍼포먼스

단순히 데이터를 보여주는 것을 넘어, 사용자가 데이터와 상호작용하는 방식을 혁신합니다. 개발자는 코드를 줄이고, 사용자는 최고의 경험을 얻습니다.

가상 스크롤 엔진

10만 건 이상의 데이터도 지연 없이 렌더링합니다. 뷰포트에 노출되는 행만 DOM에 생성하여 극강의 메모리 최적화를 이뤄냈습니다.

계층형 트리 그리드

부모-자식 관계를 가진 데이터를 직관적인 트리 구조로 표현합니다. Lazy Load 방식을 지원하여 대규모 트리도 거뜬합니다.

실시간 부분 렌더링

데이터 변경 시 전체를 다시 그리지 않고, rowElementMap을 통해 대상 셀(Cell)만 타겟팅하여 초고속으로 업데이트합니다.

완벽한 엑셀 연동

화면에 보이는 그대로 엑셀/CSV로 내보내거나, 대량의 엑셀 데이터를 그리드에 바로 붙여넣기(Copy & Paste) 할 수 있습니다.

플러그인 아키텍처

가벼운 코어를 유지하며, Canvas 기반의 꺾은선 차트 등 무거운 렌더링 기능은 필요할 때만 로드하는 확장 구조를 제공합니다.

엔터프라이즈 표준 준수

카멜 케이스 명명 규칙, MVC 패턴 호환성, 대문자 기반의 엄격한 데이터베이스 설계 원칙을 완벽하게 지원합니다.

Documentation

친절하고 완벽한
개발자 매뉴얼

도입부터 고급 커스터마이징까지. 개발 조직이 즉시 실무에 적용할 수 있도록, FM 규격을 준수한 방대한 기술 문서와 레퍼런스를 제공합니다.

LinkGrid_Reference.md

1. 초기화 및 기본 설정

HTML 태그에 data-linkgrid 속성을 부여하는 것만으로 시스템이 자동으로 인스턴스를 바인딩합니다.

<div data-linkgrid data-height="500px" data-row-model="client">
  <table>
    <thead>
      <tr>
        <th data-field="userCodeVarchar">회원코드</th>
      </tr>
    </thead>
  </table>
</div>

2. 특수 렌더링 타입 가이드

data-type 속성을 통해 셀의 시각적 형태를 손쉽게 변경할 수 있습니다.

  • progress: 막대그래프 + 퍼센트 표기
  • trend: 과거/현재 값을 비교하여 등락 색상(적/청) 자동 적용
  • line: 실시간 스파크라인 차트 (플러그인 필요)

3. updateCellValue API

가상 스크롤 엔진 내부의 rowElementMap을 타겟팅하여 단일 셀만 극도로 빠르게 갱신합니다.

// 1. 그리드 인스턴스 획득
const grid = document.getElementById('gridId').__grid;

// 2. 단일 셀 데이터 실시간 갱신 (rowId, field, value)
grid.updateCellValue('USER_1001', 'performanceInt', 85);

개발자와 사용자를 모두 만족시키는
단 하나의 마스터피스

복잡한 설정은 덜어내고, 무한한 확장성을 부여했습니다.
지금 바로 당신의 프로젝트에 LinkGrid를 연동해 보세요.