SVG Path Element

_.md

[ Launch: SVG Path Element ] 4737246 by roundrobin
[ Launch: Bootstrap Trib ] 4711978 by roundrobin
[ Launch: Tributary inlet ] 4711690 by roundrobin

config.json

{"description":"SVG Path Element","endpoint":"","display":"svg","public":true,"require":[{"name":"Helpers","url":"https://raw.github.com/roundrobin/svg-path-generator/master/svg-path-generator.js"}],"fileconfigs":{"inlet.js":{"default":true,"vim":false,"emacs":false,"fontSize":12},"_.md":{"default":true,"vim":false,"emacs":false,"fontSize":12},"config.json":{"default":true,"vim":false,"emacs":false,"fontSize":12}},"fullscreen":false,"play":false,"loop":false,"restart":false,"autoinit":true,"pause":true,"loop_type":"period","bv":false,"nclones":15,"clone_opacity":0.4,"duration":3000,"ease":"linear","dt":0.01}

inlet.js

var svg = d3.select("svg");
var pattern_size = 125;
var w1 = pattern_size/2;
var defs = d3.select('svg').append('defs')
var pattern = defs.append('pattern')
    .attr('id','pattern1')
    .attr('pattermTransform','')
    .attr('height',pattern_size)
    .attr('width',pattern_size)
    .attr('patternUnits','userSpaceOnUse')


//Uses the svg-path-generator class
//https://github.com/roundrobin/svg-path-generator
var path = new Path(pattern)
path.el().attr({fill:'#535C77','stroke':'none'})

path.add(['m',0,0]);
path.add(['l',w1,w1]);
path.add(['l',-w1,0]);
path.add(['z']);

path.render();
var path = new Path(pattern)
path.el().attr({fill:'#07A76D','stroke':'none'})

path.add(['m',w1,w1]);
path.add(['l',w1,w1]);
path.add(['l',-w1,0]);
path.add(['z']);

path.render();

var path = new Path(pattern)
path.el().attr({fill:'#6C9FCF','stroke':'none'})

path.add(['m',0,w1]);
path.add(['l',w1,w1]);
path.add(['l',-w1,0]);
path.add(['z']);
path.render();





path.hidePoints()

d3.select('svg').append('rect')
        .attr('height',tributary.sh)
      .attr('width',tributary.sw)
  	  .attr('fill','url(#pattern1)')