Abstract
Demand for text arranged in a circular shape is increasing as devices with round display such as smart watches are now being actively released. Data visualization field is receiving a lot of attention as the era of big data evolves. However, current web standard does not support the drawing of circular text. Therefore, the objective of this study was to extend CSS3 specifications to have circular text layout in web documents. In addition, we implemented a preprocessor so that contents made with CSS3 extensions could be shown in existing browsers. To confirm the wide expression range of CSS3 extension, we prepared some sample contents and analyzed them.
최근 스마트워치 등 원형 기기들이 출시되고, 빅데이터 시대로 데이터 시각화 분야가 주목을 받으면서 글자의 원형 배치에 대한 요구가 증가하고 있다. 하지만 현재 웹문서에서 글자를 원형이나 부채꼴로 배치하는 방법을 따로 지원하지 않는다. 이에 따라 본 연구는 웹브라우저 환경에서 CSS 스타일시트와 HTML로 표현되어 있는 웹문서 내의 글자를 원이나 부채꼴의 중심을 기준으로 하는 극좌표계로 배치할 수 있도록 CSS3 사양을 확장하였다. CSS3 사양 확장에 앞서 사례조사를 통하여 극좌표계 표현에 대한 요구사항을 분석하였으며 기존의 사각형이 아닌 부채꼴 서식모델을 제안하고 이에 맞추어 세부적인 텍스트 배치 사양을 정의하였다. 또한, 확장된 CSS3 사양으로 작성한 콘텐츠를 기존 브라우저에서 확인할 수 있도록 전처리기를 구현하고 샘플 콘텐츠를 작성하여 제안한 확장사양의 적합성을 검증하였다.