알메이트-차트 7.0 사용 설명서
고급 사용자를 위한 기능

차트 내보내기

알메이트 차트는 화면에 표현된 차트의 모양 그대로 이미지 혹은 pdf 파일로 내보내기 하거나 차트의 데이터만 csv 포맷으로 내보내기 할 수 있습니다. 내보내기 결과에 의해 파일이 저장되는 장소는 사용자의 로컬 PC 혹은 서버 모두 가능합니다.

PC에 내보내기

화면에 표현된 차트를 사용자의 PC 에 내보내기 하는 것은 다음 두 가지 방법으로 가능합니다.

  • 컨텍스트 메뉴 : 마우스 오른쪽 버튼을 차트에 클릭하고 내보내기를 원하는 포맷의 파일을 선택합니다. 알메이트 차트에서는 png, jpg, pdf 포맷으로 차트의 모양을 그대로 내보내기할 수 있으며, csv 포맷으로 차트의 데이터를 내보내기할 수 있습니다.
  • 자바스크립트 : 자바스크립트 함수를 이용해서 내보내기하는 API 함수(rMateChartH5.downloadToLocal)를 호출합니다. 아래 코드는 png 와 pdf 포맷으로 차트를 내보내기하는 예제입니다. rMateChartH5.downloadToLocal() 함수의 네 번째 인자는 이미지 파일 내보내기를 원할 경우 saveAsImage() 함수를 호출하고, pdf 파일 내보내기를 원할 경우에는 getSnapshot() 함수를 호출해야 합니다. 예제에서 사용된 서버 스크립트(downloadLocal.jsp) 파일은 제품의 Samples\SnapshotServerSamples 디렉토리에서 찾으실 수 있습니다.
// png 포맷으로 내보내기
rMateChartH5.downloadToLocal("rMateChartH5", "png",
"http://demo.riamore.net/chartTest/snapshotSample/downloadLocal.jsp",
function() {
return document.getElementById("chart1").saveAsImage();
});
// pdf 포맷으로 내보내기
rMateChartH5.downloadToLocal("rMateChartH5", "pdf",
"http://demo.riamore.net/chartTest/snapshotSample/downloadLocal.jsp",
function() {
return document.getElementById("chart1").getSnapshot("jpeg");
},
(function(){
var holder = document.getElementById("chartHolder"),
width = holder.offsetWidth, height = holder.offsetHeight;
return {portrait : width < height, size : {width : width, height : height}
};
})());

서버에 내보내기

화면에 표현된 차트를 서버에 내보내기 하는 방식은 차트의 getSnapshot() 함수를 호출하여 차트 이미지를 base64 형태로 인코딩한 데이터를 서버로 전송(submit)한 후, 서버 스크립트를 통해서 처리하는 방식입니다. 이러한 작업은 서버를 통한 배치(batch) 작업이 필요한 경우 유용하게 활용될 수 있습니다. 다음은 차트를 서버에 내보내기 하는 기능에 대한 예제입니다. 예제에서 사용된 서버 스크립트(getImageSnapshot.jsp) 파일은 제품의 Samples\SnapshotServerSamples 디렉토리에서 찾으실 수 있습니다.

function GetSnapshot() {
var base64src = document.getElementById("chart1").getSnapshot();
var data = document.getElementById("data");
var extension = document.getElementById("extension");
extension.value = "png";
data.value = base64src;
document.getElementById("sumForm").submit();
}
<form id="sumForm" name="sumForm" action="http://demo.riamore.net/chartTest/snapshotSample/getImageSnapshot.php" method="post">
<input type="hidden" id="data" name="data" type="text"/>
<input type="hidden" id="extension" name="extension" value="png"/>
</form>