arunghosh / react-heatmap-grid

A react component for heatmap visualisation in grid layout
https://codesandbox.io/s/r4rvwkl3yn
MIT License
77 stars 41 forks source link

yLables colliding with the data when bigger in length #210

Closed monikadixit closed 3 years ago

monikadixit commented 3 years ago

image

arunghosh commented 3 years ago

@monikadixit There is a new package available - https://github.com/arunghosh/react-grid-heatmap

Can you check that?

monikadixit commented 3 years ago

Thanks Arun for replying, I want to use value while rendering cell style.Basically have the cell color on the basis of value. However it is not accessing the value correctly.

cellStyle={(_x, _y, ratio, value) => ({ background: setRGB(value), fontSize: ".7rem", color: rgb(0, 0, 0, ${ratio / 2 + 0.4}) })}

On Wed, Nov 11, 2020 at 9:43 AM Arun Ghosh notifications@github.com wrote:

@monikadixit https://github.com/monikadixit There is a new package available - https://github.com/arunghosh/react-grid-heatmap

Can you check that?

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/arunghosh/react-heatmap-grid/issues/210#issuecomment-725181475, or unsubscribe https://github.com/notifications/unsubscribe-auth/AEYG37TUP4U6A4ZBYHJBJU3SPIFOTANCNFSM4TQJLSEQ .

arunghosh commented 3 years ago

@monikadixit

The value parameter is not there in the cellStyle. But you can get it using x, y.

cellStyle={(x, y, ratio) => ({
  background: setRGB(data[x][y]),
  fontSize: ".7rem",
  color: `rgb(0, 0, 0, ${ratio / 2 + 0.4})`
})}

Can you check if this works?