I have been creating some charts using d3j, and I am trying to show fa- icon in the text, What I am doing is
svg.select('#g_axis').selectAll('text')
.data(dataset.slice(startSet, endSet))
.enter()
.append('text')
.attr('font-family', 'FontAwesome')
.attr('x', paddingLeft)
.attr('y', lineSpacing + dataHeight / 2)
.html(function (d) {
console.log(d.measure);
return d.measure + "<i class='red main-sidebar fa fa-chain-broken'></i>";
})
.attr('transform', function (d, i) {
return 'translate(0,' + ((lineSpacing + dataHeight) * i) + ')';
})
.attr('class', 'ytitle');
I tried to add font-family to fontAwesome as it was suggested in some stackoverflow answers,
and Added as
.html(function (d) {
console.log(d.measure);
return d.measure + "<i class='red main-sidebar fa fa-chain-broken'></i>";
})
Its returning only measure, but not icon which should be red, classes are available, when I inspect element, there is also text tag with i class but icon still not visible, In code above I append the fa icon with measure, Just to try it but basically am giving measure such value as
"abc <i class='red fa fa-chain-broken'></i>"..
When there was .text(function(d)) it was showing tag itself but after doing .html now its not showing the tag but not giving the expected output as well. Any help will be appreciated.
The question mentioned as duplicate is doing all text as a fa-icon, where I have a string and concatenating fa-icon with it.
