Lightning Design Systemで用意されている各コンポーネントではアイコンの表示などでsvgタグとuseタグ利用されていますが、通常VisualforceやLightningの開発ではsvgタグと一緒に利用されるuseタグが宣言できないようになっています。
ずっとそういうものなのかなと思っていたのですが、Lightning Design Systemの使い方を調べてみるとVisualforce開発ではhtmlタグで次のように宣言することで利用できるという記載がありました。
<html xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
Visualforce開発で上手くいったのでLightningの開発でも同じようにできると思ったのですが、Lightningの方ではこの方法は利用できませんでした。
さてどうしたものかと調べてみると、Lightningの場合、<![CDATA[ ... ]]>の宣言とRenderer.jsを使って対応できるみたいです。
Lightning Component
Renderer.js
Helper.js
SVGを使う度にRenderer.jsで頑張って変換する必要があったので、けっこう大変でしたがひとまずこの方法で利用できるようになりました。(もしかするともっと簡単な方法があるのかも...)
