Add gradient feature. #164
Conversation
Methods for two color models: gradientRGB and gradientHSL. The gradientHSL supports clokwise and counterclokwise hue rotations.
|
What's the point of this? Why not use |
|
To do a gradient, mix is more computationally costly. |
|
The Travis errors are not related to my patch... Node 0.12 still a valid target? |
There was a problem hiding this comment.
Note that some of the above below (github keeps changing) comments apply to both functions.
I did a benchmark and the gradient function is indeed faster for steps >= 4.
const Color = require('./color');
const benchmark = require('benchmark');
const srcColor = new Color('#FF0000');
const destColor = new Color('#00FF00');
new benchmark.Suite()
.add('mix3', function () {
const gradient = [
srcColor,
srcColor.mix(destColor, 0.5),
destColor
];
})
.add('grad3', function () {
const gradient = srcColor.gradientRGB(destColor, 3);
})
.on('cycle', function(event) {
console.log(String(event.target));
})
.on('complete', function() {
console.log('Fastest is ' + this.filter('fastest').map('name'));
})
.run({ 'async': true });
new benchmark.Suite()
.add('mix4', function () {
const gradient = [
srcColor,
srcColor.mix(destColor, 0.33),
srcColor.mix(destColor, 0.66),
destColor
];
})
.add('grad4', function () {
const gradient = srcColor.gradientRGB(destColor, 4);
})
.on('cycle', function(event) {
console.log(String(event.target));
})
.on('complete', function() {
console.log('Fastest is ' + this.filter('fastest').map('name'));
})
.run({ 'async': true });
new benchmark.Suite()
.add('mix5', function () {
const gradient = [
srcColor,
srcColor.mix(destColor, 0.25),
srcColor.mix(destColor, 0.5),
srcColor.mix(destColor, 0.75),
destColor
];
})
.add('grad5', function () {
const gradient = srcColor.gradientRGB(destColor, 5);
})
.on('cycle', function(event) {
console.log(String(event.target));
})
.on('complete', function() {
console.log('Fastest is ' + this.filter('fastest').map('name'));
})
.run({ 'async': true });
No, don't worry about CI. I'll let you know if there are any actionable items. This package needs to be refreshed sometime soon anyway - 0.12 will be removed, but not before this PR is merged unfortunately. |
* Do not require ECMA6. * Do not round channel values. * Do not compute small and obivious gradients.
|
Hi @Qix-, is this ok? Do you need any help with this repo? |
|
See https://github.com/Qix-/color/pull/158#issuecomment-558352861 on why changes take forever for me to merge. |
|
There is a channel where you share your thoughts about this? A page at @Qix-/color/wiki maybe? |
Methods for two color models: gradientRGB and gradientHSL.
The gradientHSL supports clokwise and counterclokwise hue rotations.