CyberI 제품소개 33

PhantomJS로 GRID&CHART를 PDF 출력하기 (3편 : Header & Footer에 이미지 넣기)

안녕하세요!! CX사업부 MD 태태입니다!지난번에 우리가 문서 규격을 갖춘 PDF를 출력하고 헤더, 푸터 까지 출력했었죠.그런데 기억하시나요?그 때 우리는 한가지 문제에 직면했었습니다.기억을 더듬기 위해 지난번 코드의 일부를 살펴보지요.1234567891011121314151617181920212223242526272829303132page.paperSize = { format: 'A4', orientation: 'portrait', margin: { left: '1cm', right: '1cm' }, header: { height: '1cm', contents: phantom.callback(function () { var div = document.createElement('div'); var img..

PhantomJS로 GRID&CHART를 PDF 출력하기 (2편 : 페이지설정, Header & Footer )

안녕하세요!! CX사업부 MD 태태입니다! 지난번 글 에서 PhantomJS를 이용해서 간단히 Google(우리의 구글신) 화면을 캡쳐했었습니다! 하지만 우리가 단순히 화면만 캡쳐할 거였으면 이미지로 만들었겠죠~ 실제로 PhantomJS를 통하여 동일한 로직을 통해 이미지 파일을 추출할 수도 있습니다. (추출파일 확장자만 바꿔주면 되요) 그러나 우린 문서를 원합니다!! 이미지가 아닌 PDF 문서! 문서형식의 파일에는 여러가지 페이지에 대한 설정들이 들어가게 됩니다. 페이지 여백 설정, 방향설정, 페이지 Header, Footer설정, 페이지 크기 등 다양한 설정을 할 수 있어야 하겠지요. 그렇기 때문에 이번에는! PhantomJS로 그리드&차트 PDF 출력하기 그 두번째 내용으로 PDF 문서의 페이지설정..

PhantomJS로 GRID&CHART를 PDF 출력하기 (1편 : 시작하기)

웹포넌트 그리드와 차트는 웹 상에서 표현된 데이터를 Excel, CSV, PDF 등의 파일로 추출하는 기능을 가지고 있습니다. 데모 보러가기 클릭!! 그 중 PDF를 추출하는 기능은 PhantomJS 라는 툴을 이용하여 만들었는데요, PDF추출 기능을 구현하며 처음 사용해 된 PhantomJS! 세상 모든것들이 그렇듯 잘 사용하기만 하면 아주 유용한 녀석입니다. 만들면서 많은 시행착오를 겪게 되었는데요, 앞으로 몇 회에 걸친 글을 통해 구현하면서 얻게 된 Know How와 Tip들을 공유해보도록 하겠습니다. 그 첫 시간으로 PhantomJS란 과연 무엇인지에 대한 간략한 설명과 함께 기본적인 Screen capture에 대해 설명하도록 하겠습니다. 1. PhantomJS 란? PhantomJS 공식 홈페..