■Google Chartを使った数式の書き方
...メニューに戻る ...Excel他のメニューに戻る
【Google Chart APIを使った数式の書き方】

以下の約束に従って,*の部分を書き換えます.
<img src="https://chart.googleapis.com/chart?cht=tx&chl=*">

※HTMLファイルの中で上の1行を貼り付けて,*の部分を書き換えて使います.
 作業はテキストエディタで行い,ローカルな(自分のPCの中の)ファイルでも点検できますが,そのPCはネットにつながっていなければなりません.

※ほとんどTeXの書き方と同じですが,実際にテストしてみると微妙に違う場合があります.
この頁に書いたものは,PC上のIE,Chrome,Safari,Firefoxでテストしたものです.
Safariでバックスラッシュとして表示されるものは円マークです.
○ + という文字は使えないのでこれだけは要注意
%2B
 その他の演算子
-x
(マイナスはそのまま.ただしマイナス単独では無理?)
\times
\div
\pm
\mp
(
)
(小かっこ:パーレンは左右ともそのまま)
\lbrac
\rbrac
\mid

○分数
\frac{a}{x-1}
○繁分数
\frac{a}{x-\frac{1}{y-1}}
○累乗
x^2-x
e^{x%2B1}
○添え字
a_1
2a_{n-1}
○ルート
\sqrt{5}
\sqrt{x%2B+2}
○累乗根
\sqrt[3]{2}
x^{\frac{m}{n}}=\sqrt[n]{x^m}
○和の記号シグマ,積の記号パイ
(インラインモード)
\sum_{k=1}^n k^2
\prod_{k=1}^5 k=120

(ディスプレイモード)
\[\sum_{k=1}^n k^2\]
\[\prod_{k=1}^4 k=4!\]
○極限記号
\lim_{x \to \infty}f(x)
○積分記号
(インラインモード)
** 定積分は,なぜかディスプレイモードと同じ **
\int f(x)dx
\int_a^b f(x)dx
(Chromeでは,定積分もディスプレイモードと同じ)
(ディスプレイモード)
\[\int_a^b f(x)dx\]
 ○ベクトル
\vec{a}
\vec{PQ}


 ○バー,チルダ,ハット,ドット
\bar{x}
\tilde{a}
\hat{b}
\dot{x}


  ○等号,不等号,集合記号など
\neq
\lt
\gt
\le
\ge
\simeq
\equiv
\infty
\apos
\prime
\ast
\circ
\bigcirc
\cdot
\bullet
\bull(上と同じ?)
\cap
\cup
\subset
\supset
\subseteq
\supseteq
\in
\ni
\empty
\vee
\wedge
\neg
\forall
\exists




○ギリシャ小文字
\alpha
\beta
\gamma
\delta
\epsilon
.\varepsilon
\zeta
\theta
.\vartheta
\iota
\kappa
\lambda
\mu
\nu
\xi
o(英語と同じ)
\pi
\rho
\sigma
\tau
\upsilon
\phi
.\varphi
\chi
\psi
\omega

○ギリシャ大文字(英語大文字と同じ形のものは特に定義されて
いない)
\Gamma
\Delta
\Theta
\Lambda
\Xi
\Pi
\Sigma
\Phi
\Psi
\Omega


○フーリエ変換の記号
\mathcal{F} →
【例】 


○ラプラス変換の記号
\mathcal{L} →
【例】 

次の内容については,うまい解説が見つからなかったため,個人でテストした結果を書いています.
【項(語句)を区切るには】

 \で始まる語句の後は原則としてスペースで区切ります.これらは区切りを表すだけで,詰めて表示されます.
[例]
× \timesb という語句は定義されていないからそのように入力するとエラーになります. →

○ a×bと表示するためには,a\times b のように\timesの後にスペースを入れます →

 ただし,\で始まる語句の後に数字が続く場合は,スペースがなくても区切られるようです.
[例]
○ 3\times4
○ 3\times 4
× \sqrt{a}\pmb
○ \sqrt{2}\pm1
 スペースは何個入れても1つの区切りがあるのと同じになります.
 単なる英数字の間は,スペースがあってもなくても詰めて表示されます.
[例]
スペースがたくさん:a\div.b
文字数字間にスペースあり:2x 3 y
sinxlogxのように少しだけ間を開けたいときは,専用の記号\sin x\log xを使います.
[例]
△ sin x,log x,cosh x
○ \sin x, \log x,\cosh x

【2つ以上の文字を分母や分子に使う,2つ以上の文字を添字や累乗に使うには】

 {で始まり,}で終わる範囲が一塊の語句として扱われます.
[例]
添字:a_n%2B1a_{n%2B1}
2文字の添字:a_12a_{12}
累乗:e^x%2B2e^{x%2B2}
2文字の累乗:a^10e^{3x}
分数:\frac34\frac{34}5
分数:\frac3{45}\frac{x}{x%2B1}

+, &, #, \, {, }, _, ^ の文字が登場するとその前に区切りがあるのと同様に振舞うので,これらの文字を使う場合はその前にスペースがなくてもよい.
[例]
\frac{1}{2}\frac{1}{3}(←詰められる)
\frac{1}{2} \frac{1}{3}(←同じく詰められる)
\frac{1}{2}+\frac{1}{3}(←同じく詰められる)

逆に次のような場合には,要注意です
e^x^ye ^x ^yと同じ →
a^_n_1a _n _1と同じ →

e^{x^2}
a_{n_1}
【式に色を付けるには】

次の赤で示した例にならって,&chco=の部分を追加します.
<img src="https://chart.googleapis.com/chart?cht=tx&chl=x^2%2B1&chco=ff0000">
.
※カラーコードはRRGGBBスタイルで,文字列としてシングルクォートで囲むこともせず,数字を表す#も付けずにそのまま書きます.
 色を省略すれば黒で表示されます.
≪幾つかの例≫
red:ff0000
darkgreen:006400
blue:0000ff
orange:ffa500
indigo:4b0082
darkred:8b0000


【式を大きく,または,小さく表示するには】

次の赤で示した例にならって,&chs=の部分を追加します.
<img src="https://chart.googleapis.com/chart?cht=tx&chl=\[\sum_{k=1}^n k^2\]&chs=75x50">
.
※横x縦をドット数で書きます.中央に書くのはエックスの小文字です.

※この方式では,Googleからリアルタイムで返されるPNG形式の画像ファイルがその箇所に書き込まれるとされており,前後の文章に合わせて大きな式の表示位置を上下に動かしたしたいときは,画像の位置を調整する方法が使えます.
○大きな式と前後の文章の文字位置を<img src="..." align="top">や<img src="..." align="middel">で調整した場合(ただし,Chromeでは調整できず,すべてtopと同じになる.)

 普通の文章の高さはこの位置→(無指定)

 普通の文章の高さはこの位置→(top)

 普通の文章の高さはこの位置→(middle)

○スタイルシートを使ってピクセル単位まで微調整(どのブラウザでも調整可能であるが,結果はブラウザごとに異なる.)
style="position:relative;top:##px;"で調整した場合


 普通の文章の高さはこの位置→(top:10px;)
この他,式に背景色を付けることもできます
(参考)
https://developers.google.com/chart/infographics/docs/formulas?hl=ja#gcharts_background_fills

【自由研究】
 次の空欄を埋めて実際にどうなるか確かめてください.ただし,+, &, #, \, {, }, _, ^ の文字はスクリプトの制御用に使われているので,この空欄の中では意味が変わることに注意してください.HTMLでタグ制御用の文字 > , < は自動的に変換されるようです.また,ギリシャ文字や日本語漢字かな等の2バイト文字を入力するとエラーになります.
≪こんな表示が出たらエラーです≫
■2バイト文字を使っている場合:,■数式として定義されていない語句,例えば \abc を使った場合:
<img src="https://chart.googleapis.com/chart?cht=tx&chl=">
に入れる式:
表示する やり直す
≪あなたのソースコード全体≫…画面上でコピーしてから,テキストエディタの中で貼り付ければ使えます.
≪上記による式の見え方≫


【間違い直しプログラム】
 次のプログラムは,よく使う文字(足し算の記号 + , 2バイト文字[×÷±α〜ωまでのギリシャ文字],[∩∪⊂⊃などの集合・論理の記号]が上記の空欄に含まれているときに,勝手に書き換えて Google Chart Tools に合うようにするものです.} や { の記入ミスは防げません.)
≪書き換えたソースコード全体≫…画面上でコピーしてから,テキストエディタの中で貼り付ければ使えます.
試してみる
≪上記による式の見え方≫

【問題】
 左欄の数式を表すためには,次の空欄にどのような文字列を記入すればよいか,右欄から選んでください.
<img src="https://chart.googleapis.com/chart?cht=tx&chl=">
はじめに左欄の式を選び,続けて右欄の文字列を選んでください.ヒントが必要な場合は,右の文字列を「後ろから前に向けてドラッグ→右クリック→コピー(Safariでは,タイミングによっては「リンクをコピー」になりますが,それではない)」して,上の【自由研究】の空欄に貼り付ければ分かります.)
































\frac[1]{23} \frac{1}{23}
\frac{23}{1} \frac(23)(1)

frac{1}{2}+frac{1}{3} \frac{1}{2}+\frac{1}{3}
frac{1}{2}&2B frac{1}{3} \frac{1}{2}%2B\frac{1}{3}

\frac{2}{1%2B\frac{1}{3}} \frac{2}{1+frac{1}{3}}
\frac{1%2B\frac{1}{3}}{2} \frac{1%2B frac{1}{3}}{2}

2^\frac{1}{3}=\sqrt[3]{2} \sqrt[3]{2}=2^\frac{1}{3}
2^{\frac{1}{3}}=\sqrt[3]{2} \sqrt[3]{2}=2^{\frac{1}{3}}

\frac{1\pm\sqrt{3}i}{2} \frac{1±sqrt{3}i}{2}
\frac{1\pm\sqrt{3i}}{2} \frac{1±sqrt{3i}}{2}

x^2-2x+3 \x^2-2x%2B3
x^2-2x%2B 3 \x^2-2\x %2B 3

(x-α)(x-β) (x-\alpha)(x-\beta)
(\x-α)(\x-β) (\x-\alpha)(\x-\beta)

A∩B=φ A\capB=φ
A\cap B=\empty A\wedge B=\empty

\sum_{k=1}^4 k \[\sum_{k=1}^4 k\]
\[\sum_{k=1}^4 k\]&chs=36x36 \[\sum_{k=1}^4 k&chs=36x36\]

\[\int_\frac{\pi}{2}^0 \sin x dx\]
\[\int_{\frac{\pi}{2}}^0 \sin x dx\]
\[\int_0^\frac{\pi}{2} \sin x dx\]
\[\int_0^{\frac{\pi}{2}} \sin x dx\]


...メニューに戻る ...Excel他のメニューに戻る