Page tree
Skip to end of metadata
Go to start of metadata

도형 멀티셀렉션, Iframe mode, Document mode가 추가된 사이냅에디터 2.10.0 버전이 릴리즈 되었습니다.

그 외에도 표 절대좌표 지원, 도형 텍스트 정렬기능 등 많은 기능이 개선되었습니다.

주요 개선사항



Notice

사이냅에디터 2.8.0 버전부터 에디터 스크립트 파일을 경량화하고자 임포트 기능과 도형 관련 기능을 외부 모듈로 분리하였습니다.

기존과 동일하게 임포트 기능과 도형 관련 기능을 사용하시려면 아래의 파일들을 추가로 include 하셔야 합니다.

문서 임포트 기능 사용 (SEDocModelParser)

xlsx, docx, hwp 등의 문서를 임포트 하는 기능을 사용하기 위해서는 에디터 패키지 externals 폴더 아래에 포함된 SEDocModelParser 모듈을 include  합니다.

<script src="externals/SEDocModelParser/SEDocModelParser.min.js"></script>

도형 관련 기능 사용 (SEShapeManager)

도형이 포함된 문서를 임포트 하거나, shapeEditor 플러그인의 기능을 사용하기 위해서는 에디터 패키지 externals 폴더 아래에 포함된 SEShapeManager 모듈을 include 합니다.

<script src="externals/SEShapeManager/SEShapeManager.min.js"></script>


1. 도형 멀티셀렉션

Shift 키를 이용한 도형 멀티셀렉션

Shift 키를 누른 채로 도형을 선택하면 멀티셀렉션이 가능하며 멀티셀렉션 상태에서는 속성 버튼이 disable 됩니다.


마우스 Drag를 이용한 멀티셀렉션을 제공하기 위해 "선택 모드"가 추가되었습니다.

config 파일 toolbar 설정에 아래와 같이 "selectionMode"를 추가하면 기능이 활성화됩니다.

'editor.toolbar': [
    ...,
    'selectionMode', 'shapeEditor'
    ...
],

 

2. Iframe mode 지원

config 파일에 아래와 같은 설정을 추가하면 iframe mode를 사용할 수 있습니다.

iframe mode를 설정하면 편집 영역이 iframe 안쪽에 생성되어 외부 스타일의 영향을 최소화할 수 있습니다.

사용자 UX에 달라지는 부분은 없습니다.

'editor.mode.iframe': {
    'enable': true,
    'style.urls': ['../dist/iframeMode/contentsEditStyle.css', ... ],
    'script.urls': ['../dist/iframeMode/SEPolyfill.js']
}

주의) Iframe mode 사용 시 에디터가 완전히 초기화된 후 에디터 API를 사용하셔야 합니다.

Iframe mode 사용에 대한 자세한 사항은 [설치 및 설정 > 환경설정 > 기본 UI 설정 > Iframe mode]를 참고해주세요.

3. Document mode 지원

config 파일에 아래와 같은 설정을 추가하면 document mode를 사용할 수 있습니다.

'editor.document.size' 값은 별도로 설정하지 않으면 아래와 같은 기본값을 가지게 됩니다. 기본 설정값은 MS-Word의 A4 크기와 유사합니다.

'editor.type': 'document',
'editor.document.size': {
    'width': 793,
    'height': 1122,
    'padding': { 'top': 96, 'right': 96, 'bottom': 96, 'left': 96 }
},

Document mode 사용에 대한 자세한 사항은 [설치 및 설정 > 환경설정 > 기본 UI 설정 > Document mode]를 참고해주세요.

>> Document mode 사용해보기

4. 표 절대좌표 지원

표 속성에 "글자처럼 취급" 기능이 추가되었습니다.

"글자처럼 취급"을 해제하면 표 이동 핸들을 이용해서 표를 자유롭게 이동할 수 있습니다.


5. 주요 도형 아이콘을 툴바에 추가하기

자주 사용하는 도형을 툴바에 배치할 수 있는 추가되었습니다.
config 파일의 toolbar 부분에 아래와 같이 "shapeEditor_도형이름" 형식으로 필요한 도형을 추가할 수 있습니다.

 'editor.toolbar': [
    'shapeEditor', 'shapeEditor_textBox','shapeEditor_rectangle','shapeEditor_roundedRectangle','shapeEditor_oval'
],

[적용결과]

추가 가능한 도형의 종류

추가 가능한 도형의 종류와 도형 이름은 [플러그인 > 도형 편집기]에서 확인 할 수 있습니다.

6. 도형에 텍스트 정렬 기능 추가

도형 내부의 텍스트를 정렬할 수 있는 기능이 추가되었습니다.


7. 특수기호에 "그리스어 및 콥트어" 추가

특수기호에 "그리스어 및 콥트어"가 추가되었습니다.

8. 복사/붙여넣기 개선

MS-Word, MS-Excel 문서에서 복사한 내용에 대한 붙여넣기 품질이 개선되었습니다.

다만 MS-Office, HWP 문서에서 복사한 내용을 에디터에 붙여 넣을 경우 OS, 해당 애플리케이션, 브라우저 등 구조적으로 많은 제약사항이 있습니다.
문서를 조금 더 원본에 가까운 형태로 불러오려면 "임포트" 기능을 이용해 주세요.

  • No labels