Library for visualizing data on the web.
- JavaScript (TypeScript 2.0)
- CSS (SASS)
- d3.js (4.x)
- SVG
- canvas
- webpack
- npm
- jest
- typedoc
# Clone the repository
git clone https://github.com/massmutual/mmviz-web.git
# Navigate into the root folder
cd mmviz-web/
# Install the dependencies
npm install
Make is used to run frequent tasks. Install it, if you need to. Below are tasks run by Make.
# Generate documentation
make docs
# Run tests and generate a coverage report
make test
# Build TS for dev
make scripts
# Build TS for prod
make scripts-dist
# Build Sass
make styles
# Publish to NPM
make publish
The following GitHub project includes several examples of mmviz-web :
(https://github.com/massmutual/mmviz-web-examples)
Factory to produce common Chart Builders
Performs data operations such as cleaning, sorting, filtering, aggregating and other general data operations.
Constructs charts from modular Layouts and Components. Allows method chaining to add on chart features. One can add on axises as well as add layers of different chart types.
Maps data from value to visual space and produces a layout view model.
Takes in the view model produced by a Layout and draws the visualization. Components can be implemented in different technologies such as SVG, canvas or webgl. This makes the library view agnostic.
Is a Singleton object that implements the observer pattern in order to facilitate communication between visual elements and enables flexible interactivity. For instance an "on click" event would be broadcasted out through a dispatcher channel to any elements listening for an "on click" event. By using the observer pattern via an event Dispatcher, it decouples each element to operate independently.
Uses Mustache templates to construct html views such as chart/legend layout and the "on hover" details dialog.