Bindu-san,
I translated KBA235750 into Japanese.
We would appreciate it if you could confirm.
Regards,
Masashi
/***************************************************************************/
バージョン : **
この KBA では、ベクターグラフィックファイル (SVG) を TRAVEO™ T2G クラスタデバイスのグラフィックドライバで使用できるヘッダーファイルに変換するために使用されるツールを提供および説明します。
1 ベクターグラフィックファイル
ベクターグラフィックスは、円、多角形、テキスト、線、曲線などの幾何学的形状で表される画像です。画像は、位置、ベジエ曲線や四角形などの機能、および色を指定して作成されます。これらは、表示される各ピクセルの色を表すラスターグラフィックスとは本質的に異なります。ベクターグラフィックスの利点の 1 つは、解像度に依存しないレンダリングであり、スケーリングに関係なく鮮明な画像を提供します。
図 1 は、拡大された低解像度のラスターグラフィックのシャープネスを左側とベクターグラフィックの右側で比較しています。
図 1 異なるアプローチでスケーリングされた 2 つの画像。左側がラスターグラフィック、右側がベクターグラフィックです。後者は前者よりシャープです。
ベクターグラフィックスに使用される一般的なファイル形式は、EPS、PDF、および SVG です。
1.1 SVGファイル形式
SVG ファイルは XML で記述されているため、通常のテキストエディタで読み取ることができます。 SVG 1.1 仕様では、14 の機能が定義されています :
- Move To、Line To、Cubic Curve、およびその他のコマンドでエンコードされたパス
- 丸や四角などの基本的な形
- テキスト
- 色
図 2 は、単純なベクターパスとそのコードを示しています。 このテキストを SVG ファイルとして保存し、最新のブラウザで表示できます。
図 2 複数の 3 次ベジエ曲線で構成される単純な塗りつぶしパス
<svg width="800" height="480" viewBox="0 0 800 480" xmlns="http://www.w3.org/2000/svg">
<path style="fill:#0000ff;fill-opacity:1;stroke:none;stroke-width:1.54356px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
d="M 55,230 C 55,120 250,290 250,120 C 530,10 720,10 720,120 C 720,340 530,340 310,440 C 180,490 470,290 55,230 Z"/>
</svg>
2 TRAVEO™ T2Gクラスタ シリーズのベクターグラフィックス
TRAVEO™ T2Gクラスタシリーズ (T2G-C) デバイスには、ベクターグラフィックスを表示できる描画エンジンを含むグラフィックアクセラレータが含まれています。グラフィックスドライバでは、ベクター グラフィックを描画するために、色、パス配列、およびコマンド配列を定義する必要があります。さらに、さまざまなユーティリティ関数を使用して、単純な形状やより複雑な形状を描画できます。utDraw.h ファイルを参照してください。次のコードを使用して、図 2 に示す例を TRAVEO™ T2G グラフィックス ドライバで描画します。
CYGFX_U08 PathSegments[] = {CYGFX_DE_INSTR_MOVE_TO_ABS, CYGFX_DE_INSTR_CUBIC_TO_ABS, CYGFX_DE_INSTR_CUBIC_TO_ABS, CYGFX_DE_INSTR_CUBIC_TO_ABS,
CYGFX_DE_INSTR_CUBIC_TO_ABS, CYGFX_DE_INSTR_CLOSE_PATH};
CYGFX_FLOAT PathData[] = {55,230, 55,120,250,290,250,120, 530,10,720,10,720,120, 720,340,530,340,310,440, 180,490,470,290,55,230};
CYGFX_U32 noInstr = sizeof(PathSegments)/sizeof(CYGFX_U08);
CyGfx_BeSetSurfAttribute(ctx, CYGFX_BE_TARGET_SRC, CYGFX_BE_SURF_ATTR_COLOR, CYGFX_SM_COLOR_TO_RGBA(0, 0, 255, 255));
CyGfx_DeSetAttribute(ctx, CYGFX_DE_ATTR_DATA_FORMAT, CYGFX_DE_DATA_FORMAT_FLOAT);
CyGfx_DeAppendPathData(ctx, noInstr, PathSegments, PathData);
CyGfx_DeDraw(ctx, 0, 0);
パスを描画するソース サーフェスの正しい属性 (CyGfx_BeSetSurfAttribute()) を設定することにより、コマンド (PathSegments[])、座標 (PathData[])、および色を指定します。ソース サーフェスに何もバインドされていないことを確認してください。それ以外の場合は、バインドされたサーフェスのカラー値がカラーとして使用されます。
さらに、CyGfx_DeSetAttribute() を介して座標の形式を指定し、次に CyGfx_DeAppendPathData() を呼び出してパスバッファを埋める必要があります。パスバッファは事前に初期化する必要があります。 描画エンジンが使用するため、必ずアルファバッファを作成してください。CyGfx_DeDraw() を呼び出すと、バッファ内のすべてのパスデータが設定された宛先サーフェスに描画されます。
グラフィックスドライバに SVG ファイルを直接含めたり、ロードしたり、表示したりすることはできません。 TRAVEO™ T2G コードスニペットを SVG ファイルと比較すると、命令とパス データが類似していることが分かります。 SVG ファイルを使用できるようにするために、この KBA には実験的なコマンドラインツールが用意されています。このツールは、SVG ファイルを TRAVEO™ T2G グラフィックス ドライバで読み取ることができる配列データに変換します。
3 SVG から T2G への CLI ツール
注釈 : CLI ツールは現状のまま提供され、正当性およびサポートの保証はありません。 これはオープンソースであり、Windows 用の実行可能バージョンが含まれています。 ツールに含まれている Visual Studio プロジェクトと CMake ファイルを使用して、自分でビルドできます。
コマンド ラインからツールを呼び出し、変換する SVG ファイルのパスを指定します。
たとえば、作業ディレクトリがツールのパスと同じである場合、同じディレクトリにある sample.svg というファイルを変換するには、コードリスト 1 のコマンドを使用します。
コードリスト 1
SVG-2-T2G sample.svg
コードリスト 2に示すように、sample_svg.h というヘッダー ファイルが、配列 (pathData[]) と構造体 (tsPathData) で作成されます。このファイルには、グラフィックス ドライバーに必要なすべてのデータが含まれており、コードに含めることができます。
コードリスト 2
typedef struct {
CYGFX_U32 fillColor;
CYGFX_U32 numSegments;
const CYGFX_U08 *pPathSegments;
const CYGFX_FLOAT *pPathData;
} tsPathData;
コードリスト 3に示すように、pathData[] のすべての要素をループし、描画エンジンを介してレンダリングして、グラフィックス ドライバでこれを正しく表示します。これは、次の方法で行うことができます :
コードリスト 3
CyGfx_BeBindSurface(ctx, CYGFX_BE_TARGET_SRC, NULL);
for (int i = 0; i < sizeof(pathData)/sizeof(tsPathData); ++i)
{
CyGfx_BeSetSurfAttribute(ctx, CYGFX_BE_TARGET_SRC, CYGFX_BE_SURF_ATTR_COLOR, pathData[i].fillColor);
CyGfx_DeAppendPathData(ctx, pathData[i].numSegments, pathData[i].pPathSegments, pathData[i].pPathData);
CyGfx_DeDraw(ctx, 0, 0);
}
ソース サーフェスに何もバインドされていないことを確認します。 それ以外の場合、描画エンジンは、指定された色からではなく、バインドされたサーフェスから色の値を取得します。 ループの後に CyGfx_DeDraw() コマンドを呼び出すことができますが、この場合、パスバッファは十分な大きさでなければなりません。
一方、各ステップの後にループで呼び出すと、アーティファクトが目に見える可能性があります。 したがって、使用可能なメモリと目的の結果に応じて、この関数を呼び出す方法を選択する必要があります。
描画エンジンはアウトライン化をサポートしていませんが、ツールはアウトライン化を実現するための適切なパスを提供しようとします。 これは特に複雑なグラフィックスの場合に失敗する可能性があり、アーティファクトが表示される原因になります。 より単純なグラフィックまたはアウトラインを含まないグラフィックは、ツールで問題なく動作するはずです。 いずれの場合も、このツールは十分にテストされておらず、機能は保証されていません。
Bindu-san,
I translated KBA235750 into Japanese.
We would appreciate it if you could confirm.
Regards,
Masashi
/***************************************************************************/
バージョン : **
この KBA では、ベクターグラフィックファイル (SVG) を TRAVEO™ T2G クラスタデバイスのグラフィックドライバで使用できるヘッダーファイルに変換するために使用されるツールを提供および説明します。
1 ベクターグラフィックファイル
ベクターグラフィックスは、円、多角形、テキスト、線、曲線などの幾何学的形状で表される画像です。画像は、位置、ベジエ曲線や四角形などの機能、および色を指定して作成されます。これらは、表示される各ピクセルの色を表すラスターグラフィックスとは本質的に異なります。ベクターグラフィックスの利点の 1 つは、解像度に依存しないレンダリングであり、スケーリングに関係なく鮮明な画像を提供します。
図 1 は、拡大された低解像度のラスターグラフィックのシャープネスを左側とベクターグラフィックの右側で比較しています。
図 1 異なるアプローチでスケーリングされた 2 つの画像。左側がラスターグラフィック、右側がベクターグラフィックです。後者は前者よりシャープです。
ベクターグラフィックスに使用される一般的なファイル形式は、EPS、PDF、および SVG です。
1.1 SVGファイル形式
SVG ファイルは XML で記述されているため、通常のテキストエディタで読み取ることができます。 SVG 1.1 仕様では、14 の機能が定義されています :
- Move To、Line To、Cubic Curve、およびその他のコマンドでエンコードされたパス
- 丸や四角などの基本的な形
- テキスト
- 色
図 2 は、単純なベクターパスとそのコードを示しています。 このテキストを SVG ファイルとして保存し、最新のブラウザで表示できます。
図 2 複数の 3 次ベジエ曲線で構成される単純な塗りつぶしパス
<svg width="800" height="480" viewBox="0 0 800 480" xmlns="http://www.w3.org/2000/svg">
<path style="fill:#0000ff;fill-opacity:1;stroke:none;stroke-width:1.54356px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
d="M 55,230 C 55,120 250,290 250,120 C 530,10 720,10 720,120 C 720,340 530,340 310,440 C 180,490 470,290 55,230 Z"/>
</svg>
2 TRAVEO™ T2Gクラスタ シリーズのベクターグラフィックス
TRAVEO™ T2Gクラスタシリーズ (T2G-C) デバイスには、ベクターグラフィックスを表示できる描画エンジンを含むグラフィックアクセラレータが含まれています。グラフィックスドライバでは、ベクター グラフィックを描画するために、色、パス配列、およびコマンド配列を定義する必要があります。さらに、さまざまなユーティリティ関数を使用して、単純な形状やより複雑な形状を描画できます。utDraw.h ファイルを参照してください。次のコードを使用して、図 2 に示す例を TRAVEO™ T2G グラフィックス ドライバで描画します。
CYGFX_U08 PathSegments[] = {CYGFX_DE_INSTR_MOVE_TO_ABS, CYGFX_DE_INSTR_CUBIC_TO_ABS, CYGFX_DE_INSTR_CUBIC_TO_ABS, CYGFX_DE_INSTR_CUBIC_TO_ABS,
CYGFX_DE_INSTR_CUBIC_TO_ABS, CYGFX_DE_INSTR_CLOSE_PATH};
CYGFX_FLOAT PathData[] = {55,230, 55,120,250,290,250,120, 530,10,720,10,720,120, 720,340,530,340,310,440, 180,490,470,290,55,230};
CYGFX_U32 noInstr = sizeof(PathSegments)/sizeof(CYGFX_U08);
CyGfx_BeSetSurfAttribute(ctx, CYGFX_BE_TARGET_SRC, CYGFX_BE_SURF_ATTR_COLOR, CYGFX_SM_COLOR_TO_RGBA(0, 0, 255, 255));
CyGfx_DeSetAttribute(ctx, CYGFX_DE_ATTR_DATA_FORMAT, CYGFX_DE_DATA_FORMAT_FLOAT);
CyGfx_DeAppendPathData(ctx, noInstr, PathSegments, PathData);
CyGfx_DeDraw(ctx, 0, 0);
パスを描画するソース サーフェスの正しい属性 (CyGfx_BeSetSurfAttribute()) を設定することにより、コマンド (PathSegments[])、座標 (PathData[])、および色を指定します。ソース サーフェスに何もバインドされていないことを確認してください。それ以外の場合は、バインドされたサーフェスのカラー値がカラーとして使用されます。
さらに、CyGfx_DeSetAttribute() を介して座標の形式を指定し、次に CyGfx_DeAppendPathData() を呼び出してパスバッファを埋める必要があります。パスバッファは事前に初期化する必要があります。 描画エンジンが使用するため、必ずアルファバッファを作成してください。CyGfx_DeDraw() を呼び出すと、バッファ内のすべてのパスデータが設定された宛先サーフェスに描画されます。
グラフィックスドライバに SVG ファイルを直接含めたり、ロードしたり、表示したりすることはできません。 TRAVEO™ T2G コードスニペットを SVG ファイルと比較すると、命令とパス データが類似していることが分かります。 SVG ファイルを使用できるようにするために、この KBA には実験的なコマンドラインツールが用意されています。このツールは、SVG ファイルを TRAVEO™ T2G グラフィックス ドライバで読み取ることができる配列データに変換します。
3 SVG から T2G への CLI ツール
注釈 : CLI ツールは現状のまま提供され、正当性およびサポートの保証はありません。 これはオープンソースであり、Windows 用の実行可能バージョンが含まれています。 ツールに含まれている Visual Studio プロジェクトと CMake ファイルを使用して、自分でビルドできます。
コマンド ラインからツールを呼び出し、変換する SVG ファイルのパスを指定します。
たとえば、作業ディレクトリがツールのパスと同じである場合、同じディレクトリにある sample.svg というファイルを変換するには、コードリスト 1 のコマンドを使用します。
コードリスト 1
SVG-2-T2G sample.svg
コードリスト 2に示すように、sample_svg.h というヘッダー ファイルが、配列 (pathData[]) と構造体 (tsPathData) で作成されます。このファイルには、グラフィックス ドライバーに必要なすべてのデータが含まれており、コードに含めることができます。
コードリスト 2
typedef struct {
CYGFX_U32 fillColor;
CYGFX_U32 numSegments;
const CYGFX_U08 *pPathSegments;
const CYGFX_FLOAT *pPathData;
} tsPathData;
コードリスト 3に示すように、pathData[] のすべての要素をループし、描画エンジンを介してレンダリングして、グラフィックス ドライバでこれを正しく表示します。これは、次の方法で行うことができます :
コードリスト 3
CyGfx_BeBindSurface(ctx, CYGFX_BE_TARGET_SRC, NULL);
for (int i = 0; i < sizeof(pathData)/sizeof(tsPathData); ++i)
{
CyGfx_BeSetSurfAttribute(ctx, CYGFX_BE_TARGET_SRC, CYGFX_BE_SURF_ATTR_COLOR, pathData[i].fillColor);
CyGfx_DeAppendPathData(ctx, pathData[i].numSegments, pathData[i].pPathSegments, pathData[i].pPathData);
CyGfx_DeDraw(ctx, 0, 0);
}
ソース サーフェスに何もバインドされていないことを確認します。 それ以外の場合、描画エンジンは、指定された色からではなく、バインドされたサーフェスから色の値を取得します。 ループの後に CyGfx_DeDraw() コマンドを呼び出すことができますが、この場合、パスバッファは十分な大きさでなければなりません。
一方、各ステップの後にループで呼び出すと、アーティファクトが目に見える可能性があります。 したがって、使用可能なメモリと目的の結果に応じて、この関数を呼び出す方法を選択する必要があります。
描画エンジンはアウトライン化をサポートしていませんが、ツールはアウトライン化を実現するための適切なパスを提供しようとします。 これは特に複雑なグラフィックスの場合に失敗する可能性があり、アーティファクトが表示される原因になります。 より単純なグラフィックまたはアウトラインを含まないグラフィックは、ツールで問題なく動作するはずです。 いずれの場合も、このツールは十分にテストされておらず、機能は保証されていません。
