Package Exports
- d3plus-color
This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (d3plus-color) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.
Readme
d3plus-color
Color functions that extent the ability of d3-color.
Installing
If you use NPM, run npm install d3plus-color --save. Otherwise, download the latest release. The released bundle supports AMD, CommonJS, and vanilla environments. You can also load directly from d3plus.org:
<script src="https://d3plus.org/js/d3plus-color.v0.6.full.min.js"></script>API Reference
- colorAdd - Adds two colors together.
- colorAssign - Assigns a color to a value using a predefined set of defaults.
- colorContrast - A set of default color values used when assigning colors based on data.
- colorLegible - Darkens a color so that it will appear legible on a white background.
- colorLighter - Similar to d3.color.brighter, except that this also reduces saturation so that colors don't appear neon.
- colorSubtract - Subtracts one color from another.
- colorDefaults - A set of default color values used when assigning colors based on data.
| Name | Default | Description |
|---|---|---|
| dark | #444444 | Used in the contrast function when the color given is very light. |
| light | #f7f7f7 | Used in the contrast function when the color given is very dark. |
| missing | #cccccc | Used in the assign function when the value passed is null or undefined. |
| off | #b22200 | Used in the assign function when the value passed is false. |
| on | #224f20 | Used in the assign function when the value passed is true. |
| scale | #b22200, #eace3f, #282f6b, #b35c1e, #224f20, #5f487c, #759143, #419391, #993c88, #e89c89, #ffee8d, #afd5e8, #f7ba77, #a5c697, #c5b5e5, #d1d392, #bbefd0, #e099cf | An ordinal scale used in the assign function for non-valid color strings and numbers. |
d3plus.colorAdd(c1, c2, [o1], [o2]) <>
Adds two colors together.
This is a global function.
| Param | Type | Default | Description |
|---|---|---|---|
| c1 | String |
The first color, a valid CSS color string. | |
| c2 | String |
The second color, also a valid CSS color string. | |
| [o1] | String |
1 |
Value from 0 to 1 of the first color's opacity. |
| [o2] | String |
1 |
Value from 0 to 1 of the first color's opacity. |
d3plus.colorAssign(c, [u]) <>
Assigns a color to a value using a predefined set of defaults.
This is a global function.
| Param | Type | Default | Description |
|---|---|---|---|
| c | String |
A valid CSS color string. | |
| [u] | Object |
defaults |
An object containing overrides of the default colors. |
d3plus.colorContrast(c, [u]) <>
A set of default color values used when assigning colors based on data.
This is a global function.
| Param | Type | Default | Description |
|---|---|---|---|
| c | String |
A valid CSS color string. | |
| [u] | Object |
defaults |
An object containing overrides of the default colors. |
d3plus.colorLegible(c) <>
Darkens a color so that it will appear legible on a white background.
This is a global function.
d3plus.colorLighter(c, [i]) <>
Similar to d3.color.brighter, except that this also reduces saturation so that colors don't appear neon.
This is a global function.
| Param | Type | Default | Description |
|---|---|---|---|
| c | String |
A valid CSS color string. | |
| [i] | String |
0.5 |
A value from 0 to 1 dictating the strength of the function. |
d3plus.colorSubtract(c1, c2, [o1], [o2]) <>
Subtracts one color from another.
This is a global function.
| Param | Type | Default | Description |
|---|---|---|---|
| c1 | String |
The base color, a valid CSS color string. | |
| c2 | String |
The color to remove from the base color, also a valid CSS color string. | |
| [o1] | String |
1 |
Value from 0 to 1 of the first color's opacity. |
| [o2] | String |
1 |
Value from 0 to 1 of the first color's opacity. |
colorDefaults <>
A set of default color values used when assigning colors based on data.
| Name | Default | Description |
|---|---|---|
| dark | #444444 | Used in the contrast function when the color given is very light. |
| light | #f7f7f7 | Used in the contrast function when the color given is very dark. |
| missing | #cccccc | Used in the assign function when the value passed is null or undefined. |
| off | #b22200 | Used in the assign function when the value passed is false. |
| on | #224f20 | Used in the assign function when the value passed is true. |
| scale | #b22200, #eace3f, #282f6b, #b35c1e, #224f20, #5f487c, #759143, #419391, #993c88, #e89c89, #ffee8d, #afd5e8, #f7ba77, #a5c697, #c5b5e5, #d1d392, #bbefd0, #e099cf | An ordinal scale used in the assign function for non-valid color strings and numbers. |
This is a global namespace.