如何使用d3.js在折线图上的某个点上显示图标
我正在使用d3创建一个简单的折线图，但是我不想使用路径上的标准点，而是要显示一个非常棒的图标，例如’fa-arrow-up’。
我试过以下……
var setDirectionalPrediction = function(points){ points.each(function(){ var point = $(this); point.append(''); var image = point.children()[0]; $(image).addClass('fa fa-long-arrow-up'); }); } setDirectionalPrediction($('#rd-d3-graph path.nv-point')); 无济于事……任何想法？
在引擎盖下，FontAwesome和类似的库只是将其标签的CSS内容设置为其字体系列中的unicode字符。
如果你检查一个图标::before你会看到这样的事情：
.fa-camera-retro:before { content: "\f083"; }
在SVG中，这将等于：
将其转换为d3然后变为：
这是我给出的关于Highcharts的类似答案 。
请参阅此处的 d3.js示例。
var image = ;//image link
提供上面图片的链接
point.append("image") .attr("xlink:href", image) .attr("x", -12) .attr("y", -12) .attr("width", 24) .attr("height", 24) ;
确保给它属性：x / y，宽度/高度