선택한 단어 수는 입니다.
최소 단어 이상 선택하여야 합니다.
최소 단어 이상 선택하여야 합니다.
선택한 단어 수는 30입니다.
최대 10 단어까지만 선택 가능합니다.
최대 10 단어까지만 선택 가능합니다.
문제 정의
- 이 SVGObject 클래스를 상속받는 각 그래픽 엘리먼트에 해당하는 관련 클래스들을 SVGObject와 분리시켜 선언함으로써 해당 멤버 참조만으로 데이터 구조를 관리할 수 있도록 캡슐화 시켜 설계하였고, 각 SVG 엘리먼트들을 분리하여 관리할 수 있도록 CTypedPtrList 템플리트 리스트를 전역으로 선언하여 사용하도록 하였다. 이는 모든 SVG 엘리먼트들을 기본 클래스의 멤버로 구성하는 경우 메모리적재량의 크기가 늘어나는 점에 착안하여 설계하였다. 또한, 각 SVG 노드들의 기본 정보 및 프로퍼티 정보를 통합하여 관리하기 위해 NODEDATA 타입의 데이터 구조를 멤버로 갖는다.
- 이에 본 논문에서는 SVG 1.1 문서의 입력에 따라 문서의 논리 구조를 처리하기 위한 SVG DOM 처리기와 생성된 SVG 그래픽 객체를 올바로 렌더링 시키고, 저작된 그래픽 객체들을 SVG 구문으로 변환해 주는 SVG 문서 저작 시스템을 설계 및 구현하였다.
- 이에 본 논문에서는 SVG에 대한 기초기술 연구 및 인터넷 상에서 사용되는 벡터 그래픽 처리를 위해 일반 사용자들이 손쉽게 그래픽 객체를 생성하고 편집할 수 있도록 그래픽 저작 시스템에 관한 구조를 정의하였다. 또한, 저작된 각 그래픽 객체들을 통해 SVG 문서를 생성하는 코드 생성기를 정의하여 벡터 그래픽을 XML 기반의 논리구조로 변환하는 SVG 문서 저작 시스템을 설계 및 구현한다.
제안 방법
- 이는 또한 타임 테이블(Time Table) 형태의 사용자 인터페이스를 가지며 타임 라인(Time Line)을 이용해 애니메이션 시간을 지정하여 시간 중심으로 처리된다. 애니메이션 처리기를 사용하기 위해 SVG DOM 처리기의 애니메이션 플래그인 m_bSvgAimate의 값을 "TRUE, 로 설정하여 타임 라인에 객체를 추가하는 방식으로 설계한다.
- SVG DOM 객체 트리 운행은 입력된 DOM 트리에 대해 깊이 우선 탐색 (Depth First Search : DFS)으로 처리하며 각 SVG 객체의 특징에 따라 분류 후 SVG 객체 관리기를 호출한다. SVG 트리운행부로부터 전달받은 노드 정보들은 그래픽 객체로의 변환을 위해 SVG 정보 추출기에서 각 그래픽 객체 생성을 위한 논리 정보를 추출한다.
- SVG DOM 처리기는 타 시스템에서도 사용할 수 있도록 DLL(Dynamic Linking Library) 형태로 설계하였다. 이를 이용해 트리 형태의 연결 구조나 선형 연결 구조, 또는 두 형태의 혼합된 연결 구조 등의 데이터 구조를 만들어 SVG의 논리 구조를 이용하는 다른 시스템으로의 확장이 용이 하도록 설계 하였다.
- SVG의 논리적인 정보를 처리하기 위해서는 기존의 DOM 만으로는 처리하기가 어려우므로, 본 시스템에서는 SVG 문서의 논리적인 구조상에서 필요한 정보를 추출 및 저장, 공유하기 위한 기반이 되도록 SVG DOM 관리기를 설계하였다. SVG DOM 관리기의 데이터 처리 과정 순차 흐름도를 그림 2에 보인다.
- TFC_EXT_API 정의는 DLL 의 특성상 DLL Import와 DLL Export 두 가지를 동시에 사용하기 위하여 조건부 정의를 사용하였다. 이 SVGObject 클래스를 상속받는 각 그래픽 엘리먼트에 해당하는 관련 클래스들을 SVGObject와 분리시켜 선언함으로써 해당 멤버 참조만으로 데이터 구조를 관리할 수 있도록 캡슐화 시켜 설계하였고, 각 SVG 엘리먼트들을 분리하여 관리할 수 있도록 CTypedPtrList 템플리트 리스트를 전역으로 선언하여 사용하도록 하였다.
- 정의하였다. 또한, 저작된 각 그래픽 객체들을 통해 SVG 문서를 생성하는 코드 생성기를 정의하여 벡터 그래픽을 XML 기반의 논리구조로 변환하는 SVG 문서 저작 시스템을 설계 및 구현한다.
- 구현하였다. 렌더링 엔진은 그래픽 객체를 효율적으로 관리하기 위한 그래픽 객체 관리기 모듈과 SVG 애니메이션을 실행하기 위한 애니메이션 처리기 모듈, 그래픽 객체를 사용자 뷰포트에 렌더링 시키기 위한 디스플레이 처리기 모듈로 일반화 시켰으며, 기타 그래픽 저작에 필요한 사용자 인터페이스 모듈들을 사용하여 구현하였다.
- 렌더링 엔진은 사용자들에게 그래픽 저작에 필요한 인터페이스를 제공하도록 구현하였으며 특히, 구현된 각 모듈들은 모듈간의 종속관계를 최소화시켜 모듈의 독립성에 중점을 두어 구현하였다. 렌더링 엔진은 그래픽 객체를 효율적으로 관리하기 위한 그래픽 객체 관리기 모듈과 SVG 애니메이션을 실행하기 위한 애니메이션 처리기 모듈, 그래픽 객체를 사용자 뷰포트에 렌더링 시키기 위한 디스플레이 처리기 모듈로 일반화 시켰으며, 기타 그래픽 저작에 필요한 사용자 인터페이스 모듈들을 사용하여 구현하였다.
- 구현하였다. 리스트의 해당 인덱스에 저장된 포인터를 이용하여 객체의 프로퍼티가 저장된 구조체를 연결함으로써 각 노드의 속성값들을 저장하도록 하였다. 표 2는 SVG DOM 처리기에 사용되는 주요 API를 나열한 것이다.
- 이렇게 생성된 노드는 기존 DOM 트리의 해당 위치에 삽입되기 위해 InsertSVGNode() 함수를 호출하여 각 위치별로 insertBefore 또는 appendChild 시킨 후 변경된 구조의 새로운 SVG DOM 트리를 생성한다. 변경된 SVG 구조는 임시 메모리에 저장된 SVG 문서에 실시간으로 변경된 내용이 적용되도록 설계하였다.
- 본 논문에서 구현한 SVG 문서 표현 시스템은 문서의 검증 및 정보 추출을 위해 MSXML 4.0 파서를 사용하여 렌더링 객체를 생성하였으며, 저작된 그래픽 객체를 SVG 구문으로 변환하기 위한 코드 변환기를 구현하였다.
- 본 시스템은 IBM-PC 호환 컴퓨터 (Pentium Ⅳ.-2.4G)에서 개발하였으며, Windows 2000 운운영체제에서 Visual C++ 6.0을 사용하여 구현하였고, SVG 문서 파싱을 위한 파서는 MSXML 4.0을 사용하였다.
- 본 시스템은 SVG 문서를 입 력으로 받아들여 문서의 논리 구조를 처리하기 위한 SVG DOM 처리기와 각각의 그래픽 객체를 사용자 뷰포트에 렌더링 시키기 위한 렌더링 엔진으로 나뉘어진다. 그림 1은 전체 시스템의 구성도이다.
- 변경된 정보는 CTimeRuler 클래스에서 애니메이션 규칙을 설정하고 변경된 내용을 토대로 SVG DOM 처리기의 해당 노드 정보를 변경한다. 사용자 인터페이스를 통해 애니메이션을 실행시키면 미리 설정된 애니메이션 정보를 그래픽 객체 관리기에 적용하여 m_nPlayTime에 설정된 시간만큼 사용자 뷰포트에서 애니메이션을 실행하도록 설계하였다.
- 사용자 이벤트에 따라 실행된다. 사용자의 마우스 이벤트가 발생하면, 렌더링 엔진의 도형 관리기에 사용자가 저작한 그래픽 객체를 생성하고 생성된 객체의 논리 정보를 토대로 SVG 구문을 작성하도록 구현하였다. SVG 구문을 작성하는데 사용되는 주요 API 함수는 표 3과 같다.
- 조건부 정의를 사용하였다. 이 SVGObject 클래스를 상속받는 각 그래픽 엘리먼트에 해당하는 관련 클래스들을 SVGObject와 분리시켜 선언함으로써 해당 멤버 참조만으로 데이터 구조를 관리할 수 있도록 캡슐화 시켜 설계하였고, 각 SVG 엘리먼트들을 분리하여 관리할 수 있도록 CTypedPtrList 템플리트 리스트를 전역으로 선언하여 사용하도록 하였다. 이는 모든 SVG 엘리먼트들을 기본 클래스의 멤버로 구성하는 경우 메모리적재량의 크기가 늘어나는 점에 착안하여 설계하였다.
- 이 데이터 구조는 SVG 코드 변환기와 데이터를 교환함으로써 SVG 구문을 자동으로 생성해 내는 추상적인 골격을 제시한다.
- 제공한다. 이 모듈은 DLL과 렌더링 엔진 사이의 상호작용에 많은 호환성을 제공하기 위해 별도의 헤더파일로 구현한 후, 사용하는 위치에 따라 DLL Import 또는, DLL Export의 두 가지 기능을 동시에 사용할 수 있도록 조건부 정의를 사용하여 구현하였다.
- 그래픽 객체 관리기는 사용자 뷰의 물리적 크기를 논리적 크기로 변환하는 캔버스 관리기와 각 SVG 그래픽 객체들을 생성, 저장 및 편집하기 위한 도형 관리기로 분류한다. 이들 각각의 모듈이 서로 독립적으로 동작하게 함으로써 모듈의 독립성에 중점을 두어 설계하였다.
- 이 함수는 파라미터로 주어진 DOMNodeType에 의해 해당 노드를 생성(createNode)하고 해당 노드에 속성(Attributes)들이 존재하거나 프로퍼티 값이 존재할 경우 SetSVGAttributeQ 함수를 호출한다. 이렇게 생성된 노드는 기존 DOM 트리의 해당 위치에 삽입되기 위해 InsertSVGNode() 함수를 호출하여 각 위치별로 insertBefore 또는 appendChild 시킨 후 변경된 구조의 새로운 SVG DOM 트리를 생성한다. 변경된 SVG 구조는 임시 메모리에 저장된 SVG 문서에 실시간으로 변경된 내용이 적용되도록 설계하였다.
- 이를 이용해 트리 형태의 연결 구조나 선형 연결 구조, 또는 두 형태의 혼합된 연결 구조 등의 데이터 구조를 만들어 SVG의 논리 구조를 이용하는 다른 시스템으로의 확장이 용이 하도록 설계 하였다.
- 입력된 SVG 문서를 메모리에 트리 구조 형태로 생성하기 위해 MSXML'파서의 API(Application Programming Interface) 를 이용하였고, 생성된 DOM 객체는 깊이 우선 방식(DFS)의 트리 탐색을 통해 템플리트 리스트에 저장하도록 구현하였다. 리스트의 해당 인덱스에 저장된 포인터를 이용하여 객체의 프로퍼티가 저장된 구조체를 연결함으로써 각 노드의 속성값들을 저장하도록 하였다.
- 전체화면은 일반적인 그래픽 툴의 형태로 이루어지며, 자식 윈도우의 중앙에 SVG 캔버스를 위치시킴으로써 저작되는 그래픽 객체들을 한눈에 볼 수 있도록 인터페이스를 사용자 중심적으로 하였다. 특정객체에 애니메이션이 추가될 경우 화면의 하단에 위치한 애니메이션 컨트롤에 등록되어 사용자가 쉽게 SVG 그래픽 객체에 애니메이션을 추가하도록 구현하였다.
- 구조 정보를 전송한다. 캔버스 관리기는 구조 정보에서 'svg' 엘리먼트의 'width', 'height' 프로퍼티 정보를 추출하여 실제 캔버스의 물리적인 크기를 논리적인 사용자 뷰포트 크기로 매핑한 후 그래픽 저작의 배경 화면이 되는 캔버스를 생성하고 매핑된 논리적인 크기를 SVG DOM 처리기에 전송하여 SVG 문서 구조 정보를 변경한다.
- 전체화면은 일반적인 그래픽 툴의 형태로 이루어지며, 자식 윈도우의 중앙에 SVG 캔버스를 위치시킴으로써 저작되는 그래픽 객체들을 한눈에 볼 수 있도록 인터페이스를 사용자 중심적으로 하였다. 특정객체에 애니메이션이 추가될 경우 화면의 하단에 위치한 애니메이션 컨트롤에 등록되어 사용자가 쉽게 SVG 그래픽 객체에 애니메이션을 추가하도록 구현하였다.
- 변경한다. 해당 SVG 그래픽 객체를 관리 및 편집하기 위해 CDrawObj 클래스를 설계하였고 이를 토대로 모든 SVG 그래픽 객체들을 제어 및 관리하기 위해 CDrawTool 클래스를 설계하였다.
대상 데이터
- SVG 문서의 구성은 'svg, 엘리 먼트 내부에 포함된 다수의 SVG 엘리먼트들로 구성된다. 이 엘리먼트는 문서의 최상위 엘리먼트로 "<svg>"로 마크업하며, 항상 존재해야 하는 엘리먼트이다.
성능/효과
- 존재한다. 따라서, SVG 그래픽 객체의 논리 정보를 올바로 이해하고 처리할 수 있는 SVG DOM 처리기를 별도로 구현하였다 이에 따른 장점은 첫째, 기존 XML 파서의 의존도를 최소화함으로써 SVG 문서처리에 유연성을 제공하며, 둘째, 다른 시스템에 적용할 수 있도록 DLL 형태로 구성함에 따라 그래픽 처리에 따른 메모리 사용률을 최소화 시켰다는 점이다.
- 본 논문에서 제안한 전체 시스템의 장점은 첫째, W3C에서 제안하는 SVG 1.1의 렌더링 처리에 대한 구성을 기반으로 구현함으로써 표준화에 따른 처리 시스템으로써 변화에 능동적으로 대처 가능하다는 점이고, 둘째, 시스템을 모듈화하여 부분적인 수정 및 대체와 이식이 가능하다는 것과 WYSIWYG 방식의 인터페이스를 제공하여 사용자가 쉽게 SVG 문서를 저작할 수 있다는 점이다.
- 본 시스템의 장점으로는 W3C에서 제안하는 SVG 1.1의 권고안을 따르고 있어 표준화에 따른 처리 시스템이라는 점이고, 결과적으로 표준화의 변화에 빠른 대처가 가능하다. 또한 시스템의 대부분을 모듈화하여 부분적인 수정 및 대체와 이식이 가능하다는 장점이 있다.
후속연구
- 렌더링 연구가 진행되어야 할 것이다. 또한 모바일 환경에서 SVG 문서 처리를 위한 연구를 추가해야 할 것이다.
- 본 논문 결과는 SVG 관련 시스템 개발에 많은 영향을 줄 수 있으며, 텍스트기반의 SVG 포맷으로 저장된 이미지를 검색하여 사용자에게 제공할 수 있는 기반이 되고, 인터넷 상에서 광고나 전자상거래, 지리정보, 교육 등 그래픽이 많이 사용되는 여러 분야에서 SVG 문서를 표현하기 위해 본 시스템이 유용하게 사용되리라 사료된다.
- 향후 네임스페이스 (Namespace) 와 스크립트 (ECMA Script) 정의 등의 부가 기술 처리에 대해 보완해야 한다. 또한 모바일 환경에서 SVG 문서 처리에 대하여도 지속적인 관심과 연구가 요구된다.
- 향후 스크립트 및 네임스페이스 처리에 대한 연구와 다른 어플리케이션과의 결합을 위해 추가적인 렌더링 연구가 진행되어야 할 것이다. 또한 모바일 환경에서 SVG 문서 처리를 위한 연구를 추가해야 할 것이다.
※ AI-Helper는 부적절한 답변을 할 수 있습니다.