Untitled

100%

✓ Published0🌍 Public

Last edited Nov 25, 2018

Created on Nov 25, 2018

A horizontal bar chart displays the suspiciousness scores of individual code lines from a Java file, with each bar labeled by an identifier and the x-axis showing the score. The visualization uses a linear scale for suspiciousness and a band scale for the row index. Built with D3 v4, it loads data from a CSV and renders SVG rectangles, axes, and labels using `d3.csv`, `d3.scaleBand`, `d3.scaleLinear`, and the `d3.axisBottom` and `d3.axisLeft` components.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Fault Localization 3

Three horizontally aligned bar charts compare suspiciousness, recency, and line complexity for 25 source-code lines from Apache Commons Lang. Each chart shares the same line IDs on the y-axis, with bar lengths scaled by d3.scaleLinear, while d3.scaleBand handles row spacing. The data loads from data.csv and renders as SVG using D3 v5 selections and axes. An unlabeled sort button exists but its behavior is not implemented.

KKanagaraj-NN

81% match

Loading thumbnail…

Fault Localization 7

Three horizontally aligned bar charts compare three metrics—suspiciousness, recency, and line complexity—for the top 25 ranked source-code lines from the Apache Commons Lang project. Each chart shares a common y-axis of line identifiers, while the x-axis scales linearly per metric, with bars colored steelblue, orange, and green respectively. The visualization, built with D3 v5, uses `scaleLinear` and `scaleBand` to position bars and `axisBottom` for the value axes. A sort button is provided but its interaction is not implemented in the shown code.

KKanagaraj-NN

80% match

Loading thumbnail…

Fault Localization 2

This visualization displays three horizontally stacked bar charts comparing fault-localization metrics for Java source code lines, using suspiciousness, recency, and line complexity as measured values. Each chart shares the same y-axis ordering by line ID, with the next two panels omitting the left labels to emphasize differences. Built with D3 v5, the code loads data from a CSV file and renders SVG rectangles using scaleLinear, scaleBand, axisLeft, and axisBottom functions, applying steelblue bars across three separate chart regions.

KKanagaraj-NN

79% match

Loading thumbnail…

Fault Localization 8 update

Three horizontally aligned bar charts display the top 25 suspicious code lines from Apache Commons Lang, each chart ranking the same items by a different metric: suspiciousness in red, recency in orange, and line complexity in steel blue. The code uses d3.csv to load the data and d3.scaleBand with d3.scaleLinear to render SVG rectangles for each metric. Three colored buttons trigger a re-sorting of all charts simultaneously using d3.select and the sort method, demonstrating an interactive update pattern across synchronized views.

KKanagaraj-NN

79% match

Loading thumbnail…

Fault Localization 4

Three side-by-side horizontal bar charts rank the top 25 fault-prone lines from a CSV of Java source metrics by suspiciousness, recency, and line complexity. Each chart shares the same y-axis ordering of line IDs while sorting only the complexity view via the “sort” button, which reorders data with `scaleLinear` and `scaleBand`. Built with D3 v5, the SVG visualization uses `csv`, `axisLeft`, and `axisBottom` to render the grouped comparisons.

KKanagaraj-NN

78% match

Loading thumbnail…

Fault Localization 5

This visualization presents a tri-panel view of fault localization data for 25 source code lines, showing suspiciousness, recency, and line complexity as horizontal bar charts. Each panel shares the same y-axis ordering by line ID, enabling cross-comparison of metrics. The charts are rendered as SVGs using D3 v5, with the third panel featuring a sort button that reorders bars by line complexity. The suspiciousness and recency panels use `d3.scaleLinear` for x-axes, while all panels employ `d3.scaleBand` for categorical y-axis spacing. Data originates from a CSV file containing Apache Commons source file references.

KKanagaraj-NN

78% match

Loading thumbnail…

Customizing Axes

This example shows a horizontal bar chart of suspicious code lines ranked by ID, with populating data from a CSV file. It demonstrates how to customize D3 axes: the y-axis removes its domain and tick lines, while the x-axis uses a custom tick formatter (format('.3s')) to abbreviate numbers, replacing 'G' with 'B'. Data is loaded via d3.csv and rendered as SVG rectangles using scaleLinear and scaleBand. Axis labels and a title are added with custom styling through styles.css.

KKanagaraj-NN

77% match

Loading thumbnail…

Fault Localization 6

Three adjacent horizontal bar charts compare fault-localization metrics for the top 25 suspicious lines from Apache Commons Lang. The charts show suspiciousness, recency, and line complexity using steelblue, orange, and red bars respectively, with a shared y-axis of source-code line identifiers. A sort button reorders the data, though the code does not implement this interaction. The visualization uses D3 v5 with scaleLinear, scaleBand, axisLeft, and axisBottom to render SVG bars from CSV data.

KKanagaraj-NN

77% match