インジケーターを構成するときに、デフォルトではエレメントに含まれないスケーラブル ベクター グラフィックス (SVG) アイコンを使用するためのオプションがあります。この機能を使用して、ダッシュボードを業種固有の要件や、組織のコーポレート ブランディングの外観と操作性に合わせることができます。SVG フォーマットは、XML ベースのベクター画像フォーマットです。アイコンは、任意のテキスト エディターで作成するか、ドローイング ソフトウェアを使用して作成できます。実行時に、カスタム アイコンは、インジケーター内の中央のテキスト コンテンツと同じ高さに拡大/縮小されます。
以下の例は、3 つの矢印の反時計回りのシリーズとして表示される SVG コンテンツを示しています。この SVG コンテンツを使用して、進行中の作業を示すことができます。
次の SVG コードをコピーして、[アイコンの選択] 画面内の [カスタム] の下にある空のボックスに貼り付け、この機能を試してみることができます。<?xml version="1.0" encoding="UTF-8"?>
<svg xmlns="http://www.w3.org/2000/svg" id="icons">
<path d="M13.91 9a6.003 6.003 0 0 1-5.658 4.987l-.347-1.992c.032.001.063.005.095.005a3.996 3.996 0 0 0 3.858-3h-1.749l2.75-3.912L15.61 9zm-8.668 1.877l-.002.002a3.945 3.945 0 0 1-.688-4.884l-1.809-.848a5.923 5.923 0 0 0 1.08 7.148L2.59 13.529l4.71.822-.82-4.711zm1.425-6.576l-.011-.067a3.97 3.97 0 0 1 4.575 1.43l1.194-1.697a5.941 5.941 0 0 0-6.119-1.718L6.018.607 2.64 3.994l4.33 2.03z" />
</svg>
次の図は、カスタム アイコンを使用してインジケーターをどのように表示できるかを示しています。
独自のアイコンを作成するときに、次のヒントが役立つことがあります。
- SVG アイコンでストロークまたは塗りつぶしを定義しない場合、ダッシュボードでインジケーターを作成するときに、それらのアイテムを調整できます。
- アイコンでストロークを定義しない場合、構成時にストロークを追加できます。ストロークは 1 ピクセルになります。
- SVG フォーマットでの描画は動的かつ対話的ですが、スクリプトベースのアニメーションはサポートされておらず、除去されます。