Heterogeneity Bands (Second Iteration)

100%

Heterogeneity Bands (Second Iteration)

✓ Published1🌍 Public

Last edited Nov 20, 2020

Created on Nov 16, 2020

This visualization displays heterogeneity bands from a metadata JSON file, with each study represented as a horizontal line and its confidence interval as a filled rectangular band. The bands use CSS `mix-blend-mode: multiply` to create darker overlaps where intervals intersect, revealing shared regions across studies. Implemented with D3 v6, the code uses `scaleLinear` for the x-axis, `scalePoint` for study positioning, and appends SVG `<rect>` and `<line>` elements to show the data from a gist-hosted dataset.

AI-generated description

Reiterating on the old version by using CSS color blend.

MIT Licensed

Similar vizzes

Loading thumbnail…

Heterogeneity Bands (Fork)

This visualization displays heterogeneity bands for study data, with each study represented as a horizontal line and an overlaid semi-transparent green rectangle spanning its confidence interval. The overlapping rectangles use blend modes to reveal density patterns across the dataset. Built with D3 v6, the code loads JSON data from a remote gist, applies a linear scale for the x-axis and a band scale for the y-axis, and renders SVG rectangles and lines. The rectangles use a green fill with opacity and mix-blend-mode color-dodge, while lines mark individual study intervals.

WWaseem Medhat

91% match

Loading thumbnail…

Heterogeneity Bands

This visualization displays heterogeneity bands for study data, with each study represented by a horizontal line and a semi-transparent red rectangle spanning its confidence interval range. The x-axis uses a linear scale mapping odds ratio bounds from low to high, while the y-axis employs a d3.scaleBand to distribute studies vertically. Data loads asynchronously from a JSON file via d3.json, and the SVG rendering appends rectangles and lines positioned by xScale and yScale. Overlapping bands with 0.5 opacity reveal density patterns across studies.

NNita

90% match

Loading thumbnail…

Heterogeneity Bands

This visualization displays heterogeneity bands for clinical study data, where overlapping translucent rectangles show the distribution of odds ratios across multiple studies. Each study is represented by a horizontal line positioned along a point scale, with the band width reflecting the confidence interval between lower and upper odds ratio bounds. The code uses d3.json to fetch external metadata, then applies d3.scaleLinear for the x-axis and d3.scalePoint for study positioning. Rectangles are stacked with opacity set to 1 divided by the total data length, creating darker regions where more studies overlap, while lighter lines highlight individual study ranges.

WWaseem Medhat

88% match

Loading thumbnail…

Heterogeneity Bands

This visualization displays heterogeneity bands as overlapping red rectangles across a horizontal log-odds scale, with gray reference lines positioned per study ID. The code fetches JSON metadata from a GitHub gist and uses d3.json, d3.scaleLinear, and d3.scaleBand to map study identifiers to the vertical axis and odds-ratio confidence intervals to the horizontal axis. Each rectangle spans from OR_lo to OR_hi with a constant height and 0.5 opacity, producing overlapping bands. The SVG rendering uses d3.select to append the chart elements, with the x-scale driven by the minimum and maximum odds-ratio values across the dataset.

NNita

84% match

Loading thumbnail…

Forest Plot with Heterogeneity Bands

This forest plot visualizes the results of a meta-analysis comparing intensive antihypertensive therapy to standard care, with heterogeneity bands shaded behind each study’s confidence interval to highlight variability. Built with D3 v6 and rendered as an SVG, the chart uses a logarithmic x-axis for odds ratios and a point scale for study IDs. The code employs `d3.scaleLog`, `d3.scalePoint`, and `d3.scaleLinear` to map data, with rectangles and lines drawn from a JSON metadata source.

WWaseem Medhat

73% match

Loading thumbnail…

Forest Plot with Heterogeneity Bands

This forest plot visualizes a meta-analysis comparing intensive antihypertensive therapy to standard care, showing odds ratios and confidence intervals for each study. Translucent heterogeneity bands behind the study markers reveal the range of effects across trials, with square marker size scaled by sample size. The visualization loads data from a JSON file and renders it as SVG using D3 v6, employing logarithmic scaling for odds ratios and d3.scalePoint for study positioning.

Sshaunstoltz

71% match

Loading thumbnail…

Forest Plot with Heterogeneity Bands

A forest plot displays odds ratios and 95% confidence intervals for individual studies, with an overall pooled estimate, comparing intensive antihypertensive therapy to standard care. Translucent teal heterogeneity bands overlay the plot, extending across the full chart height for each study’s confidence interval to visualize between-study variability. The code uses D3 v6 with SVG rendering, a log scale for the x-axis, and data loaded from a remote JSON file. Study-level points are sized by sample size using a linear scale.

MMaxene Graze

68% match

Loading thumbnail…

Untitled

This example shows the distribution of two variables as overlapping histograms, with semi-transparent bars in teal and dark purple to reveal how their ranges compare. The visualization is built with D3.js v4 and rendered as SVG, using `d3.histogram()` to bin the data and `d3.scaleLinear()` for the axes. The code loads a CSV file, filters it by a `type` column, and draws both series on a shared x-axis while scaling the y-axis to the maximum bin count. A handmade legend identifies the two variables.

JJens Grochtdreis

65% match