这是我的plunkr code,在传奇的这个位置位于中心,我如何将它放置在圆环图的右侧?
var svg = d3.select('#chart')
.append('svg')
.attr('width', width)
.attr('height', height)
.append('g')
.attr('transform', 'translate(' + (width / 2 - radius) +
',' + (height / 2 - radius) + ')');
我尝试使用上面的代码,但它无法正常工作。
答案 0 :(得分:1)
定义新变量并以像素为单位设置图例宽度:
var legendWidth = 150;
将此变量用于svg
元素宽度:
var svg = d3.select('#chart')
.append('svg')
.attr('width', width + legendWidth) // <== !!!
.attr('height', height)
.append('g')
.attr('transform', 'translate(' + (width / 2) +
',' + (height / 2) + ')');
以这种方式重写传奇transform
属性的功能:
var legend = svg.selectAll('.legend')
.data(color.domain())
.enter()
.append('g')
.attr('class', 'legend')
.attr('transform', function(d, i) {
var height = legendRectSize + legendSpacing;
var offset = height * color.domain().length / 2;
var vert = i * height - offset;
return 'translate(' + width / 2 + ',' + vert + ')'; // <== move every legend item on half of width
});
答案 1 :(得分:0)
结帐你的jsfiddle的this版本。我已经更正了一些计算,以显示右侧的图例。突出显示下面的代码更改。
var ids = Context.TableB
.Where(p => p.FieldD == conditionD)
.Select(p => p.FieldC);
var result = Context.TableA
.Where(p => ids.Contains(p.FieldB))
.ToList();