[英]Error on label displaying on line plot with D3js
I have a two line plot with dots drown from a tsv file with D3js. 我有一个两线图,其点被D3js从tsv文件淹没。 I would like to show the labels near to the dots.
我想将标签显示在圆点附近。 The tsv file is not complete and some values are missing, as follows:
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
My code for displaying the first line, the dots and the labels is as follows (the same for second line): 我用于显示第一行,点和标签的代码如下(第二行相同):
// 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; });
The two lines and the dots are correctly displayed but the code returns the following error for the labels "Uncaught TypeError: Cannot read property 'text' of null". 正确显示了两行和点,但是代码为标签“未捕获的TypeError:无法读取属性'text'为null”返回了以下错误。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.