vizart-core
vizart-core serves as fundamentals of all VizArt components.
- Demo quick reference with source code
- Documentation
Usage:
- Install
npm install vizart-core --save
- ES6 Usage
import { generateColorPalette } from 'vizart-core';
Development
- Clone repository
- Run commands
npm install // install dependencies
npm run dev // view demos in web browser at localhost:3005
npm run build // build
npm run test // run tests only
npm run test:cover // run tests and view coverage report
API
Color
Generator
Generate a color palette in HCL namespace. In the palette, each color has a sub-colorspace.
Preset
Color preset for great data visualization color scheme:
- ColorBrewer as well as pre-defined schemes
- CubeHelix
Credit: Images of color scales are from d3-scale and d3-chromatic-scale
Four ways to use a preset:
- Standard
import { SchemeBlues, Globals } from 'vizart-core';
const _color = {
scheme: SchemeBlues,
type: Globals.ColorType.SEQUENTIAL
}
- Use d3 interpolator
import { Globals } from 'vizart-core';
import { interpolateCubehelixDefault } from 'd3-scale';
const _color = {
scheme: interpolateCubehelixDefault,
type: Globals.ColorType.SEQUENTIAL
}
- Use string literals directly
const _color = {
scheme: 'Blues',
type: 'sequential'
}
- Use customized scheme
const _color = {
scheme: ['#ffc65f','#9eb778','#0096b6'],
type: 'sequential'
}
Sequential (Single Hue)
SchemeReds
SchemeBlues
SchemeGreens
SchemeGreys
SchemeOranges
'Oranges'/d3.interpolateOranges
SchemePurples
'Purples'/d3.interpolatePurples
Sequential (Multi Hue)
SchemeBuGn
SchemeBuPu
SchemeGnBu
SchemeOrRd
SchemePuBuGn
SchemePuBu
SchemePuRd
SchemeRdPu
SchemeYlGnBu
SchemeYlGn
SchemeYlOrBr
SchemeYlOrRd
SchemeViridis
'Viridis'/d3.interpolateViridis
SchemeInferno
'Inferno'/d3.interpolateInferno
SchemeMagma
SchemePlasma
SchemeWarm
SchemeCool
SchemeRainbow
'Rainbow'/d3.interpolateRainbow
SchemeCubehelix
'Cubehelix'/d3.interpolateCubehelix
Categorical
SchemeAccent
SchemeDark2
SchemePaired
SchemePastel1
SchemePastel2
SchemeSet1
SchemeSet2
SchemeSet3
SchemeCategory10
'Category10'/d3.schemeCategory10
Divergent
SchemeBrBG
SchemePRGn
SchemePiYG
SchemePuOr
SchemeRdBu
SchemeRdGy
SchemeRdYlBu
SchemeRdYlGn
SchemeSpectral
'Spectral'/d3.interpolateSpectral
Generic Scheme
generic are a set of colors that are eligible for both sequential and categorical usage
- Metropolis
- MetroCold3
- MetroCold4
- MetroCold5
- MetroDawn3
- MetroDawn4
- MetroRain3
- MetroRain8
License
This project is licensed under the MIT License - see the LICENSE file for details