RNA Tissue expression

Iris Dataset

This example displays the first row of the classic Iris dataset as a formatted JSON object in a large monospace font. The code imports the CSV data, converts the numerical fields from strings to numbers, and then renders the entire first data point using a template literal. It relies on the browser's `JSON.stringify` method to produce the readable output, showcasing the data structure without any graphical chart.

SSubhendu Karmakar

geneInfoTable

This example presents a sortable data table of gene information, displaying columns such as gene name, DEG values, and subcellular location lists. The table is built with D3 v5 and React, using `d3.select` and `d3.ascending`/`d3.descending` for column sorting. Data is loaded from JSON and TSV files via `d3.json` and `d3.tsv`, with the table rendered as SVG and styled via CSS.

MMinwoo Pak

Untitled

This example displays a static RNA rainbow diagram, using an SVG canvas with pre-drawn shapes to represent a biological structure. It loads data from a local `1omh.json` file via a jQuery `getJSON` AJAX request, though the actual data visualization logic is not implemented in the provided script. The rendering relies on basic SVG elements—circles, rectangles, lines, and paths—styled with colors and strokes, with no dynamic layout or interaction. D3 v4 is included for potential data manipulation, but the current view is purely declarative markup.

HHirad Hosseini

complicate table + heatmap

This visualization combines a gene expression table with a heatmap. The left side displays a sortable table listing genes with their log expression values, names, and Ensemble IDs, while the right side renders a corresponding heatmap using SVG and Canvas. The heatmap uses a linear color scale to represent expression intensities across different samples. Users can click on "Plot" links to open a popup dialog that generates dynamic jitter plots, which are created using d3.v3 and loaded from separate JSON files based on grouping options like pathologic stage or race. The interface includes tooltips and download options for exporting the charts as SVG or PNG files.

11Cr18Ni9

ASIF Data

This visualization explores the ASIF dataset, which measures the DNA-binding affinity of transcription factors across various tissues. It presents a heatmap of ASIF and gene expression values, organized by gene and tissue clustering, alongside network graphs of protein-protein interactions and co-occurrence. The code uses `d3.csv` to load multiple CSV files, including the melted transcript data from a remote GitHub URL, and employs `d3.forceSimulation`-ready edge lists for network visualization. The dataset is preprocessed for numeric values and sorted based on cluster orderings.

Sssmadha@hotmail.com

Data Table Summary

This example displays a plain-text summary of a satellite dataset, showing the row count, column count, and file size in kilobytes, followed by the first ten rows formatted as JSON. The visualization uses D3 v5’s `csv` and `csvFormat` functions to parse and measure the data, then appends the results to the body as `pre` elements. The dataset covers man-made satellites as of April 2018, sourced from the Union of Concerned Scientists.

RRyan Fleming

Exploratory Summary (Vega-Lite API)

This example provides an exploratory summary of the Indian Liver Patient Records dataset from GitHub, displaying dataset size, row and column counts, and column names alongside an interactive circular scatterplot. The visualization plots the Albumin column against itself using Vega-Lite’s API within a React app, with d3.v6 handling CSV parsing. The chart is rendered as an SVG via the vega and vega-lite libraries, with a vega-tooltip handler enabling hover interactions and custom axis styling from a shared configuration.

WWaseem Medhat

Network Graph with D3 Packs on Zoom

This interactive network graph visualizes gene expression and alternative splicing (ASIF) across different tissues. Users select a tissue from the body map on the left, and filter by a minimum expression value with the slider. The graph supports zooming, panning, and dragging; zooming in reveals gene names and individual transcript structures. A legend allows filtering by cluster, and the body map supports organ highlighting and selection. The visualization is implemented with D3 and animates transitions smoothly.

Sssmadha@hotmail.com