https://github.com/justingosses/d3-status-bubblematrix
d3.js v3 code for creating a bubble matrix plot - can be used for visualizing status of items over time
https://github.com/justingosses/d3-status-bubblematrix
Last synced: 11 months ago
JSON representation
d3.js v3 code for creating a bubble matrix plot - can be used for visualizing status of items over time
- Host: GitHub
- URL: https://github.com/justingosses/d3-status-bubblematrix
- Owner: JustinGOSSES
- License: mit
- Created: 2017-01-20T01:06:36.000Z (over 9 years ago)
- Default Branch: master
- Last Pushed: 2017-01-20T01:52:39.000Z (over 9 years ago)
- Last Synced: 2025-03-11T06:50:21.436Z (over 1 year ago)
- Language: JavaScript
- Size: 80.1 KB
- Stars: 0
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# d3-Status-BubbleMatrix
d3.js v3 code for creating a bubble matrix plot - can be used for visualizing status of items over time
(this documentation is in progress)
## Main File is StatusBubbleMatrix.js
## Purpose
- Provide d3.js code that will make a bubble matrix such that information on status over time of multiple items can be conveyed efficiently.
- Information can be conveyed through:
- color of bubbles (red = trouble, green is good, yellow is caution, gray is no data)
- size of bubbles (longer in red or yellow the larger the size)
- color of square background behind bubbles (circle that changed color relative to previous has white background)
- order of items vertically (rows can be sorted by an additional dimension or one of the y-axis labels)
- labels to left on y-axis (categorical or unique names)
- labels to right on y-axis (categorical unique names)
- labels above on x-axis (usually time)
## Example Image
Inline-style:

### Inspired by:
gusgard's [d3-bubble-matrix](https://github.com/gusgard/d3-bubble-matrix)
## Code Structure
## Data Structure Assumptions
## Suggestions for adaption to other purposes
## License (MIT)