d3-plugin-captain-sankey icon indicating copy to clipboard operation
d3-plugin-captain-sankey copied to clipboard

marker-end causes path to bunch up

Open eformx opened this issue 9 years ago • 0 comments

I added a marker:

//marker-end of path svg.append('marker') .attr('id', "end-arrow") .attr('markerHeight', 2.5) .attr('markerWidth', 2, 5) .attr('orient', 'auto') .attr('refX', -5) .attr('refY', 0) .attr('viewBox', '-5 -5 20 10') .append('path') .attr('d', 'M 0,0 m -5,-5 L 0,0 L -5,5 Z') .style("fill", "#969696");

And then here: // Enter + Update links.attr('d', path) .style("marker-end", "url(#end-arrow)") .style("stroke-width", function (d) { return Math.max(1, d.dy); });

And a slight mod to sankey.js for some room to draw the arrow at the end of the path:

function link(d) { var xs = d.source.x + d.source.dx, //added the following to shrink the path so there is room for the arrow; //however path bunches up in cycle demo, is there a way to smooth out the path a bit xt = d.target.x - (d.dy / 2), //xt = d.target.x,

Is there a way to smooth out the path a bit so that it doesn't bunch up as shown in the png.

image

eformx avatar Oct 21 '15 04:10 eformx