KR101494806B1 - System for handling rich text image and method therefor - Google Patents

System for handling rich text image and method therefor Download PDF

Info

Publication number
KR101494806B1
KR101494806B1 KR20130090944A KR20130090944A KR101494806B1 KR 101494806 B1 KR101494806 B1 KR 101494806B1 KR 20130090944 A KR20130090944 A KR 20130090944A KR 20130090944 A KR20130090944 A KR 20130090944A KR 101494806 B1 KR101494806 B1 KR 101494806B1
Authority
KR
South Korea
Prior art keywords
text
editing server
client
style
box
Prior art date
Application number
KR20130090944A
Other languages
Korean (ko)
Other versions
KR20150015201A (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 KR20130090944A priority Critical patent/KR101494806B1/en
Publication of KR20150015201A publication Critical patent/KR20150015201A/en
Application granted granted Critical
Publication of KR101494806B1 publication Critical patent/KR101494806B1/en

Links

Images

Classifications

    • GPHYSICS
    • G06COMPUTING; CALCULATING; COUNTING
    • G06TIMAGE DATA PROCESSING OR GENERATION, IN GENERAL
    • G06T11/002D [Two Dimensional] image generation
    • G06T11/60Editing figures and text; Combining figures or text

Abstract

본 발명은 Rich Text 이미지 처리 시스템 및 그 방법에 관한 것으로서, 사용자의 조작에 따른 키 입력을 통해 입력받은 텍스트를 배치할 텍스트 상자의 크기정보, 입력할 텍스트 및 텍스트 상자에 삽입될 텍스트의 스타일정보를 정보통신망을 통해 텍스트 편집서버(200)로 전송하고, 텍스트 편집서버(200)로부터 크기정보, 텍스트 및 스타일정보에 부합하도록 생성된 벡터 이미지를 수신하여 디스플레이하는 클라이언트(100); 및 스타일정보에 포함된 폰트, 크기, 스타일, 색상, 자간 및 장평 각각을 개별적으로 텍스트 구간별 스타일을 적용한 텍스트를, 텍스트 박스의 좌측 중간 좌표, 중간 상단 좌표 및 우측 하단 좌표를 잇는 텍스트 패스와 대응하도록 벡터 이미지로 생성하여 클라이언트(100)로 전송하는 텍스트 편집서버(200);를 포함한다.
상기와 같은 본 발명에 따르면, 텍스트 편집서버에서 문자열을 쓰는 방향을 지정하는 기하학적 속성을 좌우상하 방향의 값으로 변환하는 텍스트 패스(text path) 기능을 제공함으로써, 커브 또는 호에 따라 텍스트 배치가 가능하며, 자동 줄바꿈 기능을 제공함으로써, 텍스트 상자의 폭이 작은 경우에도 자동으로 텍스트 상자의 크기를 세로로 늘려 입력된 텍스트 상자 크기에 국한되어 잘리는 것을 미연에 방지하는 효과가 있다.
The present invention relates to a rich text image processing system and method thereof, and more particularly, to a rich text image processing system and a method thereof, which are capable of storing size information of a text box, A client 100 for receiving and displaying a vector image generated by the text editing server 200 in accordance with size information, text, and style information, and transmitting the vector image to the text editing server 200 through an information communication network; And a text path to which a style pertaining to a text section is applied individually to each of the font, size, style, color, crossing, and longpath included in the style information and a text path connecting the left middle coordinate, the middle upper coordinate and the lower right coordinate of the text box And transmits the generated vector image to the client 100. The text editing server 200 generates a vector image to be transmitted to the client 100.
According to the present invention, it is possible to arrange texts according to curves or arcs by providing a text path function for converting a geometric attribute designating a direction of writing a character string in the text editing server into values in the left and right direction By providing the automatic line-wrapping function, even when the width of the text box is small, the size of the text box is automatically increased vertically to prevent the text box from being cut off.

Description

Rich Text 이미지 처리 시스템 및 그 방법{SYSTEM FOR HANDLING RICH TEXT IMAGE AND METHOD THEREFOR}FIELD OF THE INVENTION [0001] The present invention relates to a rich text image processing system,

본 발명은 Rich Text 이미지 처리 시스템 및 그 방법에 관한 것으로 더욱 상세하게는, 복수개의 서체정보들이 클라이언트에 구비되지 않아도, 클라이언트의 요청과 대응하는 텍스트를 서버로부터 이미지 또는 벡터이미지 형태로 수신하여 텍스트정보를 구현하는 기술에 관한 것이다.The present invention relates to a rich text image processing system and a method thereof, and more particularly, to a rich text image processing system and method thereof, And to a technique for implementing the same.

일반적으로, 클라이언트에 기 저장된 서체들은 비트맵 이미지 형태로 저장됨에 따라 텍스트 크기를 확대 또는 축소하는 경우, 해상도 제한이 있어 텍스트가 깨지는 현상이 발생하는 문제점이 있다.In general, fonts previously stored in a client are stored in a bitmap image format. When a text size is enlarged or reduced, there is a problem that a text is broken due to resolution limitation.

이러한 문제점을 개선하기 위해, 대한민국 등록특허 제10-2012-0076522호(주문형 출판을 제공하는 벡터이미지 기반의 텍스트 처리 시스템 및 그 방법)에는, 텍스트정보에 포함된 텍스트 속성과 대응하는 벡터 이미지파일을 생성하고, 배치 이미지파일을 웹서버에서 디스플레이가 가능하도록 파일형식을 변환하며, 편집정보와 대응하는 크기와 위치를 갖도록 벡터 이미지파일 및 변환된 배치 이미지파일을 편집하는 기술이 개시되어 있다.In order to solve such a problem, Korean Patent Registration No. 10-2012-0076522 (a vector image-based text processing system and method for providing on-demand publishing) includes a vector image file corresponding to text attributes included in text information Discloses a technique for editing a vector image file and a converted batch image file so as to convert a file format so that a batch image file can be displayed on a web server and have a size and position corresponding to editing information.

그러나, 선행특허는, 서버측에서 텍스트 박스에 대한 정보를 xml 형태로 제공함에 따라, 텍스트 박스에 입력된 모든 텍스트에 폰트, 크기, 색상, 자간 및 장평을 포함하는 스타일이 적용되는바, 텍스트박스에 텍스트 구간별 서로 다른 스타일을 적용하는 것이 불가능한 문제점이 있다.However, in the prior art, since the information on the text box in the server side is provided in the form of xml, the style including the font, size, color, character, and title is applied to all the text entered in the text box, There is a problem that it is impossible to apply different styles to each text section.

그리고, 직선형태의 텍스트 박스에 국한된 텍스트 배치만을 제공함에 따라 커브 또는 호 형태의 텍스트 배치가 불가능하고, 클라이언트에 기 정의된 텍스트박스 크기를 초과하는 텍스트가 입력되는 경우, 텍스트가 잘리게 되는 단점이 있다.In addition, it is impossible to arrange texts of curves or arcs by providing only a text arrangement limited to a rectilinear text box, and when a text exceeding the size of a text box defined in the client is input to the client, have.

본 발명의 목적은, 클라이언트가 입력하는 텍스트에 대한 폰트, 크기, 스타일, 색상, 자간 및 장평을 포함하는 스타일 정보를 개별적으로 지정한 Rich Text 기능을 제공함으로써, 텍스트 구간별 스타일 정보의 개별적 지정에 의해 복수의 스타일을 갖는 텍스트를 제공하는데 그 목적이 있다.It is an object of the present invention to provide a rich text function that individually specifies style information including font, size, style, color, character spacing, and length of a text input by a client, The object of the present invention is to provide a text having a plurality of styles.

또한, 본 발명의 목적은, 텍스트 편집서버에서 문자열을 쓰는 방향을 원이나 호를 따라 텍스를 쓰도록 하는 텍스트 패스(text path) 기능을 제공함으로써, 직선형태의 텍스트에 국한되지 않고, 커브 또는 호에 따라 텍스트 배치가 가능하도록 하는데 그 목적이 있다.It is also an object of the present invention to provide a text path function for allowing a text editing server to write a text along a circle or a circle in a direction of writing a character string, In order to allow text to be arranged according to the text.

그리고, 본 발명의 목적은, 자동 줄바꿈 기능을 제공함으로써, 텍스트 상자의 폭이 작은 경우에도 자동으로 텍스트 상자의 크기를 세로로 늘려 입력된 텍스트 상자 크기에 국한되어 잘리는 것을 미연에 방지하는데 그 목적이 있다.It is another object of the present invention to provide a text wrapping function that automatically extends the size of a text box vertically even when the width of the text box is small, .

이러한 기술적 과제를 달성하기 위한 본 발명의 Rich Text 이미지 처리 시스템은, 사용자의 조작에 따른 키 입력을 통해 입력받은 텍스트를 배치할 텍스트 상자의 크기정보, 입력할 텍스트 및 텍스트 상자에 삽입될 텍스트의 스타일정보를 정보통신망을 통해 텍스트 편집서버(200)로 전송하고, 텍스트 편집서버(200)로부터 크기정보, 텍스트 및 스타일정보에 부합하도록 생성된 벡터 이미지를 수신하여 디스플레이하는 클라이언트(100); 및 스타일정보에 포함된 폰트, 크기, 스타일, 색상, 자간 및 장평 각각을 개별적으로 복수개의 스타일을 적용한 텍스트를, 가로 및 세로형태의 직선형태나 전송된 텍스트 상자의 좌측하단, 중앙상단, 우측중간 세점을 잇는 텍스트패스에 따라 텍스트가 대응하도록 벡터 이미지로 생성하여 클라이언트(100)로 전송하는 텍스트 편집서버(200);를 포함한다.
According to an aspect of the present invention, there is provided a system for processing a rich text image, the apparatus comprising: a display unit for displaying a size of a text box in which a text input through a key input according to a user's operation is to be arranged, A client 100 that transmits information to the text editing server 200 through an information communication network and receives and displays a vector image generated from the text editing server 200 in accordance with size information, text, and style information; And texts to which a plurality of styles are applied individually in each of the fonts, sizes, styles, colors, keros, and longpaths included in the style information may be displayed in a straight line form in the horizontal and vertical forms, And a text editing server 200 for generating a vector image so that the text corresponds to the text path connecting the three points and transmitting the vector image to the client 100.

그리고, 전술한 시스템을 기반으로 하는 본 발명에 따른 Rich Text 이미지 처리 방법은, 클라이언트(100)가 입력받은 텍스트 상자의 크기정보, 입력할 텍스트 및 텍스트의 스타일정보를 텍스트 편집서버(200)로 전송하는 (a) 단계; 텍스트 편집서버(200)가 수신한 텍스트 구간별 폰트, 크기, 스타일, 색상, 자간 및 장평을 포함한 스타일을 적용한 텍스트를 생성하는 (b) 단계; 텍스트 편집서버(200)가 생성한 텍스트를 가로 및 세로형태의 직선형태나 전송된 텍스트 상자의 좌측하단, 중앙상단, 우측중간 세점을 잇는 텍스트패스에 따라 텍스트가 대응하도록 벡터 이미지로 생성하는 (c) 단계; 및 클라이언트(100)가 텍스트 편집서버(200)로부터 수신한 벡터 이미지를 디스플레이하는 (d) 단계;를 포함한다.The method for processing a Rich Text image according to the present invention based on the system described above transmits the size information of the text box input by the client 100, the text to be input and the style information of the text to the text editing server 200 (A); (B) generating a text to which a style including fonts, sizes, styles, colors, characters, and lengths per text section received by the text editing server 200 is applied; The text generated by the text editing server 200 is generated as a vector image such that the text corresponds to a straight line in the form of a horizontal and vertical line or a text path connecting the lower left, upper center, and right middle point of the transmitted text box (c ) step; And (d) displaying the vector image received by the client 100 from the text editing server 200. [

상기와 같은 본 발명에 따르면, 클라이언트가 입력하는 텍스트에 대한 폰트, 크기, 스타일, 색상, 자간 및 장평을 포함하는 스타일 정보를 텍스트 구간별로 지정한 Rich Text 기능을 제공함으로써, 스타일 정보의 구간별 지정에 의해 복수의 스타일을 갖는 텍스트를 제공하는 효과가 있다.According to the present invention, by providing the Rich Text function in which style information including a font, size, style, color, character spacing, and length of a text inputted by a client is specified for each text section, Thereby providing a text having a plurality of styles.

또한, 본 발명에 따르면, 텍스트 편집서버에서 문자열을 쓰는 방향을 지정하는 기하학적 속성을 가로, 세로외 방향외에 호나 원을 따라 쓰는 텍스트 패스(text path) 기능을 제공함으로써, 직선형태의 텍스트에 국한되지 않고, 커브 또는 호에 따라 텍스트 배치가 가능한 효과가 있다.Further, according to the present invention, by providing a text path function that writes a geometrical attribute specifying a writing direction of a character string in a text editing server along a call or a circle in addition to the horizontal and vertical outward directions, There is an effect that text can be arranged according to a curve or arc.

그리고, 본 발명에 따르면, 자동줄바꿈 기능을 제공함으로써, 텍스트 상자의 폭이 작은 경우에도 자동으로 텍스트 상자의 크기를 세로로 늘려 입력된 텍스트 상자 크기에 국한되어 잘리는 것을 미연에 방지하는 효과가 있다.According to the present invention, by providing the automatic line-wrapping function, even when the width of the text box is small, the size of the text box is automatically increased vertically to prevent the text box from being cut off by the size of the input text box .

도 1은 본 발명에 따른 Rich Text 이미지 처리 시스템을 도시한 구성도.
도 2는 본 발명에 따른 Rich Text 이미지 처리 시스템에 의해 텍스트에 다중 스타일을 지정하는 것을 도시한 예시도.
도 3은 본 발명에 따른 Rich Text 이미지 처리 시스템에 의해 커브 또는 호 형태의 스타일을 적용하는 것을 도시한 예시도.
도 4는 본 발명에 따른 Rich Text 이미지 처리 시스템에 의해 텍스트 넘침이 발생시 텍스트 박스를 늘여 텍스트를 배치하는 것을 도시한 예시도.
도 5는 본 발명에 따른 Rich Text 이미지 처리 방법을 도시한 순서도.
도 6은 본 발명에 따른 Rich Text 이미지 처리 방법의 제S10단계 이후 과정을 도시한 도면.
도 7은 본 발명에 따른 Rich Text 이미지 처리 방법의 제S10단계 이후 또 다른 과정을 도시한 도면.
1 is a block diagram showing a Rich Text image processing system according to the present invention;
2 is an exemplary diagram illustrating assigning multiple styles to text by a Rich Text image processing system according to the present invention;
3 is an exemplary diagram illustrating application of a curve or arc style style by a Rich Text image processing system in accordance with the present invention;
FIG. 4 is a diagram illustrating an example of arranging text by extending a text box when a text overflow occurs by the Rich Text image processing system according to the present invention. FIG.
5 is a flowchart showing a Rich Text image processing method according to the present invention.
6 is a diagram illustrating a process after step S10 of the method for processing a Rich Text image according to the present invention.
FIG. 7 illustrates another process after step S10 of the method of processing a Rich Text image according to the present invention. FIG.

본 발명의 구체적인 특징 및 이점들은 첨부도면에 의거한 다음의 상세한 설명으로 더욱 명백해질 것이다. 이에 앞서, 본 명세서 및 청구범위에 사용된 용어나 단어는 발명자가 그 자신의 발명을 가장 최선의 방법으로 설명하기 위해 용어의 개념을 적절하게 정의할 수 있다는 원칙에 입각하여 본 발명의 기술적 사상에 부합하는 의미와 개념으로 해석되어야 할 것이다. 또한, 본 발명에 관련된 공지 기능 및 그 구성에 대한 구체적인 설명이 본 발명의 요지를 불필요하게 흐릴 수 있다고 판단되는 경우에는, 그 구체적인 설명을 생략하였음에 유의해야 할 것이다.Specific features and advantages of the present invention will become more apparent from the following detailed description based on the accompanying drawings. Prior to this, terms and words used in the present specification and claims are to be interpreted in accordance with the technical idea of the present invention based on the principle that the inventor can properly define the concept of the term in order to explain his invention in the best way. It should be interpreted in terms of meaning and concept. It is to be noted that the detailed description of known functions and constructions related to the present invention is omitted when it is determined that the gist of the present invention may be unnecessarily blurred.

도 1에 도시된 바와 같이 본 발명에 따른 Rich Text 이미지 처리 시스템(S)은, 클라이언트(100) 및 편집서버(200)를 포함하여 구성된다.As shown in FIG. 1, the Rich Text image processing system S according to the present invention includes a client 100 and an editing server 200.

이하에서는 그 구체적인 언급을 생략하겠으나, 본 발명에 따른 클라이언트(100)는 PC 또는 모바일 기기로 구성되며, 텍스트 편집서버(200)는 클라이언트(100)의 요청과 대응하는 스타일이 반영된 텍스트를 포함하는 벡터 이미지를 xml 형태로 클라이언트(100)로 전송하는 것으로 이해함이 바람직하다.Although the client 100 according to the present invention is composed of a PC or a mobile device, the text editing server 200 may include a vector including a text reflecting a style corresponding to a request of the client 100, It is desirable to understand that the image is transmitted to the client 100 in the form of xml.

먼저, 클라이언트(100)는 사용자의 조작에 따른 키 입력을 통해 입력받은 텍스트를 배치할 텍스트 상자의 크기정보, 입력할 텍스트 및 텍스트 상자에 삽입될 텍스트의 스타일정보를 정보통신망을 통해 텍스트 편집서버(200)로 전송하고, 텍스트 편집서버(200)로부터 크기정보, 텍스트 및 스타일정보에 부합하도록 생성된 벡터 이미지를 수신하여 디스플레이 한다.
First, the client 100 transmits the size information of the text box to which the input text is to be placed, the text to be input, and the style information of the text to be inserted in the text box through the key input according to the user's operation, 200, and receives and displays the vector image generated from the text editing server 200 in accordance with size information, text, and style information.

한편, 텍스트 편집서버(200)는 클라이언트(100)로부터 크기정보, 텍스트 및 스타일정보를 수신하되, 도 2에 도시된 바와 같이, 스타일정보에 포함된 폰트, 크기, 스타일, 색상, 자간 및 장평 각각을 텍스트구간별로 적용한 텍스트를, 텍스트 패스를 구성하는 텍스트 박스의 좌측 중간 좌표, 중간 상단 좌표 및 우측 하단 좌표를 잇는 호에 따라 대응하도록 벡터 이미지로 생성하여 클라이언트(100)로 전송한다.On the other hand, the text editing server 200 receives size information, text and style information from the client 100, and as shown in FIG. 2, displays the font, size, style, color, To the client 100 in such a way that the text applied to the text section corresponds to a call connecting the left middle coordinate, the middle upper coordinate and the lower right coordinate of the text box constituting the text path.

즉, 도 2에 도시된 바와 같이, 종래에는 텍스트의 폰트, 크기, 스타일, 색상, 자간 및 장평을 지정한 단일 스타일을 제공하였으나, 본 발명에 따르면, 텍스트에 다중 스타일 지정이 가능하다.
That is, as shown in FIG. 2, a single style has been conventionally provided in which a font, a size, a style, a color, a character spacing, and a length of a text are specified. However, according to the present invention, multiple styles can be assigned to text.

또한, 텍스트 편집서버(200)는 클라이언트(100)로부터 수신한 크기정보, 텍스트 및 스타일정보와 대응하도록 텍스트 상자를 생성하되, 텍스트패스를 생성하는 경우, 상자의 좌측하단 모퉁이, 중앙상단점 그리고 우측중앙점의 3점을 잇는 호를 따라 생성한 벡터 이미지를 클라이언트(100)로 전송한다.The text editing server 200 generates a text box to correspond to the size information, the text and the style information received from the client 100. When generating the text path, the text editing server 200 generates a text box corresponding to the left lower corner, And transmits the vector image generated along the arc connecting the three points of the central point to the client 100.

즉, 도 3에 도시된 바와 같이, 종래에는 직선 형태의 텍스트에 대해서만 스타일 적용이 가능했으나, 본 발명에 따르면, 커브 또는 호 형태의 스타일 적용이 가능하다.
In other words, as shown in FIG. 3, in the related art, the style can be applied only to the straight line text. However, according to the present invention, the curve or arc style style can be applied.

그리고, 텍스트 편집서버(200)는 클라이언트(100)로부터 수신한 크기정보, 텍스트 및 스타일정보와 대응하도록 텍스트 상자를 생성하되, 상기 텍스트가 텍스트 상자 내에 모두 배치되지 못해 텍스트 넘침이 발생하는 경우, 넘침이 발생한 텍스트의 길이와 대응하도록 텍스트 상자의 높이를 늘이고, 높이가 늘어난 텍스트 상자의 좌측에 넘침이 발생한 텍스트를 배치하며, 배치가 완료된 텍스트 박스를 벡터 이미지로 생성하여 클라이언트(100)로 전송한다.The text editing server 200 generates a text box corresponding to the size information, the text, and the style information received from the client 100, and when the text is overlaid in the text box, The height of the text box is increased so as to correspond to the length of the generated text, the text in which the overflow occurs in the left side of the heightened text box is arranged, and the text box in which the placement is completed is generated as a vector image and transmitted to the client 100.

즉, 도 4에 도시된 바와 같이, 종래에는 텍스트 박스 크기를 초과하는 텍스트가 입력되는 경우 텍스트 넘침이 발생하나, 본 발명에 따르면, 텍스트 넘침이 발생하는 경우 자동으로 텍스트 박스의 높이가 늘여져 모든 텍스트가 텍스트 박스에 배치된다.
In other words, as shown in FIG. 4, when text exceeding the text box size is input, the text overflow occurs. However, according to the present invention, when the text overflow occurs, the height of the text box is automatically increased The text is placed in the text box.

아울러, 본 발명에 따른 벡터 이미지는 XML기반의 SVG(Scalable Vector Graphics) 형식의 포맷, SWF 포맷, PNG, JPG 구성되며, 벡터 이미지의 작동은 XML 텍스트 파일들로 정의되어 검색화, 목록화 및 스크립트화가 가능하고 압축형태로 변환될 수 있다.
In addition, the vector image according to the present invention is composed of an XML-based Scalable Vector Graphics (SVG) format, a SWF format, a PNG, and a JPG. The operation of the vector image is defined as XML text files, And can be transformed into a compressed form.

이하, 도 5를 참조하여 본 발명에 따른 Rich Text 이미지 처리 방법에 대해 살피면 아래와 같다.Hereinafter, a method of processing a Rich Text image according to the present invention will be described with reference to FIG.

먼저, 클라이언트(100)가 입력받은 텍스트 상자의 크기정보, 입력할 텍스트 및 텍스트의 스타일정보를 텍스트 편집서버(200)로 전송한다(S10).First, the client 100 transmits the size information of the text box, the text to be input, and the style information of the text to the text editing server 200 (S10).

이어서, 텍스트 편집서버(200)가 수신한 스타일정보에 포함된 폰트, 크기, 스타일, 색상, 자간 및 장평 각각에 대해 개별적으로 복수개의 스타일을 적용한 텍스트를 생성한다(S20).Then, the text editing server 200 generates a text in which a plurality of styles are individually applied to each of the font, size, style, color, character spacing, and length of view included in the style information received (S20).

뒤이어, 텍스트 편집서버(200)가 생성한 텍스트를 텍스트패스를 생성하는 경우 텍스트 박스의 좌측 중간 좌표, 중간 상단 좌표 및 우측 하단 좌표와 대응하도록 벡터 이미지로 생성한다(S30).Subsequently, when generating the text path, the text generated by the text editing server 200 is generated as a vector image corresponding to the left middle coordinate, the middle upper coordinate, and the lower right coordinate of the text box (S30).

그리고, 클라이언트(100)가 텍스트 편집서버(200)로부터 수신한 벡터 이미지를 디스플레이 한다(S40).
Then, the client 100 displays the vector image received from the text editing server 200 (S40).

한편, 도 6을 참조하여 본 발명에 따른 본 발명에 따른 Rich Text 이미지 처리 방법의 제S10단계 이후 과정에 대해 살피면 아래와 같다.Referring to FIG. 6, a process after step S10 of the method of processing a rich text image according to the present invention will be described below.

제S10단계 이후, 텍스트 편집서버(200)가 클라이언트(100)로부터 수신한 크기정보, 텍스트 및 스타일정보와 대응하도록 텍스트 상자를 생성한다(S50).After step S10, the text editing server 200 generates a text box to correspond to size information, text, and style information received from the client 100 (S50).

이어서, 텍스트 편집서버(200)가 텍스트상자의 좌측하단, 중간상단, 우측중간점을 잇는 텍스트패스를 구성한다(S60).Next, the text editing server 200 forms a text path connecting the lower left, middle upper, and right midpoints of the text box (S60).

그리고, 텍스트 편집서버(200)가 텍스트 패스에 따라 텍스트를 배치하여 벡터 이미지를 생성하고, 제S40단계로 절차를 이행한다(S70).
Then, the text editing server 200 arranges the text according to the text path to generate a vector image, and proceeds to step S40 (S70).

그리고, 도 7을 참조하여 본 발명에 따른 본 발명에 따른 Rich Text 이미지 처리 방법의 제S10단계 이후 또 다른 과정에 대해 살피면 아래와 같다.7, another process after step S10 of the method of processing a rich-text image according to the present invention will be described below.

제S10단계 이후, 텍스트 편집서버(200)가 클라이언트(100)로부터 수신한 크기정보, 텍스트 및 스타일정보와 대응하도록 텍스트 상자를 생성한다(S80).After step S10, the text editing server 200 creates a text box to correspond to size information, text, and style information received from the client 100 (S80).

이어서, 텍스트 편집서버(200)가 텍스트가 텍스트 상자 내에 모두 배치되지 못해 텍스트 넘침이 발생하는지 여부를 판단한다(S90).Subsequently, the text editing server 200 determines whether text overflow occurs because the text can not be all arranged in the text box (S90).

제S90단계의 판단결과, 텍스트 넘침이 발생하는 경우, 텍스트 편집서버(200)가 텍스트 박스의 높이를 자동적으로 늘려준다(S100).If it is determined in operation S90 that the text overflow occurs, the text editing server 200 automatically increases the height of the text box (S100).

그리고, 텍스트 편집서버(200)가 텍스트를 배치하여 벡터 이미지를 생성하고, 제S40단계로 절차를 이행한다(S110).Then, the text editing server 200 arranges text to generate a vector image, and executes the procedure in operation S40 (S110).

이상으로 본 발명의 기술적 사상을 예시하기 위한 바람직한 실시예와 관련하여 설명하고 도시하였지만, 본 발명은 이와 같이 도시되고 설명된 그대로의 구성 및 작용에만 국한되는 것이 아니며, 기술적 사상의 범주를 일탈함이 없이 본 발명에 대해 다수의 변경 및 수정이 가능함을 당업자들은 잘 이해할 수 있을 것이다. 따라서 그러한 모든 적절한 변경 및 수정과 균등 물들도 본 발명의 범위에 속하는 것으로 간주되어야 할 것이다.While the present invention has been particularly shown and described with reference to preferred embodiments thereof, it will be understood by those skilled in the art that various changes in form and details may be made therein without departing from the spirit and scope of the invention as defined by the appended claims. It will be appreciated by those skilled in the art that numerous changes and modifications may be made without departing from the invention. And all such modifications and changes as fall within the scope of the present invention are therefore to be regarded as being within the scope of the present invention.

S: Rich Text 이미지 처리 시스템
100: 클라이언트 200: 이미지 편집서버
S: Rich Text image processing system
100: client 200: image editing server

Claims (8)

이미지 처리 시스템에 있어서,
사용자의 조작에 따른 키 입력을 통해 입력받은 텍스트를 배치할 텍스트 상자의 크기정보, 입력할 텍스트 및 텍스트 상자에 삽입될 텍스트의 스타일정보를 정보통신망을 통해 텍스트 편집서버(200)로 전송하고, 텍스트 편집서버(200)로부터 크기정보, 텍스트 및 스타일정보에 부합하도록 생성된 벡터 이미지를 수신하여 디스플레이하는 클라이언트(100); 및
상기 스타일정보에 포함된 폰트, 크기, 스타일, 색상, 자간 및 장평 각각을 개별적으로 텍스트 구간별 스타일을 적용한 텍스트를, 텍스트 박스의 좌측 중간 좌표, 중간 상단 좌표 및 우측 하단 좌표를 잇는 텍스트 패스와 대응하도록 벡터 이미지로 생성하여 상기 클라이언트(100)로 전송하는 텍스트 편집서버(200);를 포함하는 것을 특징으로 하는 Rich Text 이미지 처리 시스템.
An image processing system comprising:
The size information of the text box in which the input text is to be placed, the text to be input and the style information of the text to be inserted in the text box are transmitted to the text editing server 200 via the information communication network, A client 100 for receiving and displaying a vector image generated from the editing server 200 in accordance with size information, text, and style information; And
Wherein the style information, the font, size, style, color, kerning, and Changping individually text piecewise text apply the style, text path connecting the intermediate coordinates, intermediate upper coordinate and a right lower coordinate the left of the text boxes corresponding to each included in And a text editing server (200) for generating a vector image to be transmitted to the client (100).
제 1 항에 있어서,
상기 텍스트 편집서버(200)는,
상기 클라이언트(100)가 제공한 텍스트상자를 이용하여 좌측하단점, 중앙상단점, 및 우측중앙점의 3점을 잇는 텍스트 패스에 따라 텍스트를 배치하는 Rich Text 이미지 처리 시스템.
The method according to claim 1,
The text editing server 200,
The text is arranged according to a text path connecting three points of a left lower end point, a center upper end point and a right central point using a text box provided by the client 100. [
제 1 항에 있어서,
상기 텍스트 편집서버(200)는,
상기 클라이언트(100)로부터 수신한 크기정보, 텍스트 및 스타일정보와 대응하도록 텍스트 상자를 생성하되,
상기 텍스트가 텍스트 상자 내에 모두 배치되지 못해 텍스트 넘침이 발생하는 경우, 넘침이 발생한 텍스트의 길이와 대응하도록 텍스트 상자의 높이를 늘이고, 높이가 늘어난 텍스트 상자를 기준으로 그 좌측에 넘침이 발생한 텍스트를 배치하며, 배치가 완료된 텍스트 박스를 벡터 이미지로 생성하여 상기 클라이언트(100)로 전송하는 것을 특징으로 하는 Rich Text 이미지 처리 시스템.
The method according to claim 1,
The text editing server 200,
Generates a text box to correspond to size information, text and style information received from the client (100)
When the text is overlaid because the text can not be all arranged in the text box, the height of the text box is increased so as to correspond to the length of the text where overflow occurs, and the text where the overflow occurs on the left side And generates a vector image of the text box in which the layout is completed, and transmits the vector image to the client (100).
제 1 항에 있어서,
상기 텍스트 편집서버(200)는,
상기 클라이언트(100)의 요청과 대응하는 스타일이 반영된 텍스트를 포함하는 벡터 이미지를 xml 형태로 상기 클라이언트(100)로 전송하는 것을 특징으로 하는 Rich Text 이미지 처리 시스템.
The method according to claim 1,
The text editing server 200,
And transmits the vector image including the text reflecting the style corresponding to the request of the client (100) to the client (100) in the form of xml.
제 1 항에 있어서,
상기 벡터 이미지는,
PNG, JPG, SWF 또는 XML기반의 SVG(Scalable Vector Graphics) 형식의 포맷 중에 어느 하나로 구성되며, 벡터 이미지의 작동은 XML 텍스트 파일들로 정의되어 검색화, 목록화 및 스크립트화가 가능하고 압축형태로의 변환이 가능한 것을 특징으로 하는 Rich Text 이미지 처리 시스템.
The method according to claim 1,
The vector image may include:
It is composed of one of the formats of SVG (Scalable Vector Graphics) format based on PNG, JPG, SWF or XML. The operation of vector image is defined as XML text files and can be searched, cataloged and scripted. Wherein said conversion unit converts said image data into a binary image.
이미지 처리 방법에 있어서,
(a) 클라이언트(100)가 입력받은 텍스트 상자의 크기정보, 입력할 텍스트 및 텍스트의 스타일정보를 텍스트 편집서버(200)로 전송하는 단계;
(b) 텍스트 편집서버(200)가 수신한 스타일정보에 포함된 폰트, 크기, 스타일, 색상, 자간 및 장평 각각에 대해 개별적으로 복수개의 스타일을 적용한 텍스트를 생성하는 단계;
(c) 텍스트 편집서버(200)가 생성한 텍스트를 텍스트 박스의 좌측 중간 좌표, 중간 상단 좌표 및 우측 하단 좌표와 대응하도록 벡터 이미지로 생성하는 단계; 및
(d) 클라이언트(100)가 텍스트 편집서버(200)로부터 수신한 벡터 이미지를 디스플레이하는 단계;를 포함하는 것을 특징으로 하는 Rich Text 이미지 처리 방법.
An image processing method comprising:
(a) transmitting size information of a text box received by the client 100, text to be input and style information of the text to the text editing server 200;
(b) generating a text to which a plurality of styles are individually applied for each of the font, size, style, color, character spacing, and length of view included in the style information received by the text editing server 200;
(c) generating a vector image such that the text generated by the text editing server 200 corresponds to the left middle coordinate, the middle upper coordinate, and the lower right coordinate of the text box; And
(d) displaying the vector image received by the client (100) from the text editing server (200).
제 6 항에 있어서,
상기 (a) 단계 이후,
(e) 텍스트 편집서버(200)가 클라이언트(100)로부터 수신한 크기정보, 텍스트 및 스타일정보와 대응하도록 텍스트 상자를 생성하는 단계;
(f) 텍스트 편집서버(200)가 텍스트상자의 좌측하단, 중간상단, 우측중간점을 잇는 텍스트패스를 구성하는 단계; 및
(g) 텍스트 편집서버(200)가 텍스트패스에 따라 벡터 이미지를 생성하고, 상기 (d) 단계로 절차를 이행하는 단계;를 포함하는 것을 특징으로 하는 Rich Text 이미지 처리 방법.
The method according to claim 6,
After the step (a)
(e) creating a text box so that the text editing server 200 corresponds to size information, text, and style information received from the client 100;
(f) constructing a text path connecting the text edit server 200 to the lower left, middle upper, and right midpoints of the text box; And
(g) generating a vector image according to a text path by the text editing server 200, and performing the procedure to the step (d).
제 6 항에 있어서,
상기 (a) 단계 이후,
(h) 텍스트 편집서버(200)가 클라이언트(100)로부터 수신한 크기정보, 텍스트 및 스타일정보와 대응하도록 텍스트 상자를 생성하는 단계;
(i) 텍스트 편집서버(200)가 텍스트가 텍스트 상자 내에 모두 배치되지 못해 텍스트 넘침이 발생하는지 여부를 판단하는 단계;
(j) 상기 (i) 단계의 판단결과, 텍스트 넘침이 발생하는 경우, 텍스트 편집서버(200)가 텍스트 박스의 높이를 자동적으로 늘리도록 설정하는 단계; 및
(k) 텍스트 편집서버(200)가 텍스트를 배치하여 벡터 이미지를 생성하고, 상기 (d) 단계로 절차를 이행하는 단계;를 포함하는 것을 특징으로 하는 Rich Text 이미지 처리 방법.
The method according to claim 6,
After the step (a)
(h) generating a text box so that the text editing server 200 corresponds to size information, text, and style information received from the client 100;
(i) determining whether text overflow occurs because the text editing server 200 fails to place all of the text in the text box;
(j) if the text overflow occurs as a result of step (i), setting the text editing server 200 to automatically increase the height of the text box; And
(k) the text editing server 200 arranges text to generate a vector image, and performing the procedure to the step (d).
KR20130090944A 2013-07-31 2013-07-31 System for handling rich text image and method therefor KR101494806B1 (en)

Priority Applications (1)

Application Number Priority Date Filing Date Title
KR20130090944A KR101494806B1 (en) 2013-07-31 2013-07-31 System for handling rich text image and method therefor

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
KR20130090944A KR101494806B1 (en) 2013-07-31 2013-07-31 System for handling rich text image and method therefor

Publications (2)

Publication Number Publication Date
KR20150015201A KR20150015201A (en) 2015-02-10
KR101494806B1 true KR101494806B1 (en) 2015-02-23

Family

ID=52571770

Family Applications (1)

Application Number Title Priority Date Filing Date
KR20130090944A KR101494806B1 (en) 2013-07-31 2013-07-31 System for handling rich text image and method therefor

Country Status (1)

Country Link
KR (1) KR101494806B1 (en)

Families Citing this family (1)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
KR102160448B1 (en) * 2018-11-23 2020-09-28 배성훈 System and method for generating and loading images alternating styled text in web pages

Citations (2)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
KR100743175B1 (en) 2006-10-20 2007-07-27 정병완 Advertisement writing method using computerized typesetting system
KR101208588B1 (en) 2010-11-29 2012-12-06 정병완 System for handling text based on vector image of supply publish on demand and method therefor

Patent Citations (2)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
KR100743175B1 (en) 2006-10-20 2007-07-27 정병완 Advertisement writing method using computerized typesetting system
KR101208588B1 (en) 2010-11-29 2012-12-06 정병완 System for handling text based on vector image of supply publish on demand and method therefor

Also Published As

Publication number Publication date
KR20150015201A (en) 2015-02-10

Similar Documents

Publication Publication Date Title
US9103059B2 (en) Methods and apparatus to manipulate embroidery designs via a communication network
US11216253B2 (en) Application prototyping tool
US11281849B2 (en) System and method for printable document viewer optimization
CN105549817A (en) Font package generation method and device and graphic display method and device
WO2020103245A1 (en) Font rendering method and apparatus, and computer-readable storage medium
KR101494806B1 (en) System for handling rich text image and method therefor
US9715643B2 (en) Label creation apparatus, label creation method, and label creation program
CN102902658A (en) Colorful character displaying method and device
JP2019053606A (en) Control program
CN104516868A (en) Layout space streaming restoring method and layout space streaming restoring system
US20080181531A1 (en) Emboldening glyphs without causing conglutination
CN105260353A (en) Typesetting method and device for mobile terminal
US9905030B2 (en) Image processing device, image processing method, information storage medium, and program
JP2016221940A (en) Label creating device, label creating method and label creating program
JP5003022B2 (en) Document processing system, document processing method, and document processing program
KR101279721B1 (en) Method and system for providing content in augmented reality
US20210026576A1 (en) Computer-readable storage medium and information processing apparatus
JP2014023006A (en) Information processing device, information processing method, and information processing program
KR101433301B1 (en) Font display system using multi glyph font
JP2004192394A (en) Information processor
JP5527991B2 (en) Image processing apparatus and image processing method
US11281742B2 (en) Interactive and selective coloring of digital vector glyphs
CN112199538A (en) Picture processing method and device, electronic equipment, system and storage medium
JP2016009292A (en) Image processor and program
CN113835595A (en) Picture display method and device, electronic equipment and computer storage medium

Legal Events

Date Code Title Description
GRNT Written decision to grant
FPAY Annual fee payment

Payment date: 20180117

Year of fee payment: 4

FPAY Annual fee payment

Payment date: 20190108

Year of fee payment: 5

FPAY Annual fee payment

Payment date: 20200302

Year of fee payment: 6