Brushable bar chart - Horizontal - IV

100%

Brushable bar chart - Horizontal - IV

✓ Published0🌍 Public

Last edited Jan 6, 2018

Created on Jan 5, 2018

This bar chart visualizes citation patterns in philosophy journals, showing how often each journal is mentioned across a snowball sample of highly cited articles. The visualization combines a main horizontal bar chart with a mini overview chart on the right; users can brush or scroll to zoom into specific portions of the data. The code uses d3.v3’s `d3.behavior.zoom` and brush components, with ordinal and linear scales mapping journal names to bar positions and mention counts. Data comes from a CSV file listing journal names, mention counts, and total citations.

AI-generated description

The sampling strategy to determine the journals used in my research on the continental/analytical split: Two analytic journals (mind, analysis) and two continental ones (review of Continental Philosophy, Journal of the British Society of Phenomenology) where selected. Citation-Data for the 500 hundred most cited articles of each journal was downloaded and evaluated. Every occurence of a journal name for each article was counted (Types, not Tokens were counted). Above are the top sixty journals and there frequencies, determined by this method.

For the visualization I am in debt to <a href='http://bl.ocks.org/nbremer/'>nbremer</a>'s block: <a href='http://bl.ocks.org/nbremer/326fb6de768e85261bfd47aa1f497863'>Brushable Horizontal Bar Chart - IV</a>

Similar vizzes

Loading thumbnail…

Brushable bar chart - Horizontal - IV

This example shows a brushable horizontal bar chart of the most-cited philosophers, with each bar representing an individual scholar and its length corresponding to citation count. The visualization pairs a detailed main chart with a smaller mini chart, where users can drag a brush to filter which portion of the ranked list is displayed. The chart uses D3 v3 with SVG rendering, employing `d3.behavior.zoom` for mouse-wheel scrolling and a brush for selection. Data, which includes citation counts from analytic and continental philosophy journals, is loaded from a CSV file and sorted by frequency.

MMNoichl

92% match

Loading thumbnail…

Brushable bar chart - Horizontal - V

This horizontal bar chart displays the gross counts of 48 philosophical publications. A main chart shows all values, while a smaller mini chart contains a brushable window. Users can drag this window, click to reposition it, or adjust its size with handles to control the visible range. The main chart updates its x-axis scale to fit the largest visible bar, ensuring optimal use of space. Built with D3 v3, it uses SVG for rendering and employs `d3.behavior.zoom` for mouse-wheel scrolling over the main chart for additional navigation.

MMNoichl

84% match

Loading thumbnail…

Brushable bar chart - Horizontal - IV

This brushable bar chart displays 40 randomly generated data entries as horizontal bars. Users can adjust a brushable window in a mini chart to control which bars appear in the main chart, with mouse-wheel scrolling for navigation. The visualization is built with D3 v3 (d3.v3) using SVG rendering and ordinal scales, implementing a custom `d3.behavior.zoom` handler for scrolling that slides bars without transitions.

RRicCheng

80% match

Loading thumbnail…

Brushable Horizontal Bar Chart - I

This example shows a brushable horizontal bar chart that lets viewers explore a large, randomly generated dataset by adjusting a selection box in a mini chart on the right. The main chart on the left displays the selected bars in detail, with the y-axis labels and bar lengths updating based on the brush extent. The chart uses D3 v3 with SVG rendering, employing `d3.svg.brush` for the interactive selection, `d3.scale.ordinal` and `d3.scale.linear` for scales, and an ordinal brush pattern adapted from an external example. Scrolling the mouse wheel also moves the brush, and resizing handles allow users to change the number of visible bars.

SSav10

79% match

Loading thumbnail…

Brushable bar chart - Horizontal - V

This example shows a horizontal bar chart with a linked mini chart on the right that acts as a brushable overview. Dragging the brush box, scrolling the mouse wheel, or clicking in the mini chart changes which bars are visible in the main chart, while the x-axis scale dynamically updates to fit the largest visible bar. The visualization is built with D3 v3, using ordinal scales for the y-axis, linear scales for the x-axis, and the `d3.svg.brush` component. SVG is used for rendering, with the main chart clipped via a clip-path. The data consists of 40 randomly generated country names and numeric values sorted in descending order.

TThanaporn-sk

78% match

Loading thumbnail…

a Barchart of brushes

Six horizontal bars form an editable bar chart, with each bar implemented as a draggable D3 v4 brush selection. The chart displays six numeric values between 0 and 20, rendered as blue bars on a light yellow background with a black axis. Users adjust a bar’s height by dragging its brush handle horizontally, which updates the underlying data and the white text label showing the value. The visualization uses `d3.brushX()` for interaction, `d3.scaleLinear()` for positioning, and SVG rendering, with the brush extent constrained to each bar’s row.

AAlainRo

74% match

Loading thumbnail…

Bar Chart with Brushing

This interactive bar chart demonstrates how brushing can reconcile the trade-off between a zero baseline and emphasizing small differences. The visualization displays two horizontal bars comparing scores across groups, rendered as SVG rectangles using React components. A linked brushing interface, implemented with d3.brushX, allows users to select a region on the top chart, which then dynamically updates the bottom chart’s x-scale domain via d3.scaleLinear. The data originates from a CSV file loaded with d3.csv, and React’s useState hook manages the brush extent state for responsive zooming.

WWaseem Medhat

73% match

Loading thumbnail…

D3: Unit Bar Chart with Brush and Zoom

This example demonstrates a unit bar chart of message counts over time, implemented with D3 v4 and rendered as SVG. The visualization includes two synchronized views: a main chart area displaying individual messages as circles positioned by date and daily message count, and a smaller context chart below. Users can brush on the context chart to select a time range, or scroll/zoom directly on the main chart to explore the data in detail. The data, loaded from a CSV file, shows message activity from 2013, with each circle representing a message and its vertical position indicating the number of messages sent that day. The chart also includes summary statistics that update based on the current brush/zoom selection. The axis labels and styling (orange circles with opacity) follow a clean, minimalist design. The example demonstrates linked brushing and zooming techniques in D3 v4, allowing for interactive exploration of temporal data.

EEdinDev

73% match