2019년 4월 29일

사이냅에디터 2.3.0 버전이 릴리즈되었습니다.

주요 개선사항

엑셀임포트

• xlsx,xls 확장자를 가지는 엑셀 문서 임포트 기능이 추가 되었습니다.

해당 확장자를 가지는 문서를 임포트 하였을 경우,

위와같은 영역을 선택할 수 있는 화면이 제공 됩니다.

자동 영역 선택을 클릭하면 데이터가 있는 모든 영역(데이터가 있는 시작부터 데이터가 있는 끝 영역)을 불러오게 됩니다.

1. 2,600개 이상의 셀을 가지는 문서를 임포트 하였을 경우에는
   

   

   위와 같은 경고메세지가 발생합니다. 

2. 10,000개 이상의 셀을 가지는 문서를 임포트 하였을 경우에는
   
   위와 같은 경고메세지가 발생합니다. 
   
   

DOM API

• DOM API를 사용하여 HTML DOM Element 접근하여 데이터 입력, 추출이 가능합니다.

Example)

입력

	document.getElementById('input').addEventListener('click', function () {
            var elInput = document.getElementsByClassName('setText');
            var data = [];


            for (var i = 0; i < elInput.length; i++) {
                data.push({
                    selector: '#' + elInput[i].name,
                    text: elInput[i].value
                });
            }
            try {
                window.editor.setTextBySelectors(data);
            } catch (e) {
                console.error(e);
            }
	});

추출

	document.getElementById('output').addEventListener('click', function () {
            var elOutputs = document.getElementsByClassName('getText');
            var selectors = [];
            var texts = [];


            for (var i = 0; i < elOutputs.length; i++) {
                selectors.push('#' + elOutputs[i].name);
            }

            texts = editor.getTextBySelectors(selectors);

            for (var i = 0; i < elOutputs.length; i++) {
                elOutputs[i].value = texts[i];
            }
	});

수식 편집

• 수식을 이용한 자동계산 기능이 추가되었습니다.
  • 참조된 셀 데이터 편집 수식 자동 계산
  • 행/열 추가 및 삭제 수식 자동 계산
  • 셀 임포트 수식 데이터 유지
  • 에디터 편집 내용 저장 및 불러오기 수식 데이터 유지

formula js 설정시 수식 사용가능

<!-- formula-parser -->
<script type="text/javascript" src="../resource/formula-parser.min.js"></script>

수식이 있는 셀 표시

• 테이블이 선택되면 수식/표시형식이 있는 셀에 f(x) 표시가 보여집니다.

표시형식 적용 @@@ 작성중 @@@

• 표시형식

표 편집 핸들 설정

• 표 핸들 사용여부 설정이 추가되었습니다.
  • 설정 키 : "editor.table.handle"
  • 기본값 : true

	/**
     * 에디터 표 핸들을 사용할지 여부를 설정합니다.
     */
    'editor.table.handle': true

업로드 패널 숨기기 (이미지/동영상/파일 업로드)

• 업로드 API가 설정되지 않으면 업로드 패널이 보이지 않도록 개선되었습니다.
• 업로드 API 설정 :
  • "editor.upload.image.api"
  • "editor.upload.video.api"
  • "editor.upload.file.api"

텍스트/텍스트 배경색 색상 표시

• 캐럿이 위치한 곳의 텍스트 색과 텍스트 배경색이 표시되도록 개선되었습니다.

버튼 크기 설정하기

• 버튼의 크기를 조절할 수 있는 설정이 추가되었습니다.
  • 설정 키 : "editor.ui.button.size"
  • 기본값 :  35 (최소값 22, 단위 px)

문서열기(임포트) 전후 이벤트

• 문서열기(임포트) 전후에 발생하는 이벤트가 추가되었습니다.
  • "beforeOpenDocument"
  • "afterOpenDocument"
• 자세한 내용 보기 : 이벤트 (Event)

에디터 플러그인  @@@ 작성중 @@@

• 에디터에 플러그인을 추가할 수 있도록 개선되었습니다.
• 플러그인 추가하기 <= 링크

포토에디터

• ToastUI Image Editor 
• 자세한 내용 보기 : 설치 (v2.2.0 이후) - 3.5 에디터 플러그인

툴바 버튼 네비게이터

• 에디터의 크기가 작아져도 툴바의 버튼이 아래로 떨어져서 그려지지 않도록 개선되었습니다.

릴리즈 2.3.0 이슈 목록