mirror of
https://github.com/Jermolene/TiddlyWiki5
synced 2025-02-10 16:10:02 +00:00
Add colour-interpolate operator
This commit is contained in:
parent
ae1d9f5b86
commit
c1e36a1e5f
@ -52,6 +52,25 @@ exports["colour-contrast"] = makeParallelColourOperator(function (colours, opera
|
||||
return colourContrasts;
|
||||
});
|
||||
|
||||
exports["colour-interpolate"] = makeParallelColourOperator(function (colours, operator, options) {
|
||||
// Special case for less than two colours
|
||||
if(colours.length < 2) {
|
||||
return [];
|
||||
}
|
||||
// Step through the indexes collecting the interpolated colours
|
||||
var space = ((operator.suffixes || [])[0] || ["srgb"])[0],
|
||||
rangefn = colours[0].range(colours[1],{space: space}),
|
||||
outputColours = [];
|
||||
$tw.utils.each(operator.operands,function(operand) {
|
||||
// Get the index
|
||||
var index = $tw.utils.parseNumber(operand);
|
||||
// Calculate the interpolated colour
|
||||
var colour = rangefn(index);
|
||||
outputColours.push(colour.display().toString());
|
||||
});
|
||||
return outputColours;
|
||||
});
|
||||
|
||||
function makeSerialColourOperator(fn) {
|
||||
return function (source, operator, options) {
|
||||
var results = [];
|
||||
|
@ -0,0 +1,19 @@
|
||||
title: Operators/Colour/ColourInterpolate
|
||||
description: colour-interpolate function
|
||||
type: text/vnd.tiddlywiki-multiple
|
||||
tags: [[$:/tags/wiki-test-spec]]
|
||||
|
||||
title: Output
|
||||
|
||||
\parsermode inline
|
||||
<$text text={{{ [subfilter{Filter}] }}}/>
|
||||
+
|
||||
title: Filter
|
||||
|
||||
=[[#5778d8]]
|
||||
=[[#d85757]]
|
||||
+[colour-interpolate:oklch[0.2],[0.5],[0.99]join[,]]
|
||||
+
|
||||
title: ExpectedResult
|
||||
|
||||
oklch(60.08% 0.15344 290.55),oklch(60.956% 0.15699 325.23),oklch(62.386% 0.1628 381.88)
|
33
editions/tw5.com/tiddlers/filters/colour-interpolate.tid
Normal file
33
editions/tw5.com/tiddlers/filters/colour-interpolate.tid
Normal file
@ -0,0 +1,33 @@
|
||||
created: 20241117161528913
|
||||
modified: 20241117161528913
|
||||
tags: [[Filter Operators]] [[Colour Operators]]
|
||||
title: colour-interpolate Operator
|
||||
caption: colour-interpolate
|
||||
op-purpose: smoothly interpolate between a set of colours
|
||||
op-input: a selection of colour values
|
||||
op-suffix: the name of the colour space to be used for the interpolation such as "OkLCh" or "sRGB"
|
||||
op-parameter: one or more indexes where 0 is the first colour and 1 is the last colour and intermediate values are smoothly interpolated
|
||||
op-output: the values of the interpolated colours
|
||||
|
||||
<<.from-version "5.3.7">> See [[Colour Palettes]] for background.
|
||||
|
||||
The <<.op colour-interpolate>> operator is used to interpolate colour values in a chosen colour space.
|
||||
|
||||
The full list of colour spaces that can be used for interpolation is given in [[Colour Spaces]].
|
||||
|
||||
Note that at least two input colours must be provided for interpolation to occur.
|
||||
|
||||
Note that indexes outside the range 0 to 1 will extrapolate from the provided colour values.
|
||||
|
||||
For example, this filter expression will return 4 colours that smoothly blend from red to green in the OKLCH colour space:
|
||||
|
||||
```
|
||||
red green +[colour-interpolate:oklch[0],[0.333],[0.666],[1]]
|
||||
```
|
||||
|
||||
See also the following related operators:
|
||||
|
||||
* <<.olink colour-get-oklch>> to retrieve a component of a colour value in the OKLCH colour space
|
||||
* <<.olink colour-lighten>> to lighten a colour value
|
||||
* <<.olink colour-darken>> to lighten a colour value
|
||||
|
Loading…
x
Reference in New Issue
Block a user