目前,我正在研究d3js饼图。 我希望饼图具有响应线标签。 任何人都可以指导我如何实现它。 这就是我尝试过的。 但是如果值较小,则标签会重叠,如下面的链接所示。 小提琴 ...
提示:本站收集StackOverFlow近2千万问答,支持中英文搜索,鼠标放在语句上弹窗显示对应的参考中文或英文, 本站还提供 中文繁体 英文版本 中英对照 版本,有任何建议请联系yoyou2525@163.com。
我有一个两线图,其点被D3js从tsv文件淹没。 我想将标签显示在圆点附近。 tsv文件不完整,缺少一些值,如下所示:
year value1 value2
....
2000 8956355
2001 8924704
2002 8865723
2003 8747717
2004 8701521
2004 8701521
2005 11380809
2006 10672554
2007 8513818 10394369
2008 8462607 10297716
2009 8448535 9998783
2010 8411177 9988697
2011 8024205 9491908
2012 7920080 8725402
2013 7911208 8668111
2014 7807984 8274928
2015 7747598 8027083
2016 7575879 7779103
我用于显示第一行,点和标签的代码如下(第二行相同):
// line1
fw1.append("path")
.datum(data)
.attr("class", "line")
.attr("fill", "none")
.attr("stroke", "#004494")
.attr("stroke-linejoin", "round")
.attr("stroke-linecap", "round")
.attr("stroke-width", 1.5)
.attr("d", line1);
// dots for line1
fw1.selectAll(".dot")
.data(data)
.enter()
.append("circle")
.attr("class", "dot")
.style("stroke", "#004494")
.attr("cx", function(d) { return x1(d.year); })
.attr("cy", function(d) { return y1(d.value1); })
.attr("r", 3.5)
fw1.append("g")
.classed('labels-group', true)
.selectAll('text')
.data(data)
.enter()
.append('text')
.classed('textlbl', true)
.attr({ 'x': function(d) { return x1(d.year);},
'y': function(d) { return y1(d.value1);}
})
.text(function(d) { return d.value1 = (d.value1==="") ? null : +d.value1; });
正确显示了两行和点,但是代码为标签“未捕获的TypeError:无法读取属性'text'为null”返回了以下错误。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.