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

상자수염그림 차트 문의 드립니다. > Q&A | 토론

본문 바로가기

Wijmo

Q&A | 토론

VueJS 상자수염그림 차트 문의 드립니다.

페이지 정보

작성자 싱싱민 작성일 2023-05-23 09:16 조회 380회 댓글 0건
제품 버전 : "^5.20222.877"

본문


안녕하세요.


상자수염그림 차트에서 위와 같이 특정값의 위치를


빨간선으로 표시하는게 가능한가요?


확인 부탁 드리겠습니다.


감사합니다.

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

댓글목록

등록된 댓글이 없습니다.

3 답변

VueJS Re: 상자수염그림 차트 문의 드립니다.

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

페이지 정보

작성자 GCK루시 작성일 2023-05-24 16:09 댓글 1건

본문

안녕하세요 그레이프시티입니다.


문의하신 차트의 라인을 추가하는 방법에 대해 안내드립니다. 

해당 기능을 구현하기 위해서는 차트 렌더링이 끝난 후 발생하는 rendered 이벤트 내에서 라인을 그려주는 drawLine 메서드를 호출하여 라인을 그려주시면 됩니다.


자세한 코드는 아래 샘플에서 확인하실 수 있습니다.

  

 


- rendered API 문서

- drawLine API 문서 


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


감사합니다. 

그레이프시티 드림

댓글목록

삭제된 댓글

싱싱민 작성일

삭제된 댓글 입니다.

VueJS Re: 상자수염그림 차트 문의 드립니다.

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

페이지 정보

작성자 싱싱민 작성일 2023-06-01 08:55 댓글 0건

본문

보내주신 소스를 보면 x축과 y축의 위치값을 줘서 라인을 그려주는걸로 보이는데요.


예를 들어 데이터가 [ 3, 7, 2, 4, 3, 5, 8 ] 일 때 4인 값의 위치에 라인을 그릴려면

4인 값의 위치값은 어떻게 구하면 될까요?

댓글목록

등록된 댓글이 없습니다.

VueJS Re: 상자수염그림 차트 문의 드립니다.

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

페이지 정보

작성자 GCK루시 작성일 2023-06-05 14:10 댓글 0건

본문

안녕하세요 그레이프시티입니다.


해당 기능의 경우, 차트의 데이터 좌표에서 컨트롤 좌표로 변환해주는 dataToPoint 메서드를 호출하여 사용하시면 됩니다. 아래 코드와 같이 그리드의 itemsSource에 접근하여 좌표값으로 변환하고자 하는 데이터 값을 가져오고 변환 후, drawLine에 해당 값을 설정해주시면 됩니다.


chart.rendered.addHandler(function (s, e) { 
  s.series[0].hostElement.childNodes.forEach((rect, index) => { 
    (...) 
    var pt = s.dataToPoint(0, s.itemsSource[0].sales[10]);
   e.engine.drawLine(x, pt.y, x + xWidth, pt.y, "wj-add-line"); 
  } 
 } 
}); 
}); 


- dataToPoint API 문서 


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


감사합니다. 

그레이프시티 드림

댓글목록

등록된 댓글이 없습니다.

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