I essentially want to implement a feature where an 8x12 datagrid is used as a sort of visual representation of a 96-well plate. I want to populate the cells with values from a list of lists (96 sub-lists), where each sub-list has 3 elements to be inserted into each cell.
What I’m struggling with is finding out if this is even possible as traditional tables essentially have each column as a separate “list” of values that fall under a specific column-name identifier/property.Or if I would have to use a package like plotly to maybe draw 96 individual circles.
I’m not sure exactly what you’re trying to do, but (a) a simple object data table could have 8 columns and 12 rows (or 12 columns and 8 rows) and each entry could be a dictionary linking to the three values for the cell; and (b) if, when displaying the table, each cell could contain three labels, each of which maps to one of the values.
Are you trying to do something more complicated than that?
I believe we’re on the same page. I pretty much want to use the Data Grid feature unconventionally where the column and row labels are independent of the data that gets inserted into the cells. The data is uniform in that the sub-lists (or sub-dicts as I’ve now implemented based on your suggestion) always have the same keys with just different values depending on what the user wants to pull from our MongoDB. I just want to insert it sequentially so that each sub-dict goes in each cell without the columns or rows having specific bindings since the amount of populated cells/which cells are populated can vary.
Eg. If the user pulls a collection of 13 documents, I turn each document into a dictionary, and then I would like the grid to be as such:
Though the order of population doesn’t matter as it can go vertically then horizontally, or horizontally then vertically.
1 Like
Here’s a sample app doing most of what you want, I think:
https://anvil.works/build#clone:WHOPZDIXUOXVGJOC=5VXZEEWMXZHPYWUFRUKIUDA4
You could also build the Data Grid in the Drag-and-Drop Editor first to more easily customize its look, but I did it in code to make it quicker for me. Either way, using numeric column keys lets you manipulate the resulting grid more like a matrix.
2 Likes
Would a GridPanel suit your needs? That might be simpler than trying to adapt a DataGrid.
1 Like
Huge thanks Tim! This was exactly what I was trying to, not only communicate, but also do in my app.
1 Like