KR20190058005A - Svg 포맷의 편집 방법, 시스템 및 컴퓨터 판독 가능한 기록매체 - Google Patents

Svg 포맷의 편집 방법, 시스템 및 컴퓨터 판독 가능한 기록매체 Download PDF

Info

Publication number
KR20190058005A
KR20190058005A KR1020170155567A KR20170155567A KR20190058005A KR 20190058005 A KR20190058005 A KR 20190058005A KR 1020170155567 A KR1020170155567 A KR 1020170155567A KR 20170155567 A KR20170155567 A KR 20170155567A KR 20190058005 A KR20190058005 A KR 20190058005A
Authority
KR
South Korea
Prior art keywords
format
tags
coordinate information
svg
information
Prior art date
Application number
KR1020170155567A
Other languages
English (en)
Inventor
조기태
Original Assignee
그린캣소프트(주)
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by 그린캣소프트(주) filed Critical 그린캣소프트(주)
Priority to KR1020170155567A priority Critical patent/KR20190058005A/ko
Priority to US15/821,183 priority patent/US20190155878A1/en
Priority to JP2017226052A priority patent/JP2019096138A/ja
Publication of KR20190058005A publication Critical patent/KR20190058005A/ko

Links

Images

Classifications

    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F40/00—Handling natural language data
    • G06F40/10—Text processing
    • G06F40/12—Use of codes for handling textual entities
    • G06F40/14—Tree-structured documents
    • G06F40/143—Markup, e.g. Standard Generalized Markup Language [SGML] or Document Type Definition [DTD]
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
    • G06F16/20—Information retrieval; Database structures therefor; File system structures therefor of structured data, e.g. relational data
    • G06F16/25—Integrating or interfacing systems involving database management systems
    • G06F16/258—Data format conversion from or to a database
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F40/00—Handling natural language data
    • G06F40/10—Text processing
    • G06F40/103—Formatting, i.e. changing of presentation of documents
    • G06F40/117—Tagging; Marking up; Designating a block; Setting of attributes
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F40/00—Handling natural language data
    • G06F40/10—Text processing
    • G06F40/12—Use of codes for handling textual entities
    • G06F40/151—Transformation
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F40/00—Handling natural language data
    • G06F40/10—Text processing
    • G06F40/12—Use of codes for handling textual entities
    • G06F40/151—Transformation
    • G06F40/154—Tree transformation for tree-structured or markup documents, e.g. XSLT, XSL-FO or stylesheets
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F40/00—Handling natural language data
    • G06F40/20—Natural language analysis
    • G06F40/205—Parsing
    • G06F40/221—Parsing markup language streams

Landscapes

  • Engineering & Computer Science (AREA)
  • Theoretical Computer Science (AREA)
  • Physics & Mathematics (AREA)
  • General Engineering & Computer Science (AREA)
  • General Physics & Mathematics (AREA)
  • Audiology, Speech & Language Pathology (AREA)
  • Computational Linguistics (AREA)
  • General Health & Medical Sciences (AREA)
  • Health & Medical Sciences (AREA)
  • Artificial Intelligence (AREA)
  • Databases & Information Systems (AREA)
  • Data Mining & Analysis (AREA)
  • Multimedia (AREA)
  • Document Processing Apparatus (AREA)

Abstract

본 발명의 일 실시예에 따른 매핑정보를 이용한 SVG 포맷의 편집 방법은 제1 포맷의 태그를 기저장된 태그매핑정보에 대입시켜서 상기 제1 포맷의 태그들에 대응되는 제2 포맷의 태그들을 생성하는 단계; 상기 생성된 제2 포맷의 태그들이 수정된 경우, 상기 수정된 제2 포맷의 태그들을 추출하는 단계; 상기 수정된 제2 포맷의 태그들을 통해 웹 페이지상에서 표현된 객체들에 대한 좌표정보들을 추출하고, 상기 추출된 좌표정보들에 기반하여 상기 제1 포맷의 객체들에 대한 지역좌표정보들을 생성하는 단계; 및 상기 생성된 지역좌표정보들에 기반하여, 상기 제1 포맷의 태그들을 통해 표현된 객체들에 대해 기저장된 지역좌표정보들을 갱신하는 단계를 포함한다.

Description

SVG 포맷의 편집 방법, 시스템 및 컴퓨터 판독 가능한 기록매체 {METHOD, SYSTEM AND COMPUTER-READABLE RECORDING MEDIUM FOR EDITING SVG FORMAT}
본 발명은 SVG(Scalable Vector Graphics) 포맷의 편집 방법, 시스템 및 컴퓨터 판독 가능한 기록매체 에 관한 것으로, HTML 포맷의 태그를 통해 SVG 포맷의 태그를 편집하는 매핑정보들을 이용한, SVG 포맷의 편집 방법, 시스템 및 컴퓨터 판독 가능한 기록매체에 관한 것이다.
스케일러블 벡터 그래픽스(Scalable Vector Graphics, SVC)는 2차원 벡터 그래픽을 표현하기 위한 XML 기반의 파일 형식으로, 1999년 W3C(World Wide Web Consortium)의 주도하에 개발된 오픈 표준의 벡터 그래픽 파일 형식이다.
SVG 포맷은 행간, 단락, 정렬 등을 지원하지 않기 때문에, 페이지상에서 SVG 포맷을 편집할 경우에는 Text로 이루어진 컨텐츠를 편집할 때 한계가 존재한다.
또한, SVG는 레이아웃이 없고, 절대좌표를 통한 배치방식의 편집만을 지원하기 때문에, 줄바꿈 등 편집으로 인한 변경처리가 불가능한 단점이 있다.
종래에는 SVG 포맷의 이미지 워핑 방법이 개시되었다. 이미지를 구성하는 각 구성요소의 좌표계를 수정하고, 형상이 정해져 있는 구성요소를 복수의 점으로 구성되는 구성요소로 재구성한 후 워핑하는 방법을 제공한다.
사각형, 원, 타원 등 워핑 변환에서 형상 변환이 적용되기 힘든 구성요소까지 워핑 변환할 수 있지만, 텍스트 편집의 한계를 극복하지 못한 문제점이 있다.
KR 10-755206 B1
본 발명은 웹 페이지상에서 표현되는 HTML 포맷의 좌표정보를 SVG 포맷의 지역좌표정보로 변환하고, 변환된 지역좌표정보를 SVG 포맷에 적용함으로써 SVG 포맷을 편집하는, SVG 포맷의 편집 방법, 시스템 및 컴퓨터 판독 가능한 기록매체 에 관한 것이다.
본 발명의 일 실시예에 따른 SVG 포맷의 편집 방법은 제1 포맷의 태그를 기저장된 태그매핑정보에 대입시켜서 상기 제1 포맷의 태그들에 대응되는 제2 포맷의 태그들을 생성하는 단계; 상기 생성된 제2 포맷의 태그들이 수정된 경우, 상기 수정된 제2 포맷의 태그들을 추출하는 단계; 웹 페이지상에서, 상기 수정된 제2 포맷의 태그들을 통해 표현된 객체들에 대한 좌표정보들을 추출하고, 상기 추출된 좌표정보들에 기반하여 상기 제1 포맷의 태그들을 통해 표현된 객체들에 대한 지역좌표정보들을 생성하는 단계; 및 상기 생성된 지역좌표정보들에 기반하여, 상기 제1 포맷의 태그들을 통해 표현된 객체들에 대해 기저장된 지역좌표정보들을 갱신하는 단계를 포함할 수 있다.
상기 제2 포맷의 태그들을 생성하는 단계는, 상기 제1 포맷의 태그들에 포함된 문구들을 파싱하는 단계; 및 상기 파싱된 문구들을 상기 기저장된 태그매핑정보에 대입시켜서, 상기 제2 포맷의 태그들을 생성하는 단계를 포함할 수 있다.
상기 제2 포맷의 태그들을 생성하는 단계 이후, 상기 생성된 제2 포맷의 태그들을 사용자에게 제공되지 않는 임시 영역에서 렌더링하는 단계를 더 포함할 수 있다.
상기 지역좌표정보들을 생성하는 단계는, 상기 추출된 좌표정보들을 기저장된 좌표매핑정보에 대입시켜서, 상기 제1 포맷의 태그들을 통해 표현된 객체들에 대한 지역좌표정보들을 생성하는 단계를 포함할 수 있다.
상기 기저장된 지역좌표정보들을 편집하는 단계는, 상기 기저장된 지역좌표정보들을 상기 생성된 지역좌표정보들로 갱신시킴으로써, 상기 웹 페이지상에서, 상기 제1 포맷의 태그들을 통해 표현된 객체들의 위치가 상기 수정된 제2 포맷의 태그들을 통해 표현된 객체들의 위치에 대응되도록 상기 기저장된 지역좌표정보들을 갱신하는 단계를 포함할 수 있다.
상기 제1 포맷은 SVG 포맷을 포함하고, 상기 제2 포맷은 HTML 포맷을 포함할 수 있다.
상기 기저장된 태그매핑정보는, 상기 제1 포맷의 태그들 및 제2 포맷의 태그들 간의 변환정보를 포함할 수 있다.
상기 기저장된 좌표매핑정보는, 상기 웹 페이지상에서, 상기 제1 포맷의 태그들을 통해 표현된 객체들에 대한 지역좌표정보들 및 제2 포맷의 태그들을 통해 표현된 객체들에 대한 좌표정보들 간의 변환정보를 포함할 수 있다.
상기 기저장된 지역좌표정보들은, 상기 제2 포맷의 태그들이 수정되기 전, 웹 페이지상에서 상기 제1 포맷의 태그들에 의해 표현된 객체들에 대한 지역좌표정보들이다.
본 발명의 일 실시예에 따른 SVG 편집 시스템은, 제1 포맷의 태그를 기저장된 태그매핑정보에 대입시켜서 상기 제1 포맷의 태그들에 대응되는 제2 포맷의 태그들을 생성하고, 상기 생성된 제2 포맷의 태그들이 수정된 경우, 상기 수정된 제2 포맷의 태그들을 추출하고, 상기 수정된 제2 포맷의 태그들을 통해 웹 페이지상에서 표현된 객체들에 대한 좌표정보들을 추출하고, 상기 추출된 좌표정보들에 기반하여, 상기 제1 포맷의 태그들을 통해 표현된 객체들에 대한 지역좌표정보들을 생성하고, 상기 생성된 지역좌표정보들에 기반하여, 상기 제1 포맷의 태그들을 통해 표현된 객체들에 대해 기저장된 지역좌표정보들을 갱신하는 편집부를 포함할 수 있다.
상기 편집부는, 상기 제1 포맷의 태그들에 포함된 문구들을 파싱하고, 상기 파싱된 문구들을 상기 기저장된 태그매핑정보에 대입시켜서, 상기 제2 포맷의 태그들을 생성할 수 있다.
상기 편집부는, 상기 생성된 제2 포맷의 태그들을 사용자에게 제공되지 않는 임시 영역에서 렌더링할 수 있다.
상기 편집부는, 상기 추출된 좌표정보들을 기저장된 좌표매핑정보들에 대입시켜서, 상기 웹 페이지상에서, 상기 제1 포맷의 태그들을 통해 표현된 객체들에 대한 지역좌표정보들을 생성할 수 있다.
상기 편집부는, 상기 기저장된 지역좌표정보들을 상기 생성된 지역좌표정보들로 갱신시킴으로써, 상기 웹 페이지상에서, 상기 제1 포맷의 태그들을 통해 표현된 객체들의 위치가 상기 수정된 제2 포맷의 태그들을 통해 표현된 객체들의 위치에 대응되도록 상기 기저장된 지역좌표정보들을 갱신할 수 있다.
상기 제1 포맷은 SVG 포맷을 포함하고, 상기 제2 포맷은 HTML 포맷을 포함할 수 있다.
상기 기저장된 태그매핑정보는, 상기 제1 포맷의 태그들 및 제2 포맷의 태그들 간의 변환 정보를 포함할 수 있다.
상기 기저장된 좌표매핑정보는, 상기 웹 페이지상에서, 상기 제1 포맷의 태그들을 통해 표현된 객체들에 대한 지역좌표정보들 및 상기 제2 포맷의 태그들을 통해 표현된 객체들에 대한 좌표정보들 간의 변환 정보를 포함할 수 있다.
상기 기저장된 지역좌표정보들은, 상기 제2 포맷의 태그들이 수정되기 전, 상기 웹 페이지상에서 상기 제1 포맷의 태그들을 통해 상기 표현된 객체들에 대한 지역좌표정보들이다.
본 발명의 일 실시예에 따른 컴퓨터 판독 가능한 기록매체는, 컴퓨터를 이용하여 본 발명의 일 실시예에 따른 SVG 편집 방법을 실행시키기 위한 프로그램을 기록한 컴퓨터 판독 가능한 기록매체를 포함할 수 있다.
본 발명의 일 실시예에 따르면, HTML 포맷의 편집을 통하여, SVG 포맷을 편집할 수 있는 효과가 있다.
또한, 웹 페이지상에서 HTML 포맷의 편집을 통해, SVG 포맷의 편집에서는 불가능한 줄 바꿈, 단락, 행간 등 텍스트와 관련된 편집을 수행할 수 있는 효과가 있다.
본 발명에 관한 이해를 돕기 위해 상세한 설명의 일부로 포함되는, 첨부 도면은 본 발명에 대한 실시예를 제공하고, 상세한 설명과 함께 본 발명의 기술적 특징을 설명한다.
도 1은 본 발명의 일 실시예에 따른 SVG 포맷의 편집 방법의 순서도를 간략히 도시한 도면이다.
도 2는 본 발명의 일 실시예에 따른 SVG 포맷의 편집 시스템의 구성도를 간략히 도시한 도면이다.
도 3은 본 발명의 일 실시예에 따른 SVG 포맷의 편집 시스템, 방법 및 컴퓨터 판독가능한 기록매체에 있어서, SVG 포맷의 편집 과정의 예시를 도시한 도면이다.
본 명세서에서 제1 및/또는 제2 등의 용어는 하나의 구성요소를 다른 구성요소로부터 구별하는 목적으로만 사용된다. 즉, 구성요소들을 상기 용어들에 의해 한정하고자 함이 아니다.
본 명세서에서 '포함하다' 라는 표현으로 언급되는 구성요소, 특징, 및 단계는 해당 구성요소, 특징 및 단계가 존재함을 의미하며, 하나 이상의 다른 구성요소, 특징, 단계 및 이와 동등한 것을 배제하고자 함이 아니다.
본 명세서에서 단수형으로 특정되어 언급되지 아니하는 한, 복수의 형태를 포함한다. 즉, 본 명세서에서 언급된 구성요소 등은 하나 이상의 다른 구성요소 등의 존재나 추가를 의미할 수 있다.
다르게 정의되지 않는 한, 기술적이거나 과학적인 용어를 포함하여, 본 명세서에서 사용되는 모든 용어들은 본 발명이 속하는 기술분야에서 통상의 지식을 가진 자(통상의 기술자)에 의하여 일반적으로 이해되는 것과 동일한 의미이다.
즉, 일반적으로 사용되는 사전에 정의되어 있는 것과 같은 용어들은 관련 기술의 문맥상 가지는 의미와 일치하는 의미인 것으로 해석되어야 하며, 본 명세서에서 명백하게 정의하지 않는 한, 이상적이거나 과도하게 형식적인 의미로 해석되지 않는다.
이하에서는, 첨부된 도면을 참조하여 본 발명의 실시예에 따른 SVG 포맷의 편집 방법, 시스템 및 컴퓨터 판독 가능한 기록매체에 대해 상세하게 설명한다.
도 1은 본 발명의 일 실시예에 따른 SVG 포맷의 편집 방법의 순서도를 간략히 도시한 도면이다.
도 1을 참조하면, 본 발명의 일 실시예에 따른 매핑정보를 이용한 SVG 포맷의 편집 방법은 제2 포맷의 태그들을 생성하는 단계(S101), 렌더링하는 단계(S103), 수정된 제2 포맷의 태그들을 추출하는 단계(S105), 지역좌표정보들을 생성하는 단계(S107) 및 편집하는 단계(S109)를 포함할 수 있다.
제2 포맷의 태그들을 생성하는 단계(S101)는 제1 포맷의 태그들 및 제2 포맷의 태그들 간의 기저장된 태그매핑정보에 기반하여, 제1 포맷의 태그들에 대응되는 제2 포맷의 태그들을 생성하는 단계이다.
기저장된 태그매핑정보란 제1 포맷의 태그들 및 제2 포맷의 태그들 간의 변환 정보이다. 예컨대, 제1 포맷의 태그인 A_SVC를 기저장된 매핑정보에 대입시킴으로써 A_SVC에 대응되는 제2 포맷의 태그인 A_HTML 태그를 생성할 수 있다.
제1 포맷은 스케일러블 벡터 그래픽스(Scalable Vector Graphics, SVC) 포맷을 포함하며, 제2 포맷은 HTML(Hypertext Markup Language) 포맷을 포함할 수 있다.
여기서, 스케일러블 벡터 그래픽스(Scalable Vector Graphics, SVG)는 확장성 마크업 언어(XML)에 기반하여, 2차원 벡터 그래픽을 표현하기 위한 그래픽 포맷이다. SVG 표준은 SVG의 특징, 문법과 표시 효과를 정의하며, 모듈화의 XML 이름 공간(namespace)과 문서 객체 모델(Document Object Object Model, DOM)을 포함한다.
SVG는 하이퍼링크(hyperlink) 기능을 제공할 뿐만 아니라, 스크립트 언어를 지원한다.
따라서, Script 프로그래밍을 통해 SVG 문서 객체 모델의 엘리먼트와 속성에 액세스함으로써, 특정 이벤트에 응답할 수 있으므로, SVG의 다이나믹 및 인터랙션 성능을 향상시킬 수 있다.
제1 포맷의 태그들에 포함된 문구들을 파싱하고, 파싱된 제1 포맷의 태그들에 포함된 문구들을 기저장된 태그매핑정보에 대입시켜서, 제1 포맷의 태그들에 대응되는 제2 포맷의 태그들을 생성할 수 있다.
스케일러블 벡터 그래픽스(Scalable Vector Graphics, SVG)가 확장성 마크업 언어(XML)에 기반한 것이므로, 스케일러블 벡터 그래픽스 파일을 파싱할 시, 문서 구조에 기반한 XML 파싱기(Document Object Model, DOM), 이벤트에 기반한 XML 파싱기(Simple API for XML, SAX) 또는 “pull” 모드에 기반한 XML 파싱기(XML Pull Parser,XPP) 등을 채용하여 파싱할 수 있다.
제2 포맷의 태그들을 생성하는 단계(S101)에서, 제1 포맷의 태그들에서 의미론적인 단락들이 추론되어, 각 단락별로 제1 포맷의 태그들이 파싱될 수 있다.
또한, 단락들 각각이 기저장된 태그매핑정보에 대입됨으로써, 제1 포맷의 태그들에 대응되는 제2 포맷의 태그들이 생성될 수 있다.
렌더링하는 단계(S103)는 생성된 제2 포맷의 태그들을 렌더링(rendering)하는 단계이다.
렌더링이란 요청받은 내용을 페이지 화면에 표시하는 것으로서, 렌더링 엔진은 기본적으로 HTML 문서, XML 문서 및 이미지를 표시할 수 있고, 페이지 확장 기능을 이용하여 PDF와 같은 유형도 표시할 수 있다.
예컨대, 렌더링 과정은 DOM 트리 구축을 위한 HTML 파싱, 렌더 트리 구축, 렌더 트리 배치 및 렌더 트리 그리기의 과정을 거칠 수 있다.
제2 포맷의 태그들의 내용은 사용자에게 보이지 않는 임시 영역에서 렌더링 되고, 사용자가 웹 페이지상에서 제2 포맷의 태그들을 통해 표현된 객체들을 수정하는 동안, 임시 영역에서 제2 포맷의 태그들이 수정될 수 있다.
수정된 제2 포맷의 태그들을 추출하는 단계(S105)는 생성된 제2 포맷의 태그들이 수정된 경우, 상기 수정된 제2 포맷의 태그들에서 수정된 태그들을 추출하는 단계이다.
지역좌표정보들을 생성하는 단계(S107)는 웹 페이지상에서 수정된 제2 포맷의 태그들을 통해 표현된 객체들의 좌표정보들을 추출하고, 추출된 좌표정보들에 기반하여 제1 포맷에 대응되는 지역좌표정보들을 생성하는 단계이다.
즉, 수정된 제2 포맷의 태그를 통해 웹 페이지상에서 표현된 객체들에 대한 좌표정보들이 추출되고, 추출된 좌표정보들이 기저장된 좌표매핑정보에 대입됨으로써, 웹 페이지상에서 제1 포맷의 태그들을 통해 표현된 객체들에 대한 지역좌표정보들이 생성될 수 있다.
예컨대, HTML 포맷에서 (0,0)좌표에 있었던 A단어를 (10,10)좌표로 이동시킨 경우, 수정된 HTML 포맷에서 A단어의 좌표정보는 (10,10)일 수 있다. A단어에 대한 좌표정보가 기저장된 SVG-HTML 좌표매핑정보에 대입됨으로써, HTML 포맷에서 (10,10)에 해당하는 좌표정보에 대응되는 SVG 포맷의 지역좌표정보가 생성될 수 있다.
SVG 1.1 이하의 버전에는 절대좌표를 통한 배치방식만 지원하기 때문에 텍스트의 행간, 단락 및 정렬 등의 편집을 지원하지 않지만, HTML 포맷을 통해 SVG 포맷을 편집함으로써 텍스트의 행간, 단락 및 정렬 등의 편집이 수행될 수 있다.
편집하는 단계(S109)는 생성된 지역좌표정보들에 기반하여, 상기 제1 포맷의 태그들을 통해 표현된 객체들에 대해 기저장된 지역좌표정보들을 편집하는 단계이다.
기저장된 지역좌표정보들을 생성된 지역좌표정보들로 갱신시킴으로써, 웹 페이지상에서 제1 포맷의 태그들을 통해 표현된 객체들의 위치가 수정된 제2 포맷의 태그들을 통해 표현된 객체들의 위치와 대응되도록 표현될 수 있다.
예컨대, HTML 포맷에서 A단어의 좌표정보를 (10,10)으로 수정한 경우, HTML 포맷의 (10,10) 좌표정보에 대응되는 SVG 포맷의 지역좌표정보가 생성될 수 있다. SVG 포맷에 기저장된 A단어의 지역좌표정보를 생성된 SVG 포맷의 지역좌표정보로 갱신시킴으로써, 웹 페이지상에서 SVG 포맷의 A단어가 HTML 포맷의 A단어와 동일한 위치에 표현될 수 있다.
웹 페이지는 HTML 외에 SVG 렌더링을 제공하고 있으며, 텍스트의 글꼴, 크기 등 스타일 속성이 동일한 경우, HTML 포맷의 태그와 SVG 포맷의 태그 간에 거의 흡사한 렌더링 결과를 제공하기 때문에, HTML 포맷의 태그들에 대한 수정사항들에 기반하여 SVG 포맷의 태그들을 변경시킬 수 있다.
위와 같은 일련의 단계들을 거침으로써, 웹 페이지상에서 렌더링된 HTML 포맷에 대한 편집 결과에 상응하는 텍스트 레이아웃이 적용된 SVG DOM Tree를 구성함으로써, SVG 포맷의 태그들이 갱신될 수 있다.
도 2는 본 발명의 일 실시예에 따른 SVG 포맷의 편집 시스템의 구성도를 간략히 도시한 도면이다.
도 2를 참조하면, SVG 포맷의 편집 시스템(100)은 매핑정보 저장부(101), 편집부(103) 및 입력부(105)를 포함할 수 있다.
매핑정보 저장부(101)에는 태그매핑정보들 및 좌표매핑정보들이 포함될 수 있다.
태그매핑정보들은 제1 포맷의 태그 및 제2 포맷의 태그 간의 변환정보들 이다.
좌표매핑정보들은 웹 페이지상에서 제1 포맷의 태그들을 통해 표현된 객체들에 대한 지역좌표정보들과 제2 포맷의 태그들을 통해 표현된 객체들에 대한 좌표정보들 간의 변환정보들이다.
예컨대, 태그매핑정보들에는 SVG 포맷의 태그들 각각에 대해 대응되는 HTML 포맷의 태그들에 대한 변환정보들이 포함될 수 있다.
또한, 좌표매핑정보들에는 SVG 포맷의 태그들을 통해 웹 페이지상에서 표현된 객체들에 대한 지역좌표정보들과 HTML의 태그들을 통해 표현된 객체들에 대한 좌표정보들 간의 변환정보들이 포함될 수 있다.
편집부(103)는 제1 포맷의 태그들을 기저장된 태그매핑정보에 대입시켜서 제1 포맷의 태그들에 대응되는 제2 포맷의 태그들을 생성할 수 있다.
예컨대, 편집부(103)는 A_SVG라는 SVG 포맷의 태그를 기저장된 태그매핑정보들에 대입함으로써, A_HTML이라는 HTML 포맷의 태그를 생성할 수 있다.
즉, 편집부(103)는 제1 포맷의 태그들에 포함된 문구들을 파싱하고, 파싱된 문구들을 기저장된 태그매핑정보에 대입시킴으로써 제2 포맷의 태그들을 생성할 수 있다.
생성된 제2 포맷의 태그들은 사용자에게 보이지 않는 임시 영역에서 렌더링 되고, 사용자가 웹 페이지상에서 제2 포맷의 태그들을 통해 표현된 객체들을 수정하는 동안, 임시 영역에서 제2 포맷의 태그들이 수정될 수 있다.
사용자가 입력부(105)를 통해 제2 포맷의 태그들을 수정한 경우, 편집부(103)는 수정된 제2 포맷의 태그들을 추출할 수 있다.
또한, 편집부(103)는 웹 페이지상에서 수정된 제2 포맷의 태그들을 통해 표현된 객체들에 대한 좌표정보들을 추출할 수 있다.
예컨대, 편집부(103)는 웹 페이지상에서 수정된 HTML 포맷의 태그들을 통해 표현된 객체들에 대한 좌표정보들을 추출하고, 추출한 좌표정보들을 기저장된 좌표매핑정보에 대입시킴으로써, SVG 포맷의 태그들을 통해 웹 페이지상에서 표현된 객체들에 대한 지역좌표정보들을 생성할 수 있다.
편집부(103)는 제1 포맷의 태그들을 통해 표현된 객체들에 기저장된 지역좌표정보들을 생성된 지역좌표정보들로 갱신시킴으로써, 제1 포맷의 태그들을 통해 표현된 객체들에 대해 기저장된 지역좌표정보들을 편집할 수 있다.
편집부(103)는 제1 포맷에 태그들을 통해 표현된 객체들에 대해 기저장된 지역좌표정보들을 생성된 지역좌표정보들로 갱신시킴으로써, 제1 포맷의 태그들을 통해 웹 페이지상에서 표현된 객체들의 위치가 수정된 제2 포맷의 태그들을 통해 표현된 객체들의 위치와 대응되도록 표현할 수 있다.
예컨대, 편집부(103)는 HTML 포맷의 태그들에 의해 표현된 객체에 대한 좌표정보들을 기저장된 좌표매핑정보에 대입시켜 SVG 포맷의 태그들에 의해 표현된 객체에 대한 지역좌표정보들을 생성할 수 있다.
그리고나서, 생성한 지역좌표정보들을 통해 SVG 포맷의 태그들을 통해 표현된 객체들에 대해 기저장된 지역좌표정보들을 갱신시킴으로써, 웹 페이지상에서 SVG 포맷의 태그들을 통해 표현된 객체들의 위치를 변경시킬 수 있다.
입력부(105)는 사용자가 웹 페이지상에서 수정한 제2 포맷의 태그를 입력받을 수 있다.
즉, 사용자는 편집부(103)에 의하여 제2 포맷의 태그가 임시 영역에서 렌더링되면, 입력부(105)를 통해 제2 포맷의 태그들을 통해 표현된 객체에 대한 지역좌표들을 수정할 수 있다.
사용자의 입력이 진행되는 과정에서, 편집부(103)는 사용자에 의해 수정된 제2 포맷의 태그들을 추출하고, 추출된 제2 포맷의 태그들을 기저장된 태그매핑정보에 대입시킴으로써 제1 포맷의 태그들에 대응되는 태그들을 생성할 수 있다.
또한, 편집부(103)는 웹 페이지상에서 제2 포맷의 태그들을 통해 표현된 객체에 대한 좌표정보들을 기저장된 좌표매핑정보에 대입시킴으로써, 제1 포맷의 태그들을 통해 표현된 객체에 대한 지역좌표정보들을 생성할 수 있다.
도 3은 본 발명의 일 실시예에 따른 SVG 포맷의 편집 시스템, 방법 및 컴퓨터 판독가능한 기록매체에 있어서, SVG 포맷의 편집 과정의 예시를 도시한 도면이다.
구체적으로, 도 3a는 SVG 포맷의 태그에 대한 개념모델, 도 3b는 SVG 포맷의 태그에 대응되는 HTML 포맷의 태그, 도 3c는 HTML 포맷의 편집된 태그 및 HTML 포맷이 렌더링된 임시 영역, 도 4d는 수정된 HTML 포맷의 태그에 기반하여 편집된 SVG 포맷을 도시한 도면이다.
도 3a를 참조하면, SVG 포맷은 태그의 x 및 y 속성에 따라 행과 단락으로 구분될 수 있다.
예컨대, y는 행 높이에 해당하며, 제1 y(303)가 20일 때 제1 단락(307)에 새로운 행이 추가될 수 있다.
또한, 제2 y(303)의 값은 20으로, 제2 y(303)의 값은 제1 y(301)의 값에 비해 20만큼 증가한 것이므로, 새로운 행이 추가될 수 있다.
제3 y(305)의 값은 60으로, 제2 y(303)의 값에 비해 40만큼 증가한 것이므로, 제3 y(305)의 값은 행 높이인 20보다 크게 증가하여 제2 단락(309)이 추가될 수 있다.
도 3b를 참조하면, SVG 포맷의 태그를 기저장된 태그매핑정보에 대입함으로써, HTML 포맷의 태그가 생성될 수 있다.
제1 y(301)는 HTML 포맷의 태그에서 행을 나누는 <br/>(311)과 대응되고, 제3 y(305)는 HTML 포맷의 태그에서 단락을 나누는 <p>(313)과 대응된다.
도 3c를 참조하면, 사용자가 HTML 편집기(315)를 통해서 HTML 포맷의 태그를 수정하면, 임시 영역(317)에서 수정된 HTML 포맷의 태그들이 렌더링될 수 있다.
도 3d를 참조하면, 사용자가 수정한 HTML 포맷의 태그들에 기반하여 제2 단락(309)의 변경된 내용에 따라 SVG 포맷의 태그들이 편집될 수 있다.
HTML 포맷에서 변경된 “Paragraph”(319) 글자의 좌표정보에 대응되는 SVG 포맷의 지역좌표정보가 생성될 수 있다.
사용자의 편집에 의하여 제2 단락(309)의 “Paragraph”(319)의 위치가 제2 단락(309)에서 제2 행으로 변경되었으므로, SVG 포맷에서 제4 y(321)는 80으로 설정되어, 새로운 행이 추가될 수 있다.
“Paragraph”(319)는 추가된 새로운 행에 위치할 수 있다.
본 명세서에서 설명된 실시예들에 관한 예시적인 모듈, 단계, 과정, 로직 블록, 수단, 단계 또는 이들의 조합은 전자 하드웨어(코딩 등에 의해 설계되는 디지털 설계), 소프트웨어(프로그램 명령을 포함하는 다양한 형태의 애플리케이션) 또는 이들의 조합에 의해 구현될 수 있다. 하드웨어 및/또는 소프트웨어 중 어떠한 형태로 구현되는지는 사용자 단말에 부여되는 설계상의 제약에 따라 달라질 수 있다. 또한, 본 명세서에서 설명된 기능들은 하드웨어, 소프트웨어, 펌웨어 또는 이들의 조합에 의해 실행될 수 있다. 소프트웨어에 의해 실행되는 경우, 그 기능은 하나 이상의 명령이나 코드로서 컴퓨터-판독가능 저장 매체에 저장되거나 이를 통해 전송될 수 있다. 컴퓨터-판독가능 저장 매체는 컴퓨터에 의해 액세스 가능한 임의의 이용가능한 매체를 총괄적으로 지칭한다.
비록 본 명세서에서의 설명은 예시적인 몇 가지 양상으로 나타났지만, 다양한 수정이나 변경이 후술되는 특허청구범위에 의해 정의되는 범주로부터 이루어질 수 있으며, 본 발명의 기술적인 보호범위는 다음의 특허청구범위에 의하여 정해져야 할 것이다.
100: SVG 포맷의 편집 시스템
101: 매핑정보 저장부
103: 편집부
105: 입력부
301: 제1 y
303: 제2 y
305: 제3 y
307: 제1 단락
309: 제2 단락
311: <br/>
313: <p>
315: HTML 포맷 편집기
317: 임시영역
319: “Paragraph”
321: 제4 y

Claims (19)

  1. 제1 포맷의 태그를 기저장된 태그매핑정보에 대입시켜서 상기 제1 포맷의 태그들에 대응되는 제2 포맷의 태그들을 생성하는 단계;
    상기 생성된 제2 포맷의 태그들이 수정된 경우, 상기 수정된 제2 포맷의 태그들을 추출하는 단계;
    웹 페이지상에서, 상기 수정된 제2 포맷의 태그들을 통해 표현된 객체들에 대한 좌표정보들을 추출하고, 상기 추출된 좌표정보들에 기반하여 상기 제1 포맷의 태그들을 통해 표현된 객체들에 대한 지역좌표정보들을 생성하는 단계; 및
    상기 생성된 지역좌표정보들에 기반하여, 상기 제1 포맷의 태그들을 통해 표현된 객체들에 대해 기저장된 지역좌표정보들을 갱신하는 단계를 포함하는,
    SVG 포맷의 편집 방법.
  2. 제1항에 있어서,
    상기 제2 포맷의 태그들을 생성하는 단계는,
    상기 제1 포맷의 태그들에 포함된 문구들을 파싱하는 단계; 및
    상기 파싱된 문구들을 상기 기저장된 태그매핑정보에 대입시켜서, 상기 제2 포맷의 태그들을 생성하는 단계를 포함하는,
    SVG 포맷의 편집 방법.
  3. 제1항에 있어서,
    상기 제2 포맷의 태그들을 생성하는 단계 이후,
    상기 생성된 제2 포맷의 태그들을 사용자에게 제공되지 않는 임시 영역에서 렌더링하는 단계를 더 포함하는,
    SVG 포맷의 편집 방법.
  4. 제1항에 있어서,
    상기 지역좌표정보들을 생성하는 단계는,
    상기 추출된 좌표정보들을 기저장된 좌표매핑정보에 대입시켜서, 상기 제1 포맷의 태그들을 통해 표현된 객체들에 대한 지역좌표정보들을 생성하는 단계를 포함하는,
    SVG 포맷의 편집 방법.
  5. 제4항에 있어서,
    상기 기저장된 지역좌표정보들을 편집하는 단계는,
    상기 기저장된 지역좌표정보들을 상기 생성된 지역좌표정보들로 갱신시킴으로써,
    상기 웹 페이지상에서, 상기 제1 포맷의 태그들을 통해 표현된 객체들의 위치가 상기 수정된 제2 포맷의 태그들을 통해 표현된 객체들의 위치에 대응되도록 상기 기저장된 지역좌표정보들을 갱신하는 단계를 포함하는,
    SVG 포맷의 편집 방법.
  6. 제1항에 있어서,
    상기 제1 포맷은 SVG 포맷을 포함하고,
    상기 제2 포맷은 HTML 포맷을 포함하는,
    SVG 포맷의 편집 방법.
  7. 제1항에 있어서,
    상기 기저장된 태그매핑정보는,
    상기 제1 포맷의 태그들 및 제2 포맷의 태그들 간의 변환정보를 포함하는,
    SVG 포맷의 편집 방법.
  8. 제1항에 있어서,
    상기 기저장된 좌표매핑정보는,
    상기 웹 페이지상에서, 상기 제1 포맷의 태그들을 통해 표현된 객체들에 대한 지역좌표정보들 및 제2 포맷의 태그들을 통해 표현된 객체들에 대한 좌표정보들 간의 변환정보를 포함하는,
    SVG 포맷의 편집 방법.
  9. 제5항에 있어서,
    상기 기저장된 지역좌표정보들은,
    상기 제2 포맷의 태그들이 수정되기 전, 웹 페이지상에서 상기 제1 포맷의 태그들에 의해 표현된 객체들에 대한 지역좌표정보들인,
    SVG 포맷의 편집 방법.
  10. 제1 포맷의 태그를 기저장된 태그매핑정보에 대입시켜서 상기 제1 포맷의 태그들에 대응되는 제2 포맷의 태그들을 생성하고,
    상기 생성된 제2 포맷의 태그들이 수정된 경우, 상기 수정된 제2 포맷의 태그들을 추출하고,
    상기 수정된 제2 포맷의 태그들을 통해 웹 페이지상에서 표현된 객체들에 대한 좌표정보들을 추출하고,
    상기 추출된 좌표정보들에 기반하여, 상기 제1 포맷의 태그들을 통해 표현된 객체들에 대한 지역좌표정보들을 생성하고,
    상기 생성된 지역좌표정보들에 기반하여, 상기 제1 포맷의 태그들을 통해 표현된 객체들에 대해 기저장된 지역좌표정보들을 갱신하는 편집부를 포함하는,
    SVG 포맷의 편집 시스템.
  11. 제10항에 있어서,
    상기 편집부는,
    상기 제1 포맷의 태그들에 포함된 문구들을 파싱하고,
    상기 파싱된 문구들을 상기 기저장된 태그매핑정보에 대입시켜서, 상기 제2 포맷의 태그들을 생성하는,
    SVG 포맷의 편집 시스템.
  12. 제10항에 있어서,
    상기 편집부는,
    상기 생성된 제2 포맷의 태그들을 사용자에게 제공되지 않는 임시 영역에서 렌더링하는,
    SVG 포맷의 편집 시스템.
  13. 제10항에 있어서,
    상기 편집부는,
    상기 추출된 좌표정보들을 기저장된 좌표매핑정보들에 대입시켜서, 상기 웹 페이지상에서, 상기 제1 포맷의 태그들을 통해 표현된 객체들에 대한 지역좌표정보들을 생성하는,
    SVG 포맷의 편집 시스템.
  14. 제13항에 있어서,
    상기 편집부는,
    상기 기저장된 지역좌표정보들을 상기 생성된 지역좌표정보들로 갱신시킴으로써,
    상기 웹 페이지상에서, 상기 제1 포맷의 태그들을 통해 표현된 객체들의 위치가 상기 수정된 제2 포맷의 태그들을 통해 표현된 객체들의 위치에 대응되도록 상기 기저장된 지역좌표정보들을 갱신하는,
    SVG 포맷의 편집 시스템.
  15. 제10항에 있어서,
    상기 제1 포맷은 SVG 포맷을 포함하고,
    상기 제2 포맷은 HTML 포맷을 포함하는,
    SVG 포맷의 편집 시스템.
  16. 제10항에 있어서,
    상기 기저장된 태그매핑정보는,
    상기 제1 포맷의 태그들 및 제2 포맷의 태그들 간의 변환 정보를 포함하는,
    SVG 포맷의 편집 시스템.
  17. 제10항에 있어서,
    상기 기저장된 좌표매핑정보는,
    상기 웹 페이지상에서, 상기 제1 포맷의 태그들을 통해 표현된 객체들에 대한 지역좌표정보들 및 상기 제2 포맷의 태그들을 통해 표현된 객체들에 대한 좌표정보들 간의 변환 정보를 포함하는,
    SVG 포맷의 편집 시스템.
  18. 제10항에 있어서,
    상기 기저장된 지역좌표정보들은,
    상기 제2 포맷의 태그들이 수정되기 전, 상기 웹 페이지상에서 상기 제1 포맷의 태그들을 통해 상기 표현된 객체들에 대한 지역좌표정보들인,
    SVG 포맷의 편집 시스템.
  19. 컴퓨터를 이용하여 제1항의 방법을 실행시키기 위한 프로그램을 기록한 컴퓨터 판독 가능한 기록매체.
KR1020170155567A 2017-11-21 2017-11-21 Svg 포맷의 편집 방법, 시스템 및 컴퓨터 판독 가능한 기록매체 KR20190058005A (ko)

Priority Applications (3)

Application Number Priority Date Filing Date Title
KR1020170155567A KR20190058005A (ko) 2017-11-21 2017-11-21 Svg 포맷의 편집 방법, 시스템 및 컴퓨터 판독 가능한 기록매체
US15/821,183 US20190155878A1 (en) 2017-11-21 2017-11-22 Method, system and computer-readable recording medium for editing svg format
JP2017226052A JP2019096138A (ja) 2017-11-21 2017-11-24 Ｓｖｇフォーマットの編集方法、システムおよびコンピュータ読み取り可能な記録媒体

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
KR1020170155567A KR20190058005A (ko) 2017-11-21 2017-11-21 Svg 포맷의 편집 방법, 시스템 및 컴퓨터 판독 가능한 기록매체

Publications (1)

Publication Number Publication Date
KR20190058005A true KR20190058005A (ko) 2019-05-29

Family

ID=66532389

Family Applications (1)

Application Number Title Priority Date Filing Date
KR1020170155567A KR20190058005A (ko) 2017-11-21 2017-11-21 Svg 포맷의 편집 방법, 시스템 및 컴퓨터 판독 가능한 기록매체

Country Status (3)

Country Link
US (1) US20190155878A1 (ko)
JP (1) JP2019096138A (ko)
KR (1) KR20190058005A (ko)

Family Cites Families (6)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US6336124B1 (en) * 1998-10-01 2002-01-01 Bcl Computers, Inc. Conversion data representing a document to other formats for manipulation and display
WO2005031498A2 (en) * 2003-10-01 2005-04-07 Vibrasoft Pte. Ltd. A method of updating a data source from transformed data
US20080134019A1 (en) * 2004-04-08 2008-06-05 Nobuaki Wake Processing Data And Documents That Use A Markup Language
JPWO2007132568A1 (ja) * 2006-05-15 2009-09-24 株式会社ジャストシステム データ処理サーバ及びデータ処理方法
CN104346322B (zh) * 2013-08-08 2018-07-10 北大方正集团有限公司 文档格式处理装置和文档格式处理方法
US10824588B2 (en) * 2017-05-05 2020-11-03 Servicenow, Inc. Remote document conversion and viewing systems and methods

Also Published As

Publication number Publication date
JP2019096138A (ja) 2019-06-20
US20190155878A1 (en) 2019-05-23

Similar Documents

Publication Publication Date Title
CN107451296B (zh) 一种基于组件的网站模块化渲染方法
US7721195B2 (en) RTF template and XSL/FO conversion: a new way to create computer reports
US11216253B2 (en) Application prototyping tool
US20120079374A1 (en) Rendering web page text in a non-native font
US20030037076A1 (en) Method, computer program and system for style sheet generation
US10049095B2 (en) In-context editing of output presentations via automatic pattern detection
KR20150079867A (ko) Html5-프로토콜 기반 웹페이지 표시 방법 및 장치
KR102119560B1 (ko) Svg 포맷을 이용한 폰트 편집 방법, 시스템 및 컴퓨터 판독 가능한 기록매체
CN105005472B (zh) 一种web上显示维吾尔文字的方法及装置
US7765472B2 (en) Method and device for editing SVG type digital graphical documents in particular from a browser
US20100037131A1 (en) System and method for designing and generating online stationery
US9727537B2 (en) Application of a system font mapping to a design
Neumann et al. Time for SVG—towards high quality interactive web-maps
KR101649822B1 (ko) 웹페이지 구축 장치 및 방법
US9594737B2 (en) Natural language-aided hypertext document authoring
KR20190058005A (ko) Svg 포맷의 편집 방법, 시스템 및 컴퓨터 판독 가능한 기록매체
KR101905300B1 (ko) 외곽선 폰트를 이용하여 metafont에 의한 폰트를 생성하는 장치 및 방법
Dengler et al. Scalable vector graphics (SVG) 1.1
Pavazza et al. The alternative way of creating infographics using SVG technology
CN112068826A (zh) 文本输入的控制方法、系统、电子设备和存储介质
US20210397663A1 (en) Data reduction in a tree data structure for a wireframe
Francisco et al. Structured Approach to Web Development
Guillen et al. GARP: a tool for creating dynamic Web reports using XSL and XML technologies
Lin et al. Active document versioning: from layout understanding to adjustment
Giannetti FOA: an XSL-FO Authoring Tool