filter-feComponentTransfer.Rmd

---
title: "feComponentTransfer"
output:
  html_document:
    toc: true
    theme: united
---


```{r, echo=FALSE}
stopifnot(require(svgR, quietly=TRUE))
```


## feComponentTransfer

Colors can also be remapped using feComponentTransfer and the components feFuncR, feFuncG, feFuncB, feFuncA. The feFuncX's correspond to the 
Red, Green, Blue, and Alpha channels. Each channel has a value between between 0 and 1 which can be reassinged using the component transfers. 
There are four types of color component transfers:

- **table**: Reassigns the colors according to a piece-wise continous linear function that is specified by a "table"" values of points. The points are assumend to form a uniform partion of [0,1] so only the values need to be specified. (Using linear interpolation of the values between the points) 
- **linear** Similar to table, but with only 2 points. The function is specifed using the slope and intercept
- **discrete** Reassigns the colors according to a step function that is specified by a "table"" of points. Again the points are assumed to be a uniform partition of [0,1], so only the values need be specified in the "table"." (Between points, the output is the value of the nearest point.
- **gamma** The value is given by
$C_{out} = \alpha \times C_{in}^\gamma + \beta$

####  feComponentTransfer: Table
We illustrate this with a simple example that interchanges the colors blue and red of a color spectrum.

```{r, echo=T, results="asis"}
WH=c(800, 200) # window rect
colors=c('red','blue')
svgR( wh=WH, stroke="black",
  rect(wh=c(.6,.3)*WH, xy=c(.2,0)*WH, 
       fill=linearGradient(colors=colors)
  ),
  rect(wh=c(.6,.3)*WH, xy=c(.2,.3)*WH, 
       fill=linearGradient(colors=colors),
       filter=filter( 
          feComponentTransfer( 
              feFuncR( type="table", tableValues="1 0"),
              feFuncB( type="table", tableValues="1 0 ")
          )
        )
  ),
  text('original', xy=c(20,1.5*WH[2])),
  text('transfered', xy=c(20,4.5*WH[2])),
  text('feComponentTransfer using type="table"', cxy=c(.5,.8)*WH)
)
```


#### feComponentTransfer: Linear

```{r, echo=T, results="asis"}
WH=c(800, 200) # window rect
colors=c('red','blue')
svgR( wh=WH, stroke="black",
  rect(wh=c(.6,.3)*WH, xy=c(.2,0)*WH, 
       fill=linearGradient(colors=colors)
  ),
  rect(wh=c(.6,.3)*WH, xy=c(.2,.3)*WH, 
       fill=linearGradient(colors=colors),
       filter=filter( 
          feComponentTransfer( 
              feFuncR( type="linear", intercept=1, slope=-1),
              feFuncB( type="linear", intercept=1, slope=-1)
          )
        )
  ),
  text('original', xy=c(20,1.5*WH[2])),
  text('transfered', xy=c(20,4.5*WH[2])),
  text('feComponentTransfer using type="linear"', cxy=c(.5,.8)*WH)
)
```


#### feComponentTransfer: Discrete

```{r, echo=T, results="asis"}
WH=c(800, 200) # window rect
colors=c('red','blue')
svgR( wh=WH, stroke="black",
  rect(wh=c(.6,.3)*WH, xy=c(.2,0)*WH, 
       fill=linearGradient(colors=colors)
  ),
  rect(wh=c(.6,.3)*WH, xy=c(.2,.3)*WH, 
       fill=linearGradient(colors=colors),
       filter=filter( 
          feComponentTransfer( 
              feFuncR( type="discrete", tableValues="1 0"),
              feFuncB( type="discrete", tableValues="1 0 ")
          )
        )
  ),
  text('original', xy=c(20,1.5*WH[2])),
  text('transfered', xy=c(20,4.5*WH[2])),
  text('feComponentTransfer using type="discrete"', cxy=c(.5,.8)*WH)
)
```


#### feComponentTransfer: Gamma exponent=1

```{r, echo=T, results="asis"}
WH=c(800, 200) # window rect
colors=c('red','blue')
svgR( wh=WH, stroke="black",
  rect(wh=c(.6,.3)*WH, xy=c(.2,0)*WH, 
       fill=linearGradient(colors=colors)
  ),
  rect(wh=c(.6,.3)*WH, xy=c(.2,.3)*WH, 
       fill=linearGradient(colors=colors),
       filter=filter( 
          feComponentTransfer( 
              feFuncR( type="gamma", offset=1, amplitude=-1, exponent=1),
              feFuncB( type="gamma", offset=1, amplitude=-1, exponent=1)
          )
        )
  ),
  text('original', xy=c(20,1.5*WH[2])),
  text('transfered', xy=c(20,4.5*WH[2])),
  text('feComponentTransfer using type="gamma"', cxy=c(.5,.8)*WH)
)
```


#### feComponentTransfer: Gamma, exponent=10

```{r, echo=T, results="asis"}
WH=c(800, 200) # window rect
colors=c('red','blue')
svgR( wh=WH, stroke="black",
  rect(wh=c(.6,.3)*WH, xy=c(.2,0)*WH, 
       fill=linearGradient(colors=colors)
  ),
  rect(wh=c(.6,.3)*WH, xy=c(.2,.3)*WH, 
       fill=linearGradient(colors=colors),
       filter=filter( 
          feComponentTransfer( 
              feFuncR( type="gamma", offset=1, amplitude=-1, exponent=2),
              feFuncB( type="gamma", offset=1, amplitude=-1, exponent=2)
          )
        )
  ),
  text('original', xy=c(20,1.5*WH[2])),
  text('transfered', xy=c(20,4.5*WH[2])),
  text('feComponentTransfer using type="table"', cxy=c(.5,.8)*WH)
)
```


###feComponentTransfer: Inverting the grey scale

```{r, echo=T, results="asis"}
WH=c(800, 200) # window rect
colors=c('red','blue')
svgR( wh=WH, stroke="black",
  rect(wh=c(.6,.3)*WH, xy=c(.2,0)*WH, 
       fill=linearGradient(colors=colors)
  ),
  rect(wh=c(.6,.3)*WH, xy=c(.2,.3)*WH, 
       fill=linearGradient(colors=colors),
       filter=filter( 
          feComponentTransfer( 
              feFuncR( type="table", tableValues="1 0"),
              feFuncG( type="table", tableValues="1 0"),
              feFuncB( type="table", tableValues="1 0 ")
          )
        )
  ),
  text('original', xy=c(20,1.5*WH[2])),
  text('transfered', xy=c(20,4.5*WH[2])),
  text('feComponentTransfer using type="table"', cxy=c(.5,.8)*WH)
)
```

####  feComponentTransfer Applied to a Spectrum


```{r, echo=T, results="asis"}
WH=c(800, 100) # window rect
svgR( wh=WH,
    lapply(seq(from=1, to=0, by=-.05),
      function(i){
        rect(xy=c(i*800,10), wh=c(32,96), fill=
          linearGradient( xy1=c(0,0), xy2=c(0,1),
            colors=c('red','yellow','green','blue')
          ),
            filter=filter( 
             feComponentTransfer(
               feFuncR(type="linear", slope=i, intercept=1-i),
               feFuncG(type="linear", slope=1, intercept=0),
               feFuncB(type="linear", slope=1-i, intercept=i),
               feFuncA(type="linear", slope=0, intercept=1)
             )
          )
        ) 
      }
    )
)
```