Thankyou very much for the sample page. It helped me lot.
https://jsfiddle.net/BlackLabel/bzx871c2/
My requirement is i want to show m*n table left side of Heatmap (m*n matrix).
As per you page. heat map is having m=3, n=3.
Left side table m*n table and right side heat map chart m*n matrix should aligned properly(row and column width)
Finally it should be like one table with M rows * (n*2) columns matrix.
possible options
Option 1:
a) Add column names for Y axis (MyCategoryCol, myGoalsCol)
b) Y axis (ex: myGoalsCol, MyCategoryCol columns )should have border as similiar to heatmap cell.
Option 2:
1. let me add table with n columns (MyCategoryCol, myGoalsCol) and m rows in the left side of heatmap chart
2. i can give row and column width and height for my table, But Heatmap cell's height and width of each cell is automatically calculated. [lesser m*n = 2*2 => heatmap cells are bigger size, more m*n = 5*5 produces cells are smaller size]
i should be able customize cells width and height as similiar to my table.
Atthe end all rows ,columns should be aligned properly. Could you please provide solution for my request.
MyCategoryCol myGoalsCol
Category 1 GoalA
Category 2 GoalB
Category 3 GoalZ