benscript 님의 블로그

SpreadJS 여러 기능을 테스트를 하는 중 이번에는 setDataSource() 메서드로 JSON 데이터 바인딩하는 기능에 대해서 보았습니다.1. 기본 바인딩 구조SpreadJS에서 JSON 데이터를 시트에 바인딩하려면 워크북 생성 → 시트 지정 → `setDataSource()` 순서로 연결하면 됩니다.예제:딱히 설정할 게 없고, JSON 객체의 key가 열로 자동 매핑됩니다. 2. 열 수동 설정자동으로 열이 생성되는 게 싫다면 autoGenerateColumns를 꺼두고 보여줄 열만 직접 바인딩할 수 있습니다. sheet.autoGenerateColumns = false;sheet.setDataSource(data); // 데이터 먼저 바인딩sheet.bindColumns([ { name:..

웹에서 Excel 파일을 불러오고 저장하는 니즈가 있어 SpreadJS의 엑셀 import/export 기능을 살펴보았습니다.일반 엑셀 유형 뿐만 아니라 자체적으로 지원하는 sjs, ssjson 등도 있더라구용 일단 설정 방법은 먼저 헤더 섹션에 gc.spread.sheets.io를 추가 설정해줘야 합니다.🔧 설정 방법 (HTML) 그 다음 spreadjs 컨트롤을 호스팅할 div 요소와 엑셀 불러오기/내보내기 이벤트를 불러올 버튼을 추가해줍니다. 🚀 JavaScript 설정📦 SpreadJS 초기화그 다음은 GC.Spread.Sheets.Workbook의 인스턴스를 생성해줍니다.var spread;window.onload = function () { sprea..

브라우저에서 엑셀과 같은 기능 구현에 대한 니즈가 있어 찾던 중 SpreadJS에 대해 알게 되어 공부해보았습니다. 처음에는 엑셀 기능을 JS로 구현할 수 있다는 말에 과연이라는 생각이 들었는데 막상 써보니까 나쁘지 않더라구요 공식 홈페이지를 보니 그냥 엑셀 웹버전이고 필터, 차트, 수식 설정도 있구요 공식 문서에 기본 예제에 그냥 복붙하니 금방 구현 가능했어요 ㅋㅋ 단순하게 html 에 호스팅할 div 태그 설정해주고 WorkBook 인스턴스 생성하면 워크북이 만들어집니다setValue 는 데이터 할당해주는 메서드인 거 같습니당https://demo.mescius.co.kr/spreadjs/learn-spreadjs/features/workbook/initialization/purejs Spread ..