■ Web개발/Rechart (3) 썸네일형 리스트형 recharts legend 가 name에 겹쳐서 보이는 현상(페이지 첫번째 그래프) [문제] legend가 data name과 겹침 [해결방법] debounce={1} 을 ReponsiveContainer에 추가한다. return ( 99.5%는 100%로 할 경우 주욱 늘어나는 버그가 있어서, 99.5로 수치를 조정함. 아무리 고쳐봐도 페이지의 첫번째 그래프만 저렇게 데이터와 이름이 겹쳤었다. wrapperstyle 등등 legend 관련 api를 한참 건드려보다가.... 해결방법 참조 : https://github.com/recharts/recharts/issues/511 recharts ReferenceLine 에서 선 위에 숫자 넣기 (customize) 대략 이렇게 돼 있는데 처음에는 label만을 사용했었는데 label내부의 value에 상수가 적용되지 않았다. 값이 적용되지 않음... 그래서 찾아보니 custom하는 법.. 복잡하지만 ㅠ 다른 방법이 없었다 ReferenceLabel을 만들어준 것인데. 아래와 같다 const ReferenceLabel = (props: { fill: any; value: any; textAnchor: any; fontSize: any; viewBox: any; dy: any; dx: any; }) => { const { fill, value, fontSize, viewBox, dy, dx, textAnchor } = props; const x = viewBox.width + viewBox.x + 20; const y.. recharts Tip 원그래프를 할 때 div를 어디에 두냐에 따라 좌표가 변하므로, 잘 잡아야함. responsive container를 통해 높이 가로값을 두지 않아도 내부 값에 따라 변경됨. 레퍼런스 라인 y측 높이 제한 - domain 간혹 오류가 있을 때는.. width를 99%로 조정하면 해결될 수 있다고 합니다. 저의 경우는 오류 없이 잘 작동했습니다. 이전 1 다음
