plotly / plotly/plotly.js

Adding a dendrogram to heatmaps

Ouverte
#6,894 3 commentaires 9 réactions 0 personnes assignées Voir sur GitHub

Personne n'a encore pris cette issue.

feature P3
Langage dominant
JavaScript
Étoiles
18.3k
Forks
2k
Merge moyen
2 j 12 h
PR mergées (30 j)
28

Description

I know there is a duplicate issue, but it looks like that isn't being watched anymore and I'll add a little more detail here.

Duplicate issue: https://github.com/plotly/plotly.js/issues/1321

In many bioinformatics applications, heatmaps are made and need to be grouped on some factor relevant to each column in the heatmap. For example, you may have a heatmap where the columns are the samples and the rows are number of molecules A, B, C, and D found in each sample. Each sample is categorized as either female or male. In a normal heatmap, you would not be able to visualize the differences in numbers of molecules between male and female since they are randomly placed left to right. So, you add a dendrogram to sort the samples into similar groups based on the data used to generate the heatmap.

Since many bioinformaticians use R, they will use a package like pheatmap to create a heatmap with the dendrograms on both the x and y axes. This blog post shows a good example in a bioinformatics context. I am copying the image over for easy access:

image

I would like to have this in plotly js since I am creating a web application to visualize some bioinformatics data. Without the dengrogram, a lot of these plots are meaningless. I could create the plots on the backend and have the front end access them, but that is not as performant as moving the logic over to the front end. In the duplicate issue, there are references to dash_bios clustergram function, but that still requires the plot to be generated on the back end in cases when the front end is written in a javascript framework such as react.

To get this to work, we will need some sort of dendrogram creating tool. I did a cursory search and did not find anything; however, I am not really sure how this is implemented in python either. If someone has more knowledge, I would be interested to hear about it. I would be willing to commit some code to help implement it, but would need guidance from folks more familiar with plotly.js internals and dendrogram calculations.

Guide de contribution

Ouvrir le guide de contribution

Par où commencer

  1. Lisez l'issue en entier, puis le guide de contribution du projet.
  2. Signalez en commentaire que vous la prenez — cela évite que deux personnes fassent le même travail.
  3. Forkez le dépôt et travaillez sur une branche.
  4. Ouvrez une pull request qui référence le numéro de l'issue.

Piste de recherche

Commencez par examiner l’issue en double #1321 et les exemples de pheatmap associés afin de comprendre le comportement demandé pour le dendrogramme. L’issue ne mentionne aucun fichier, test ou point d’entrée ; des indications de la part des maintainers de plotly.js sont donc nécessaires avant l’implémentation. Le travail serait considéré comme terminé lorsque les dendrogrammes côté client pourront regrouper les lignes et les colonnes de la heatmap sans génération côté backend.

Rédigé par le modèle d'indexation à partir du texte de l'issue.

Évaluation

Stack technique
javascript
Domaine
data-visualization
Type d'issue
Fonctionnalité
Difficulté
5/5
Temps estimé
Plus d'une semaine
Activité
À l'abandon
Clarté
À clarifier
Accessibilité débutants
25/100

Recevez les nouvelles issues par e-mail

Un résumé court des issues GitHub adaptées aux débutants.