HTML5 기반의 데이터 인포그래픽 컴포넌트
한번의 생성으로 다양한 차트를 표현할 수 있습니다.
웹 접근성을 준수하며, 섬세한 디자인 변경을 지향합니다.

동영상으로 만나보세요

관련 솔루션 동영상

  • webPonent VIRTUAL KEY 소개 영상 (Full ver)

    webPonent VIRTUAL KEY 소개 영상 (Full ver)

주목할 특징

차트의 특징 : MULTI AREA CHART IN ONE ELEMENT 픽토그램

Multi Area Chart in One Element

한번의 생성으로 단일 시리즈, 콤비네이션 시리즈, 멀티축 적용은 물론 메인 영역과 다수개의 서브 영역을 분리하여 차트를 생성할 수 있습니다.

차트의 특징 : 타임슬라이스 픽토그램

타임슬라이스

그래프 흐름을 애니메이션 효과와 함께 재생할 수 있으며, 웹접근성에 따른 일시정지와 정지가 가능하고, 구간설정으로 원하는 구간의 그래프 추이를 파악할 수 있습니다

차트의 특징 : 디테일한 설정 픽토그램

디테일한 설정

기획자의 기획력과 디자이너의 창의력을 만족시킬 수 있도록 색채, 볼드, 글꼴 등 스타일과 관련된 설정에서부터 애니메이션 종류까지 섬세한 설정을 제공합니다.

차트의 특징 : 전용 에디터 제공 픽토그램

전용 에디터 제공

차트 적용에 앞서 webPonent Publisher를 통하여 실시간으로 차트 제작 및 미리보기 기능을 제공합니다.

차트의 특징 : 다양한 시리즈 픽토그램

다양한 시리즈

막대, 선, 캔들 등의 시리즈 뿐만 아니라 여러가지 Form을 제공합니다

차트의 특징 : 웹접근성 픽토그램

웹접근성 준수

도형 및 패턴 적용으로 웹접근성을 준수합니다.

차트의 특징 : 크로스브라우징 픽토그램

크로스 브라우징

Chrome, safari, firrfox, 최신의 IE뿐만 아니라 IE8부터 지원합니다.

차트의 특징 : 멀티디바이스 픽토그램

멀티 디바이스

하나의 소스로 pc, Mobile, Tablet Html5가 지원되는 모든환경(Browser)에서 완벽하게 동작합니다.

제품활용 예제

PC, Mobile, Tablet

각종 공공데이터를 webPonent CHART & GRID로 시각화한 예제를
준비했습니다. 빠른 속도는 물론 멀티디바이스 지원 기능까지
지금 바로 확인해보세요.

실제 데이터를 활용한 예제 보러가기

세부기능

webPonent CHART의 사용 가능한 기능 명세표
기능 설명
차트 종류 가로/세로 막대차트, 선차트, 면차트, 점(Plot)차트, 시고저종차트(Candle, Hloc), 멀티축차트, 영역분리차트(Main+Sub[다수개]),
다중시리즈 차트(막대+선, 선+면+점 등), 특정값 기준 상하락 선차트, 쌓은 막대 차트, 꺾인선 차트, 꺽인면 차트, 파이, 트리맵,
Horizon차트, 코리아맵, Scattor Plot 등
차트영역분리 하나의 SVG로 영역이 분리된 차트를 제작할 수 있음.
한번의 생성으로 두개이상의 차트를 만들어내는 효과를 얻을 수 있음.
각 영역별로 멀티축, 다중시리즈 적용도 가능.
단, 동일한 x축을 기준으로 생성됨.
데이터연동 웹포넌트 차트는 Ajax로 통신함.
JSON 형태의 Array나 ‘I’로 구분된 Text 형태의 데이터를 읽어올 수 있음.
AJAX가 아닌 JSON형태의 ARRAY데이터를 차트 초기화시에 클라이언트단에서 직접 포함할 수 있음.
추가 기능
  • 각 시리즈별 다양한 형태(상하락표현, 쌓은형태, 겹치기, 최소값 설정 등)와 선과 면 시리즈에서는 틱(5가지) 제공
  • 차트/영역/축의 색상 및 두께 마우스 오퍼시 활성화 스타일 등 사용자가 원하는 디자인 설정 가능
  • 십자선표시(색상, 두께, 유무), X/Y축 라벨의 포맷변경, 라벨폰트 스타일, Y축 위치 지정, 툴팁의 외부 정의 기능으로 좀더 세밀한 데이터 표현 가능
  • 동적데이터 표현이 가능하며, 시리즈 변경 및 옵션, 스타일도 동적으로 변경 가능
  • 시계열(Time Slice)을 통하여 차트의 시간적 흐름을 표현할 수 있음
  • 막대시리즈에 아이템 렌더러를 통하여 사용자가 원하는 형태를 직접 만들 수 있음
  • 전용에디터틑 통하여 시뮬레이션 가능하고, 저장/보관하여 추후 재사용하기 편리하도록 툴 제공(플러스 에디션 이상 제공)
  • 이미지로 변환이 가능하며, PC 다운로드 가능(트라이얼 다운로드시 batik jar로 적용된 예제 포함되어 있음
  • 웹접근성을 위한 패턴 이미지 적용이 가능하며, 캔들과 HLOC, 막대차트들의 상하락 표현에 +/-, ▲/▼ 기호를 출력하여 접근성 향상에 추가적인 효과를 줄 수 있음
  • PC, Mobile, Tablet 등 다양한 기기에서 동일한 차트 제공