2017-10-06 6 views
1

Chart.js에서 생성 된 그래프가 동적으로 수신되는 특정 성능 메트릭을 표시합니다. 내가 한 일 중 하나는 빨간색, 노란색 및 초록색의 배경에 3 개의 밴드를 그려서 메트릭 값이 좋든 나쁘든 평균인지에 대한 시각적 단서를 제공하는 것입니다. 나는 chart.js의 라인 버전을 확장하고 그것의 드로잉 기능에서 캔버스에 내 색채 밴드를 그렸다.Chart.js 백그라운드의 일부를 동적으로 다시 칠하기

가장 큰 가능한 값이 무엇인지 알면 잘 작동합니다. 그런 다음 최대 틱을 해당 값으로 정의하고 같은 값을 톱 포인트로 사용하여 내 빨간 띠를 그릴 수 있습니다. 그러나 가장 큰 값이 무엇인지 알지 못한다면 큰 것이 도착하자마자 차트가 자동으로 조정되어 적색의 흰색 밴드를 얻게됩니다.

인스턴스를 생성 한 후에 백그라운드의 일부를 동적으로 다시 그리는 방법이 있습니까? 내가 생각할 수 있었던 유일한 것은 "animation.onComplete"핸들러를 추가하여 배경을 다시 칠하는 것이 었습니다. 그러나 문제는받은 다음 값에서 내 새로 페인트 한 배경이 사라 지므로 잘못된 방법으로 처리한다고 가정합니다.

+0

이 도움이 되나요? https://stackoverflow.com/questions/41210840/obtain-max-value-of-y-axis-of-line-chart-rendered-with-chart-js? –

답변

1

이것이 도움이 될지 모르겠지만 Chat.js에 대한 내 경험에 기반하여 저에게 도움이 된 접근 방식은 저의 Chat.js 옵션을 한 번만 작성한 다음 채팅을하는 것입니다. 데이터 객체는 새로운 레코드가 생길 때마다 재생성됩니다. 이것은 실제로 나를 위해 작동합니다. tho, 나는 그것이 당신을 위해 일하기를 바랍니다.