Fork of Beeswarm -pruebas update

100%

Fork of Beeswarm -pruebas update

✓ Published1🌍 Public

Last edited Aug 16, 2022

Created on Aug 10, 2022

A beeswarm chart displays 377 Chilean sociology and information science research projects funded by Fondecyt from 2010 to 2020, with circles colored by university. Hovering reveals project title, year, university, and lead researcher. The visualization uses d3.forceSimulation for collision-based layout, d3.scaleTime for the x-axis, and d3.scaleOrdinal for color encoding, rendering as SVG with data loaded from CSV and JSON sources.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Beeswarm -pruebas update-botones

This visualization displays 377 research projects funded by Fondecyt in Chile, grouped by sociology and information sciences, with each circle representing a project positioned along a time axis from 2010 to 2020. Interactive buttons filter projects by Fondecyt Regular, Iniciación, or all types, while hovering over circles reveals details about the year, university, lead researcher, and project title. The chart uses d3.forceSimulation with forceX and forceCollide to arrange overlapping circles, d3.scaleOrdinal for color encoding by university, and d3.scaleTime for the horizontal axis. Data comes from ANID via GitHub-hosted JSON and CSV files, rendered as SVG with a custom tooltip and legend.

Mmaxthamt

91% match

Loading thumbnail…

Beeswarm v2

This example visualizes 377 Fondecyt-funded sociology and information science projects in Chile between 2010 and 2020 as a beeswarm plot. Each circle represents a project, with its horizontal position indicating the year and color encoding the year via a color scale; hovering reveals the project title and year. The layout is computed using `d3.forceSimulation` with `forceX`, `forceY`, and `forceCollide` forces, while SVG circles and axes are rendered with D3 v7. Data is loaded from a remote CSV and JSON source.

Mmaxthamt

90% match

Loading thumbnail…

Fork 2 of beeswarm

A beeswarm plot uses a force-directed layout to visualize the distribution of honey bee colony loss percentages across U.S. states in 2015. Each circle represents a data point, positioned along a logarithmic x-axis according to its value, with a Voronoi tessellation overlay for interactive hover detection. The visualization employs d3.forceSimulation with forceX, forceY, and forceCollide to arrange points, and d3.voronoi for cell boundaries. Data originates from data_2015.csv, rendered as SVG with React and d3.v4.

Rryan-dirajlal

73% match

Loading thumbnail…

Beeswarm

A beeswarm plot displays the distribution of numeric values from a CSV dataset, with each circle representing a data point positioned along a logarithmic x-axis. The circles are arranged using d3.forceSimulation with forceX, forceY, and forceCollide to prevent overlap. A Voronoi overlay via d3.voronoi improves hover interaction: hovering over any cell highlights the corresponding circle in red, and a tooltip shows the data point’s ID and value. The visualization renders in SVG with an axis label and tick formatting.

FFrissAnalytics

73% match

Loading thumbnail…

Beeswarm (With Flying Bees)

A beeswarm chart plots the Flare data set's hierarchical node values on a logarithmic x-axis. The visualization uses `d3.forceSimulation` with `d3.forceX`, `d3.forceY`, and `d3.forceCollide` to arrange individual points. Each point is rendered as a bee emoji via an SVG `image` element, and after a delay, the bees animate to a new position. A Voronoi overlay, created with `d3.voronoi`, improves hover interaction by expanding the clickable area for tooltips that show the node's ID and value.

BBBischof

72% match

Loading thumbnail…

Beeswarm + maintain x-position of nodes

A beeswarm chart displays French word stems ranked by frequency and trend score, with each circle colored by rank from light green to pink. The visualization uses D3 v4's `d3.forceSimulation` to separate overlapping nodes while maintaining each circle’s original x-position based on its trend value. To achieve this, the tick function resets x coordinates each frame while progressively increasing the `d3.forceCollide` radius to reduce jitter. Hovering reveals a tooltip showing the stem, rank, and trend value.

KKcnarf

71% match

Loading thumbnail…

Fork of beeswarm

This visualization displays a beeswarm plot of honey bee colony loss percentages across different U.S. states in 2015, with each circle representing a reported cause of loss positioned along a logarithmic x-axis. The chart uses d3.forceSimulation with forceX and forceCollide to arrange the data points, while d3.voronoi polygons provide hover detection and interactive highlighting. The code uses d3.csv to load data_2015.csv and renders the results as an SVG with a logarithmic scale axis.

Rryan-dirajlal

71% match

Loading thumbnail…

30.Beeswarm

A beeswarm plot distributes circular marks along a logarithmic x-axis to show the distribution of file sizes from the flare dataset, with a force simulation stacking points vertically to prevent overlap. A Voronoi overlay expands the hover target for each point, displaying a tooltip with the file’s ID and value. The visualization uses d3.forceSimulation with d3.forceX, d3.forceY, and d3.forceCollide, rendered as SVG, with a d3.axisBottom log scale and d3.voronoi polygons for interaction.

深深度碎片

70% match