🏠 back to Observable

USDA Nutrients UMAP-Heatmap


I’ve been working on ways to show the relationship between visualizing data using dimensionality reduction (e.g. UMAP, using deck.gl for interactive visualization) and hierarchically clustered heatmaps (e.g. using our library Clustergrammer-GL) as well as show the benefits of making linked visualizations.

This notebook shows how we can visualize a high-dimensional food nutrient dataset from the USDA (source Nutrient Explorer) ~7,000 foods and 14 nutrient dimensions. It works best when set to landscape and fullscreen.

Next, I would like to make a version using the techniques from this notebook https://observablehq.com/@fil/umap-o-matic by @fil that enables users to upload their own data.


This example is very similar and uses spatial transcriptomics data from 10x genomics

1 Like

Here’s a variant made using NBA shot chart data

these are awesome! I’d been wanting to see nutrient UMAP for a long time, would be fun to also hook up parallel coordinates too:

one issue I ran into is that on my phone the UMAP canvas takes up the full height so I can’t scroll past the canvas.


Thanks @enjalot! Yes, it would be cool to have parallel coordinates set up as well.

Yeah, I also need to get Clustergrammer-gl to be more mobile friendly (as well as improve the fullscreen behavior - I tried using a button here with CitiBike data https://observablehq.com/@cornhundred/citibike-clustergrammer-gl-and-deck-gl).

1 Like

Hi @enjalot, I recently gave a talk where I tried to relate scatter plots, dimensionally reduction, parallel coordinates, and heatmaps in a few slides (video https://youtu.be/dSEy6XGoIi0 6-9 minute mark and slides
bit.ly/nci-clustergrammer2) - I’m basically making the argument that heatmaps can be thought of as parallel coordinates and parallel data. I’ll probably try to make a notebook out of these intro slides later. Let me know if you have any comments :slight_smile:

I would love to see a notebook based on those slides! It’s an interesting perspective I hadn’t seen in that way though I’ve thought about the various representations independently before. I wonder if having a toy example that could be played with interactively could help illustrate the concepts.
Some time ago I was playing with the idea of such a toy example around dimensionality reduction but couldn’t find a way to bring it home:

wonder if it gives any ideas?

1 Like

Yeah, I have been thinking about making a notebook on those slides. I agree that a single dataset with linked views (scatterplot, parallel-coords, dimensionality reduction, and heatmap) would be very nice. I just have to find a good dataset (e.g. Iris flowers or NBA stats or something), right plotting tools (deck.gl has been working well), and some time :slight_smile: (I’ll update here once I have something working)

@enjalot Thanks for sharing the triangle world notebooks they look great and I look forward to checking them out in more detail.