Anyone by chance have any luck implementing fontawesome pro icons in a diagram? I was shown how to use the fontawesome free library icons like this:
g.append(new dataviz.diagram.TextBlock({ text: String.fromCharCode(0xf005) + " " + dataItem.firstName + " " + dataItem.lastName, x: 85, y: 20, fill: "#fff", fontFamily: "FontAwesome"}));... but this doesn't work:
g.append(new dataviz.diagram.TextBlock({ text: String.fromCharCode(0xf82c) + " " + dataItem.firstName + " " + dataItem.lastName, x: 85, y: 20, fill: "#fff", fontFamily: "FontAwesome"}));FontAwesome Icon Cheatsheet: https://fontawesome.com/cheatsheet/pro/regular
2 Answers, 1 is accepted
Hello Mark,
I believe this is the solution to use the Font Awesome 5 Pro.
To use the font, it makes sense to embed it like follows, just like embedding FontAwesome:
fontFamily: "Font Awesome 5 Pro";However, when the font name string contains space characters, the CSS parser requires it to be wrapped in quotes. So the inner string (between the double quotes) must be wrapped in another set of quotes, this time a single quote ( ' ):
fontFamily: "'Font Awesome 5 Pro'";This sends a correctly formatted string, and the CSS can parse it properly.
Please test this solution and let me know if implemented successfully or if any further questions arise.
Regards,
George Gindev
Progress Telerik
Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer, and each of you can get a $50 Amazon gift voucher.
Rank 1
Veteran