just another inlet to tributary

inlet.js

var svg = d3.select('svg')
  .attr('width',1000)
  .attr('height',1000)
  
var g = svg.append('g')
		.attr('transform','translate('+77+','+100+')') 
      	.attr('width',1000)
  		.attr('height',1000)
  
var basic = g.append('text')
  	.text('with my')
  	.attr('font-size',200)
    .attr('font-weight','bold')
    .attr('stroke',"#000000")
    .attr('stroke-width',11)
    .attr('y',83)
    .attr('x',164)    
    .attr('fill',"#BBBBBB") 
    
var basic2 = g.append('text')
  	.text('sister in sf')
  	.attr('font-size',200)
    .attr('font-weight','bold')
    .attr('stroke',"#000000")
    .attr('stroke-width',11)
    .attr('y',249)
    .attr('fill',"#BBBBBB")     

var defs = d3.select('svg').append('defs')
    
var filter = defs.append('filter')
    			.attr('id','texty')
    			.attr('width',2.1)
        		.attr('height',2.6)

var iterations = 27;
var step_size = 2.04389;

var startoffet = 0;
var toogle  = 1;

for(var i = 0; i < iterations;i++){ 

  filter.append('feOffset')
  	.attr('dx', 1)
  	.attr('dy', 5*(20.5*Math.pow((i)*2),0.5))
  	.attr('result','ctt'+i)
    console.log('Sin',(55),(i*0.2))
  startoffet = startoffet+step_size;
  
   // toogle = toogle *-1;
filter.append('feFlood')
  
  .attr('flood-color','rgba('+(i*6)+','+13+','+36+','+7+')')
  .attr('flood-opacity',1)
  .attr('result',"cFT"+i)

filter.append('feComposite')
  .attr('operator','in')
    .attr('in1',"cFT"+i)
    .attr('in2','ctt'+i)
  .attr('result','cCH'+i)

}  

console.log('ff', startoffet)

 filter.append('feOffset')
  	.attr('dx', -20)
  	.attr('dy', -20)
  	.attr('result','cttx')
    
   // toogle = toogle *-1;
filter.append('feFlood')
  .attr('flood-color','red')
  .attr('result',"cFTx")

filter.append('feComposite')
  .attr('operator','in')
    .attr('in1',"cFTx")
    .attr('in2','cttx')
  .attr('result','cCHx')

var merge = filter.append('feMerge')
    
for(var i = (iterations-1); i >= 0;i--){ 
	merge.append('feMergeNode').attr('in','cCH'+i)
} 
filter.append('feComposite')
  .attr('operator','in')
    .attr('in1',"cFTx")
    .attr('in2','cttx')
    .attr('result','cCHx')
  
 var filter_elem2 = filter.append('feTurbulence')
            .attr('result','result7')
            .attr('id','fe2')
            .attr('seed',0)
            .attr('type','turbulence')
            .attr('numOctaves',3)
            .attr('baseFrequency',0.1)
     
var filter_elem5 = filter.append('feDisplacementMap')
         .attr('result','result4')
         .attr('in','SourceGraphic')
         .attr('in2','result7')
         .attr('xChannelSelector','A')
         .attr('yChannelSelector','B')
         .attr('scale',14)   
    

    
//merge.append('feMergeNode').attr('in','cCHx')
    
    
merge.append('feMergeNode').attr('in','SourceGraphic')
  
basic.attr('filter','url(#texty)')
basic2.attr('filter','url(#texty)')