Mitula
SSolara
•Created by Mitula on 9/28/2024 in #questions-issues
Changing text color in a Selectable DataTable cell by using an external function
Hello, I am trying to customize certain cells display in DataTable by using for example a format function.
I am trying to do this on a DataTable that allows me to select rows for further inspection.
I managed to get the "selectable" part by using rv.DataTable instead of solara.DataFrame/DataTable and setting up v_model="selected" and using on_v_model to get results back.
Now I am struggling on how to customize each cells individually given their value. I checked vuetify documentation and I saw that should be possible through cell_props but I didnt find that is currently exposed in the current ipyvuetify implementation of DataTable (or I didnt find!)
I tried to create a custom component by mixing these examples of vuetify webpage (https://github.com/vuetifyjs/vuetify/tree/master/packages/docs/src/examples/v-data-table/slot-item-key.vue and https://github.com/vuetifyjs/vuetify/tree/master/packages/docs/src/examples/v-data-table/prop-row-selection.vue), I managed to make something with circle values and selectable boxes, but failed miserably to make the on_v_model pass the feedback to python or even costumize directly which item to highlight/change or how to even expose the function "getColor" to be passthrough as a python function and to control which header item to use (by default it uses calories), since I am terrible at javascript/vue things related.
I am wondering how difficult would be to do this? dont need to be using <v-chip> just beign able to pass a function to change color based on a given cell value would be enough (for a certain header) and how to control that in python.
Is this too difficult?
Thanks!
10 replies