Visualising experimental data as a family tree type graph

How do I do X?
1

Hi, I have data that is formatted like so in a database A (currently a CSV file):

ID - Date - Value

In another database B (also another CSV file but I am planning to switch to an actual database) I also have the following information

ID - Parent - XX - YY - ZZ

In some cases a new experiment is run based on a parent dataset - the parent ID is recorded in the parent column.

What I’d like is:

  1. To be able to show a table of latest data values (Done)
  2. For each line that has been clicked, show the genealogy of all ancestors and descendents, or at least within +/- 2 generations (how do I do this), extracting this data from Database B?
  3. Show a line chart for all different readings on different dates for the current ID from data in Database A (there are examples for this so this shouldn’t be a problem).
  4. Any click on any ID should also be able to update the entire app as well (how is this done in Appsmith).

Its my first week using Appsmith - so was wondering if anyone could help and/or advise on a potential control philosophy and what applets can be used here. I’m particularly struggling with (2).

Thanks.
Zhao

2

Hello Zhao, and welcome to our community! Thank you for sharing your use case.

For #2, where would you like to display the data? You can run a query with parameters in the onRowSelected event of the table to extract this data from the database. Here is also a sample app on this that you can fork.

For #4, it is not clear to me what you are trying to achieve. Could you elaborate a bit and send a loom.com screen recording of your implementation and the workflow?

3

Hi Amelia. Thanks for the response. Not a problem, I’ve written a Javascript app that extracts and formats the data for a sankey custom diagram from the current selected row in a table. This gives an OK result to start off with:

image
image345×511 12.5 KB

I have however come across some issues/questions

  1. I noticed that when importing data from Google Sheets, in a column that are mostly numbers - dataset example below:
    {500, 200, 150 500, 5L, 7L, 300}
    The 5L and 7L are imported as blank “” values. Why is this the case and how can I fix this.
  2. The “displayValue” option to have alternate labels (eg text) doesn’t work on sankeys, at least in appsmith. Eg https://www.fusioncharts.com/dev/chart-guide/chart-configurations/data-values. Is there a way within AppSmith to overlay text on a chart or a similar workaround?

For #4, its not a problem for now. I’m sure that I’ll figure this out given time. I probably just need to add a hyperlink or something similar to the chart, and then link that to a javascript function that changes the selected row in the table to another one or something similar, and then call for an update to all the relevant scripts and widgets.

Thanks.

4

For your new questions/issues:

  1. When fetching data from Google Sheets, it takes the data type of the first row. So if the first row contains only digits, it expects numbers and returns blank values if there are any strings in the subsequent rows. The workaround you can use for now is to use a dummy row in your data that specifies data in the expected data type or make sure that the first row does not contain only digits for that column (see here for more details).
    We also have this feature request to provide a permanent solution: [Feature]: Schema for unstructured databases like Google Sheets · Issue #10705 · appsmithorg/appsmith · GitHub. Please add a comment with your use case to help us prioritize it.

  2. Could you please elaborate on the issue and send screenshots or a loom.com recording of your implementation and the problem you face?