TeX 言語を使用して数式を示す画像を生成できます。
概要
TeX 言語(「tek」または「tech」と発音)を使用して数式の画像を生成できます。これは、ウェブページ上に複雑な数式を表示する場合に便利です。その場でレンダリングされる数式の例を以下に示します。
画像の URL をコピーしてブラウザに貼り付け、各画像が生成された URL を確認します。
src プロパティの <img>
タグで TeX 言語を使用して数式を指定すると、PNG ファイルとして数式が返されます。または、GET リクエストをプログラムで送信して数式の PNG を取得することもできます。
構文
ルート URL: https://chart.googleapis.com/chart?
数式画像リクエストでは、? の後に続く次の URL クエリ パラメータがサポートされます。をルート URL に追加します。
URL パラメータ | 必須または省略可 | 説明 |
---|---|---|
cht=tx |
必須 | 数式タイプの画像であることを指定します。 |
chl=<data> |
必須 | レンダリングする数式を TeX 言語で記述します。数式を URL エンコードする必要があります。詳しくは以下をご覧ください。 |
chs=<width>x<height> |
任意 | 画像のサイズ(ピクセル単位)。指定しない場合、サイズは自動的に計算されます。 値を 1 つだけ指定した場合は、その値が高さになり、幅が自動的に計算されます。 |
chf |
任意 | すべての背景塗りつぶしタイプがサポートされています。背景の塗りつぶしをご覧ください。 |
chco |
任意 | テキストの色を指定します。デフォルトは黒です。 |
chl データの URL エンコード
数式に URL セーフではない文字を使用する場合は、URL エンコードする必要があります。URL エンコーダについては、こちらをご覧ください。
最もよくある間違いは、次に示すように、数式で %2B ではなく + を使用することです。
URL エンコードなし | URL エンコード |
---|---|
cht=tx&chl=a^2+b^2=c^2 |
cht=tx&chl=a^2%2Bb^2=c^2 |
背景の塗りつぶし(chf
)
画像には、無地、グラデーション、ストライプの塗りつぶしを指定できます。すべての塗りつぶしは chf
パラメータを使用して指定します。パイプ文字(|)で値を区切ることで、同じ画像に異なる塗りつぶしタイプ(単色、ストライプ、グラデーション)を混在させることができます。
ソリッドフィル
透明な単色の塗りつぶしを指定したり、透明にしたり、画像全体を透明にしたりできます。
構文
chf=<fill_type>,s,<color>|...
- <fill_typefill_type>
- 次のいずれかの値を指定します。
bg
- 背景の塗りつぶし。<color> パラメータでアルファ値を指定すると、背景を透明にできます。a
- 画像の透明度。<color>
の最初の 6 桁は無視され、最後の 2 桁(透明度の値)のみが適用されます。
- s
- 塗りつぶしを指定します。
- <color>
- 塗りつぶしの色。RRGGBB[AA] の 16 進数形式で指定します。AA はオプションの透明度(アルファ)値です。
例
説明 | 例 |
---|---|
青い背景の数式。 |
|
上記と同じですが、背景は 2 桁のアルファ数字 80 を使用してわずかに透明になります。80 は約 50% の透明度に相当します。数式の背景は透明ですが、テキストは透明ではありません。 |
|
この例では、画像全体に透明度を適用します。テーブルセルの背景が、背景だけでなくテキストを通じてどのように見えるかに注目してください。この画像は、パイプ文字を使用して 2 つの背景を結合しています。
|
|
グラデーション塗りつぶし
数式に 1 つ以上のグラデーション塗りつぶしを適用できます。グラデーション塗りつぶしは、ある色から別の色にフェードします。
グラデーションの塗りつぶしごとに角度を指定し、指定された位置に固定された 2 つ以上の色を指定します。アンカーから別のアンカーに移動すると、色が変化します。一方がもう一方にフェードインできるように、異なる <color_centerpoint> 値を持つ色が少なくとも 2 つ必要です。追加のグラデーションはそれぞれ <color>、<color_centerpoint> のペアで指定されます。
構文
chf=bg,lg,<angle>,<color_1>,<color_centerpoint_1> ,..., <color_n>,<color_centerpoint_n>
- bg
- 背景の塗りつぶし。
- lg
- グラデーション塗りつぶしを指定します。
- <angle>
- グラデーションの角度を 0(水平)~ 90(垂直)の範囲で指定する数値。
- <color>
- 塗りつぶしの色(RRGGBB の 16 進数形式)。
- <color_centerpoint>
- 色のアンカー ポイントを指定します。別のアンカーに近づくにつれて、この地点から色が徐々に消えていきます。値の範囲は 0.0(下端または左端)~ 1.0(上端または右端)で、<angle> で指定された角度で傾けられます。
例
説明 | 例 |
---|---|
数式に角度 0 度(
|
|
上記と同じですが、45 度のグラデーションです。 |
|
ストライプ塗りつぶし
数式では、ストライプの背景の塗りつぶしを指定できます。
構文
chf= bg,ls,<angle>,<color_1>,<width_1> ,..., <color_n>,<width_n>
- bg
- 背景塗りつぶし
- ls
- 線形ストライプ塗りつぶしを指定します。
- <angle>
- すべてのストライプの角度(Y 軸を基準とする相対角度)。縦方向のストライプには
0
、横方向のストライプには90
を使用します。 - <color>
- このストライプの色(RRGGBB の 16 進数形式)。ストライプごとに <color> と <width> を繰り返します。ストライプが少なくとも 2 つ必要です。画像が塗りつぶされるまでストライプが交互に表示されます。
- <width>
- このストライプの幅(
0
~1
)。1
は画像の幅全体です。ストライプは画像が塗りつぶされるまで繰り返されます。ストライプごとに <color> と <width> を繰り返します。ストライプが少なくとも 2 つ必要です。画像が塗りつぶされるまでストライプが交互に表示されます。
例
説明 | 例 |
---|---|
|
chf=bg,ls,0,CCCCCC,0.15,FFFFFF,0.1 |
|
chf=bg,ls,90,999999,0.25,CCCCCC,0.25,FFFFFF,0.25 |