Parkhwahwa

@Parkhwahwa·4 public vizzes

Table_Cell Integration Trial12_EH

This interactive visualization maps gene expression data onto a stylized diagram of a cell, showing which subcellular locations (e.g., plasma membrane, cytosol) have up- or down-regulated genes. It integrates a treemap of gene ontology categories, a color-coded cell diagram drawn with `d3.line` and `curveCardinal`, and a filterable HTML table. The code uses `d3.scaleSequential` with `interpolateBlues` and `interpolateReds` to color cell regions based on net differential expression values, and transitions animate table row updates.

Dec 9, 2019

Loading thumbnail…

Table_Cell Integration Trial4

This interactive visualization integrates a cell diagram with a treemap and gene info table to explore gene expression across subcellular locations. Users can hover over cell regions or click to highlight areas, while a sortable table displays gene names, DEG values, and functional level lengths. The cell areas are drawn as SVG paths using D3’s `line` generator with cardinal curve interpolation, colored by net differential expression via `scaleSequential` and `interpolateBlues`/`interpolateReds`. The treemap, built with `d3.treemap`, also reads external JSON data, and transitions animate table row updates on selection.

Dec 9, 2019

Loading thumbnail…

Table_Cell Integration Trial2

This visualization integrates a gene table with a diagram of a cell. The cell diagram shows color-coded regions representing net gene expression changes based on data for a list of genes. It uses D3 v5 to draw the cell areas as SVG paths. Clicking a cell region filters the gene table, highlighting associated genes. The table is sortable and styled with CSS, while the data is loaded from an online JSON file.

Dec 8, 2019

Loading thumbnail…

TEST - Cell_Table_Integration

This interactive visualization integrates a color-coded model of a cell with a filterable data table. It shows the locations of gene expression within cellular compartments, such as the plasma membrane and cytosol, by mapping the cumulative net differential expression (net_DEG) of user-selected genes to a red-blue color scale. Users can hover over the cell diagram to select specific locations, and the linked table displays gene information, including the number of associated level1 and level2 cellular locations. The application is built with React and uses d3 for SVG rendering, path generation, and data processing, sourcing its data from a provided JSON database and a text file containing the gene list.

Dec 8, 2019