经过很多地方的大量修补和压缩代码,我设法产生了我想要的东西(解决了我最初问题的第 2 点)。
该代码可以在许多地方进行改进,并且可能会更优雅地完成,但我将其包含在下面以防它对其他人有所帮助。
sankeyPlot$setTemplate(
afterScript = "
<script>
var cscale = d3.scale.ordinal()
.domain(['N','E', 'G' ,'I','T','N ','E ', 'G ' ,'I ','T '])
.range(['#d3d3d3', '#32ca32', '#1f78b4', '#e31a1c','#ecd736','#d3d3d3', '#32ca32', '#1f78b4', '#e31a1c','#ecd736'])
d3.selectAll('#{{ chartId }} svg path.link')
.style('stroke', function(d){
return cscale(d.source.name);
//returns grey links
})
d3.selectAll('#{{ chartId }} svg .node rect')
.style('fill', function(d){
return cscale(d.name)
})
.style('stroke', 'none')
var text_box = d3.selectAll('#{{ chartId }}').append('svg')
.attr('width', 500)
.attr('height', 100)
var TextData = [
{ 'cx': 0, 'cy': 20 ,'label': 'Type A', 'pos': 'left'},
{ 'cx': 250, 'cy': 20,'label': 'Label','pos': 'middle'},
{ 'cx': 500, 'cy': 20, 'label': 'Type B','pos': 'end'}];
var text = text_box.selectAll('text')
.data(TextData)
.enter()
.append('text');
//Add the text attributes
var textLabels = text
.attr('x', function(d) { return d.cx; })
.attr('y', function(d) { return d.cy; })
.text( function (d) { return d.label ; })
.attr('text-anchor', function(d) { return d.pos ;})
.attr('font-family', 'sans-serif')
.attr('font-size', '14px')
.attr('fill', 'black');
</script>
")