! 제품 버전을 정확하게 입력해 주세요.
제품 버전이 정확하게 기재되어 있지 않은 경우,
최신 버전을 기준으로 안내 드리므로
더욱 빠르고 명확한 안내를 위해
제품 버전을 정확하게 입력해 주세요!

차트 어노테이션관련 문의 > Q&A | 토론

본문 바로가기

VueJS 차트 어노테이션관련 문의

페이지 정보

작성자 김현 작성일 2022-07-26 17:10 조회 1,096회 댓글 0건
제품 버전 : 5.2

본문


 

현재 편집 가능한 주석 예제처럼 편집 가능한 주석을 사용 하려고 하는데요

추가로 화살표를 추가 하고 싶습니다


  • 페이스북으로 공유
  • 트위터로  공유
  • 링크 복사
  • 카카오톡으로 보내기

댓글목록

등록된 댓글이 없습니다.

1 답변

VueJS Re: 차트 어노테이션관련 문의

추천0 이 글을 추천하셨습니다 비추천0 채택채택

페이지 정보

작성자 GCK다이애나 작성일 2022-07-28 10:29 댓글 0건

본문

안녕하세요. 

그레이프시티입니다.


문의 주신 기능은 Polygon클래스에서 point의 컬렉션을 가져오는 points속성의 x좌표 와 y좌표 값을 지정하여 특정 형태로 커스텀한 주석을 생성하여 구현할 수 있습니다.

아래의 샘플에서 노란색 화살표 모양이 있는 버튼을 클릭한 후 차트에 주석을 추가해 보시기 바랍니다.

샘플은 아래 방법을 통해 구현되었습니다.

  • Polygon 클래스의 points속성을 지정하여 화살표 아이콘이 있는 사용자 정의 버튼을 생성합니다.
  • 차트 상단에 위치한 화살표 버튼을 클릭한 다음 차트 컨트롤을 마우스 커서로 클릭했을 때, 화살표 형태의 주석이 추가되는 함수를 생성합니다.
  • 이때, 마우스 커서가 처음으로 클릭되는 지점의 값(originPoint)과 마우스 커서를 클릭한 채로 이동한 현재 지점의 값(currentPoint), 그리고 그 두 지점의 차이 값(offsetX, offsetY)을 이용해 화살표 형태의 주석 크기를 설정하는 함수를 생성해줍니다. 


- 편집 가능한 주석 데모

- Polygon API 문서

- Points API 문서


API문서를 공유드리며 다른 궁금한 점이 생기면, 문의 주시기 바랍니다.


감사합니다.

그레이프시티 드림



댓글목록

등록된 댓글이 없습니다.

메시어스 홈페이지를 통해 제품에 대해서 더 자세히 알아 보세요!
홈페이지 바로가기
메시어스 홈페이지를 통해 제품에 대해서 더 자세히 알아 보세요!
홈페이지 바로가기
이메일 : sales-kor@mescius.com | 전화 : 1670-0583 | 경기도 과천시 과천대로 7길 33, 디테크타워 B동 1107호 메시어스(주) 대표자 : 허경명 | 사업자등록번호 : 123-84-00981 | 통신판매업신고번호 : 2013-경기안양-00331 ⓒ 2024 MESCIUS inc. All rights reserved.