
このドキュメントでは、Chart API を使って散布図を作成する方法について説明します。
目次
グラフ固有の機能 |
標準機能
|
はじめに
散布図(または散布図)は、2 次元グラフ上の個々のドットの集合です。個々のドットのサイズを指定することもできます。散布図は、1 つのデータ系列のみを受け入れることができます。散布図は、2 つの変数を持つ多数のデータポイントのグループやパターンを検出するのに適しています(変数が 1 つしかない場合は、折れ線グラフを検討してください)。
データ系列は少なくとも 2 つ指定する必要があります。1 つ目のデータ系列は X 座標を指定し、2 つ目のデータ系列は Y 座標を指定します。
必要に応じて、3 つ目のシリーズを指定して個々のポイントサイズを指定できます。このシリーズがないと、すべてのポイントの幅はデフォルトで 10 ピクセルになります。
chm
を使用してデータポイントの形状や色を変更した場合、ポイントは chm
で指定されたサイズを基準としてスケーリングされます。
グラフの種類(cht
)
散布図は次の構文で指定します。
構文
cht=s chd=<x_values>|<y_values>[|<optional_point_sizes>]
説明 | 例 |
---|---|
データポイントのデフォルト マーカーは青い円です。別の色やシェイプを使用するには、このセクションの残りの部分で説明するように、 このグラフでは、3 つ目のデータ系列を含めることでポイントのサイズを変えています。 |
|
色を使用して複数のシリーズをシミュレートする場合は、 このグラフには 3 つのデータ系列があります。1 つ目は x 値、2 つ目は対応する y 値、3 つ目は対応するポイントのサイズです。
凡例は |
![]() chd=t: |
ポイントの形状を変えるには、シェイプ マーカーを使用します。散布図と他のグラフでは、
シェイプ マーカーの使用に関するその他のヒント:
|
![]() chm=d,FF0000,0,-1,15 デフォルトのシェイプをひし形(d)に設定する ![]() chm= デフォルトはひし形( d )、マーカー インデックス 15 以降は四角形(s )に重ねて表示します。![]() chd=t: |
線マーカー(
|
![]() chd=t:
|
表示されるポイントを利用せずに、ポイントを通るトレースラインを作成する方法は、次のとおりです。
散布図は複合グラフとして使用できないため、系列を追加して折れ線を記述することはできません。 この方法では破線は指定できませんが、線の色と太さは指定できます。 |
非表示ポイントを含むトレースライン:chd=t: |
系列の色 chco
ドットの色は、chco
パラメータを使用して指定します。すべてのポイントに単一色、グラデーション、または個々のポイントの色を指定できます。
構文
chco=<single_color> or chco=<point_1_color>|...|<point_n_color> or chco=<gradient_start>,...,<gradient_end> (only with third data series)
- <color>
- ポイントの色(RRGGBB の 16 進形式)。形式には以下のようなものがあります。
- すべてのポイントに適用する単一の色を指定します。
- 個々のポイントに個別の色を適用するには、パイプ区切り文字を使用して、ドットごとに 1 つの色を指定します。
- 個々のドットの色を指定して、その色がドットよりも少ない場合、n 番目のポイントごとに対応する n 番目の色が割り当てられます。この方法で複数の系列散布図を作成できます。
- カラー グラデーションを適用するには、(ポイントのサイズを決定する)3 つ目のデータ系列を含める必要があります。2 つ以上の色をカンマで区切って指定し、ドットのサイズに応じたカラー グラデーションをポイントに適用します。
標準の機能
このページの残りの機能は、標準のグラフ機能です。
グラフのタイトル chtt
、chts
[すべてのグラフ]
グラフのタイトルのテキスト、色、フォントサイズを指定できます。
構文
chtt=<chart_title> chts=<color>,<font_size>,<opt_alignment>
chtt
- グラフのタイトルを指定します。
- <チャートのタイトルchart_title>
- グラフに表示するタイトル。このテキストが表示される場所は指定できませんが、フォントサイズと色は任意で指定できます。スペースは + 記号、改行の場合はパイプ文字(
|
)を使用します。
chts
(省略可) - chtt
パラメータの色とフォントサイズ。
- <color>
- タイトルの色(RRGGBB の 16 進形式)。デフォルトの色は黒です。
- <font_size>
- タイトルのフォントサイズ(ポイント単位)。
- <opt_alignment>
- (省略可): タイトルの配置。次のいずれかの文字列値(大文字と小文字を区別)を選択します。「l」(左)、「c」(中央)、「r」(右)デフォルトは "c" です。
例
説明 | 例 |
---|---|
デフォルトの色とフォントサイズを使用したタイトル付きのグラフ。 プラス記号( パイプ文字( ここでは |
![]() chtt=Site+visitors+by+month| |
青色の右揃えで 20 ポイントのタイトルが付いたグラフ。 |
![]() chtt=Site+visitors |
グラフの凡例のテキストとスタイル chdl
、chdlp
、chdls
[すべてのグラフ]
凡例は、各シリーズの説明を短いテキストで示すグラフのサイド セクションです。凡例の各シリーズに関連付けるテキストを指定し、凡例をグラフ上で表示する場所を指定できます。
凡例の周囲に余白を設定する方法については、chma
をご覧ください。
文字列値に関する注意: ラベルの文字列には、URL セーフな文字のみを使用できます。安全のためには、文字セット 0-9a-zA-Z
にない文字を含む文字列は URL エンコードする必要があります。URL エンコーダは、Google ビジュアリゼーションのドキュメントにあります。
構文
chdl=<data_series_1_label>|...|<data_series_n_label> chdlp=<opt_position>|<opt_label_order> chdls=<color>,<size>
chdl
- 凡例に表示する各シリーズのテキスト。
- <data_series_labeldata_series_label>
- 凡例のエントリのテキスト。各ラベルは、
chd
配列内の対応するシリーズに適用されます。スペースには + 記号を使用します。このパラメータを指定しないと、グラフに凡例は表示されません。ラベル内の改行を指定する方法はありません。通常、凡例は凡例テキストが入るように拡張され、グラフ領域は凡例に合わせて縮小されます。
chdlp
- (省略可)凡例の位置と凡例のエントリの順序。<position> と <label_order> のいずれかまたは両方を指定できます。両方を指定する場合は、バー文字で区切ります。凡例で chdl
の空の凡例エントリをスキップする場合は、任意の値に「s」を追加できます。例: chdlp=bv
、chdlp=r
、chdlp=bv|r
、chdlp=bvs|r
- <opt_position>
- (省略可): グラフ上の凡例の位置を指定します。凡例とグラフ領域または画像の枠線との間に追加のパディングを指定するには、
chma
パラメータを使用します。 次のいずれかの値を選択します。b
- グラフの下部にある凡例。凡例のエントリは 1 行に並んでいます。bv
- グラフの下部に凡例があり、凡例のエントリは縦一列に並んでいます。t
- グラフの上部にある凡例。凡例のエントリは 1 行に並んでいます。tv
- グラフの上部にある凡例。凡例のエントリは縦一列に並んでいます。r
- [デフォルト] 凡例をグラフの右側に表示し、凡例のエントリを縦一列に並べます。l
- 凡例をグラフの左に並べ、凡例のエントリを縦一列に並べます。
- <opt_label_order>
- (省略可): 凡例でラベルが表示される順序。次のいずれかの値を選択します。
l
- [垂直方向の凡例のデフォルト]chdl
に指定された順序でラベルを表示します。r
-chdl
に対して指定された逆の順序でラベルを表示します。 これは積み上げ棒グラフで、棒と同じ順序で凡例を表示する場合に便利です。a
- [水平の凡例のデフォルト] 自動並べ替え: おおよそ、10 ピクセル ブロック単位で長さの短いものから順に並べられます。2 つの要素が同じ長さ(10 ピクセルのブロックに分割)の場合、最初に指定された要素が先に表示されます。0,1,2...
- カスタムラベルの順序。これはchdl
のゼロベースのラベル インデックスをカンマで区切ったリストです。
chdls
- 省略可: 凡例のテキストの色とフォントサイズを指定します。
- <color>
- 凡例のテキストの色(RRGGBB の 16 進形式)。
- <size>
- 凡例のテキストのポイントのサイズ。
例
説明 | 例 |
---|---|
凡例の 2 つの例。凡例のテキストはデータ系列と同じ順序で指定します。 |
chdl=NASDAQ|FTSE100|DOW
chdl=First|Second|Third |
1 つ目のグラフは水平の凡例エントリ( |
|
この例は、フォントサイズを変更する方法を示しています。 |
|
グラフのマージン chma
[すべてのグラフ]
グラフのマージンのサイズをピクセル単位で指定できます。マージンは、指定したグラフサイズ(chs
)から内側に向かって計算されます。マージンサイズを大きくしても、グラフの合計サイズは大きくならず、必要に応じてグラフ領域が縮小します。
マージンは、デフォルトではグラフサイズの計算後に残った分になります。このデフォルト値は、グラフの種類によって異なります。指定するマージンは最小値です。グラフ領域に余白がある場合、そのマージンは残りのサイズと同じになります。凡例とラベルに必要なマージンを小さくすることはできません。次の図は、グラフの基本部分を示しています。
![]() |
グラフのマージンには、軸のラベルと凡例のエリアが含まれます。凡例領域は、テキストにぴったり収まるように自動的にサイズ変更されます。ただし、 ヒント: 棒グラフでは、棒のサイズが固定されている場合(デフォルト)は、グラフ領域の幅を小さくすることはできません。 |
構文
chma= <left_margin>,<right_margin>,<top_margin>,<bottom_margin>|<opt_legend_width>,<opt_legend_height>
- <left_margin>、 <right_margin>、 <top_margin>、 <bottom_margin>
- グラフ領域の周囲の最小マージンサイズ(ピクセル単位)。軸ラベルがグラフの境界にぶつからないように、この値を大きくするとパディングが追加されます。
- <opt_legend_width>、<opt_legend_height>
- (省略可): 凡例の周囲の余白の幅(ピクセル単位)。これを使用して、凡例がグラフ領域や画像の端にぶつけられないようにします。
例
説明 | 例 |
---|---|
この例のグラフでは、各辺の最小マージンは 30 ピクセルです。グラフの凡例の幅が 30 ピクセルを超えるため、右側のマージンはグラフの凡例の幅に設定され、他のマージンとは異なります。 軸ラベルはプロット領域外にあるため、マージン空間内に描画されます。 |
|
凡例の周囲に余白を追加するには、 この例の凡例の幅は約 60 ピクセルです。 |
|
軸のスタイルとラベル [折れ線、棒、Google メーター、レーダー、散布図]
グラフに表示する軸を指定し、カスタムのラベル、位置、範囲、スタイルを設定できます。
すべてのグラフで、デフォルトで軸線が表示されるわけではありません。chxt
パラメータを使用すると、グラフに表示する軸を正確に指定できます。デフォルトの軸線には数値は表示されません。数値を表示するには、chxt
パラメータで軸を指定する必要があります。
データ値を反映した数値を軸に表示するように選択することも、カスタム軸を指定することもできます。デフォルトでは、0 ~ 100 の範囲にスケールされた数値が表示されます。ただし、chxr
を使用してその範囲を変更し、任意の範囲を表示できます。また、chxs
を使用して値のスタイルを設定できます(通貨記号や小数点を表示するなど)。
カスタム値(「月、火、水」など)を使用する場合は、chxl
パラメータを使用できます。これらのラベルを軸に沿った特定の場所に配置するには、chxp
パラメータを使用します。
最後に、chxs
パラメータと chxtc
パラメータを使用して、カスタム軸ラベルと数値軸ラベルの両方の色、サイズ、配置などのプロパティを指定できます。
文字列値に関する注意: ラベルの文字列には、URL セーフな文字のみを使用できます。安全のためには、文字セット 0-9a-zA-Z
にない文字を含む文字列は URL エンコードする必要があります。URL エンコーダは、Google ビジュアリゼーションのドキュメントにあります。
このセクションでは、次のトピックについて説明します。
- 可視軸(
chxt
) - 表示する軸。 - 軸の範囲(
chxr
) - 各軸の値の範囲。 - カスタム軸ラベル(
chxl
)- 軸に表示するカスタム値。 - 軸ラベルの位置(
chxp
) - 各軸に沿ったカスタムラベルの配置。 - 軸ラベルのスタイル(
chxs
) - 軸ラベルの色、サイズ、配置、書式。 - 軸の目盛りのスタイル(
chxtc
)- 特定の軸の目盛りの長さ。
軸の表示 chxt
棒グラフ、折れ線グラフ、レーダーグラフ、散布図には、デフォルトで 1 つまたは 2 つの軸線が表示されますが、これらの線には値が含まれていません。軸線に値を表示する、または表示する軸を変更するには、chxt
パラメータを使用する必要があります。chxr
プロパティで明示的に調整しない限り、軸の値の範囲はデフォルトで 0 ~ 100 になります。折れ線グラフのすべての軸線を非表示にするには、cht
パラメータのグラフタイプの値の後に :nda
を指定します(例: cht=lc:nda
)。
デフォルトでは、上下の軸には値ごとに目盛りは表示されませんが、左右の軸には表示されます。この動作は、chxs
パラメータを使用して変更できます。
構文
chxt= <axis_1> ,..., <axis_n>
- <axis>
- グラフに表示する軸。使用可能な軸は次のとおりです。
x
- 下 X 軸t
- 上部の X 軸(Google-o-Meter ではサポート対象外)y
- 左 Y 軸r
- 右の Y 軸(Google-o-Meter ではサポートされていません)
同じタイプの軸を複数指定できます(例: cht=x,x,y
)。これにより、グラフの下部に沿って 2 組の X 軸が積み重ねられます。これは、数値を表示する軸に沿ってカスタムラベルを追加する場合に便利です(下記の例を参照)。軸は内側から外側に描画されるため、x,x
と指定すると、最初の x は最も内側のコピーを参照し、次の x は次の外側のコピーを参照し、以降も同様に続きます。
例
説明 | 例 |
---|---|
この例は、X 軸、Y 軸、上軸(t)、右軸(r)を持つ折れ線グラフを示しています。 ラベルが指定されていないため、グラフはすべて軸に対してデフォルトで 0 ~ 100 の範囲になります。 デフォルトでは、上下の軸にラベルの目盛りは表示されません。 |
|
同じ値を複数回指定することで、軸ごとに複数のラベルセットを含めることができます。この例では、2 組の x 軸と 2 組の y 軸を示しています。ここに示すように、デフォルトの軸ラベルのみを使用している場合、これは特に有用ではありません。ただし、chxl パラメータを使用すると、各軸のコピーごとにカスタムラベルを指定できます。 |
<img <code="" dir="ltr" src="/static/chart/image/images/chart_41.png" title="chxt=x,x,y,y&cht=lc&chd=s:cEAELFJHHHKUju9uuXUc&chco=76A4FB&chls=2.0&chs=200x1 <img <code="" dir="ltr" src="/static/chart/image/images/chart_42.png" title="chxt=x,x,y,y&cht=lc&chd=s:cEAELFJHHHKUju9uuXUc&chco=76A4FB&chls=2.0&chs=200x1 |
この例は、X 軸、Y 軸、上部の T 軸、右側の R 軸を持つ横棒グラフを示しています。 軸ラベルが省略されているため、Chart API は X 軸と T 軸に 0 ~ 100 の範囲を表示します。 Y 軸と R 軸の範囲は、バーの数によって決まります。この場合、棒は 5 本なので、Chart API は 0 ~ 4 の範囲を表示します。1 つ目のラベルは 1 つ目の棒の底部の中央に配置され、2 つ目のラベルは 2 つ目の棒の基部の中央に配置されます。以降も同様です。 |
|
折れ線グラフのデフォルトの軸を非表示にするには、グラフの種類の後に :nda を指定します。 |
![]() cht=lc:nda |
軸の範囲 chxr
chxr パラメータを使用して、各軸に表示される値の範囲を個別に指定できます。なお、グラフ要素のスケールは変更されず 、軸ラベルのスケールのみが変更されます。軸番号が実際のデータ値を表すようにするには、<start_val> と <end_val> をそれぞれデータ形式範囲の下限値と上限値に設定します。詳細については、軸のスケーリングをご覧ください。
範囲を指定する場合は、chxt
パラメータを使用して軸を表示する必要があります。
カスタム軸の値を指定するには、chxl
パラメータを使用します。
構文
複数の軸ラベルの範囲を区切るには、パイプ文字(|
)を使用します。
chxr= <axis_index>,<start_val>,<end_val>,<opt_step> |...| <axis_index>,<start_val>,<end_val>,<opt_step>
- <軸のインデックス>
- ラベルを適用する軸。これは、
chxt
で指定された軸配列に対するゼロから始まるインデックスです。たとえば、chxt=x,r,y
の場合、R 軸は 1 になります。 - <start_val>
- この軸の最小値を定義する数値。
- <end_val>
- この軸の上限値を定義する数値。
- <opt_step>
- (省略可): 軸の目盛り間のカウントステップ。デフォルトのステップ値はありません。ステップは、適切な間隔で配置されたラベルのセットを表示するように計算されます。
例
説明 | 例 |
---|---|
この例では、左右の Y 軸( 各軸には範囲が定義されています。ラベルや位置が指定されていないため、値は指定された範囲から取得され、その範囲内で等間隔になります。折れ線グラフでは、値は X 軸に沿って均等に広がります。 最初の値( |
|
この例では、X 軸の値が指定されています。 軸ラベルは軸に沿って均等に配置されます。<opt_step> パラメータには 5 の値( |
|
カスタム軸ラベル chxl
chxl
パラメータを使用すると、任意の軸でカスタム文字列の軸ラベルを指定できます。ラベルは必要な数だけ指定できます。chxt
パラメータを使用して軸を表示し、カスタムラベルを指定しない場合、標準の数値ラベルが適用されます。カスタム数値範囲を指定するには、代わりに chxr
パラメータを使用します。
ラベルの軸に沿った特定の位置を設定するには、chxp
パラメータを使用します。
構文
ラベルを付ける軸ごとに 1 つのパラメータ セットを指定します。複数のラベルセットを区切るには、パイプ文字(|
)を使用します。
chxl= <axis_index>:|<label_1>|...|<label_n> |...| <axis_index>:|<label_1>|...|<label_n>
- <軸のインデックス>
- ラベルを適用する軸。これは
chxt
パラメータ配列のインデックスです。たとえば、chxt=x,x,y,y
と指定すると、インデックス 0 が最初の X 軸、1 が 2 つ目の X 軸になります。 - <label_1>| ... |<label_n>
- この軸に沿って配置する 1 つ以上のラベル。値は文字列または数値になります。文字列を引用符で囲む必要はありません。label_1 は軸の最下位の位置に表示され、label_n は最上位に表示されます。追加のラベルはそれらの間に均等に配置されます。スペースは + 記号で示します。ラベル内の改行を指定する方法はありません。ラベルはパイプ文字で区切ります。注:
chxl
パラメータの最終ラベルの後にパイプを入れないでください。
例
説明 | 例 |
---|---|
このグラフは、2 つの軸にカスタムラベルを追加する方法を示しています。値が等間隔で配置されていること、最後の |
![]() chxt=x,y |
この例では、左右の Y 軸( |
|
この例では、左右の Y 軸( この例では、左側の Y 軸の軸ラベルにデフォルト値を使用します。 |
|
軸全体を記述する汎用ラベルを追加する場合(たとえば、ある軸に「cost」と別の「student」のラベルを付ける)、 |
![]() chxt=x,x,y,y |
軸ラベルの位置 chxp
デフォルトのラベルを使用するか、chxl
を使用して指定されたカスタムラベルを使用するかにかかわらず、表示する軸のラベルを指定できます。このパラメータを使用して正確な位置を指定しなかった場合、ラベルは均等に配置され、軸に沿ってデフォルトのステップ値で配置されます。chxl
を指定しない場合、目盛りのラベルはデフォルト値(通常はデータ値または棒グラフの棒グラフ)になります。
構文
複数のポジショニング セットは、パイプ文字(|
)を使用して区切ります。
chxp= <axis_1_index>,<label_1_position>,...,<label_n_position> |...| <axis_m_index>,<label_1_position>,...,<label_n_position>
- <軸のインデックス>
- 位置を指定する軸。これは
chxt
パラメータ配列のインデックスです。たとえば、chxt=x,x,y,y
と指定すると、インデックス 0 が最初の X 軸、1 が 2 番目の X 軸、というようになります。 - <label_1_position>,...,<label_n_position>
- : 軸に沿ったラベルの位置。これは数値のカンマ区切りリストです。各値は、
chxl
配列内の対応するラベルの位置を設定します。最初のエントリは最初のラベルに適用され、以降も同様に続きます。位置は、その軸の範囲内の値です。chxr
を使用してカスタム範囲を指定しない限り、この値は常に 0 ~ 100 になります。位置は、その軸のラベルと同じ数にする必要があります。
例
説明 | 例 |
---|---|
この例には、グラフ上の指定された位置に R 軸のラベルが含まれています。ラベルテキストは、 位置に 位置に |
|
この例では、指定された場所にのみ、デフォルトのラベル値が表示されています。
|
chxt=x,y
![]() chxt=x,y chxp が指定されていません |
軸ラベルのスタイル chxs
軸ラベルのフォントサイズ、色、配置(カスタムラベルとデフォルトのラベル値の両方)を指定できます。同じ軸上のラベルはすべて同じ形式になります。軸のコピーが複数ある場合は、それぞれに異なる書式を設定できます。また、通貨記号や末尾のゼロを表示するなど、ラベル文字列の形式を指定することもできます。
デフォルトでは、上下の軸には値ごとに目盛りは表示されませんが、左右の軸には表示されます。
構文
複数の軸の値はパイプ文字(|
)で区切る必要があります。
chxs= <axis_index><opt_format_string>,<opt_label_color>,<opt_font_size>,<opt_alignment>,<opt_axis_or_tick>,<opt_tick_color>,<opt_axis_color> |...| <axis_index><opt_format_string>,<opt_label_color>,<opt_font_size>,<opt_alignment>,<opt_axis_or_tick>,<opt_tick_color>,<opt_axis_color>
- <軸番号axis_index>
- これを適用する軸。これは、
chxt
パラメータに対するゼロから始まるインデックスです。 - <opt_format_stringopt_format_string>
- (省略可): 必要に応じて、軸インデックス番号の直後にカンマを挟まずに記述する形式文字列です。リテラル文字 N で始まり、その後に次の値(すべて任意)が続きます。
N<preceding_text>*<number_type><decimal_places>zs<x or y>*<following_text>
各要素の意味は次のとおりです。<preceding_text>
- 各値の前に配置されるリテラル テキスト。*...*
- リテラル アスタリスクでラップされたオプションのブロック。数値の書式設定の詳細を指定できます。次の値がサポートされています。すべてオプションです。<number_type>
- 数値書式。数値に使用します。次のいずれかを選択します。f
- [デフォルト] 浮動小数点形式。 <decimal_places> 値とともに精度も指定することを検討してください。p
- パーセント書式。% 記号が自動的に追加されます。注: この形式を使用すると、0.0 ~ 1.0 のデータ値は 0 ~ 100% にマッピングされます(たとえば、0.43 は 43% と表示されます)。e
- 指数表記の形式。c<CUR>
- 指定した通貨で、適切な通貨マーカーを使用して数値を書式設定します。<CUR>
は、3 文字の通貨コードに置き換えます。例: ユーロの場合はcEUR
。コードの一覧は ISO のウェブサイトに記載されていますが、すべての記号がサポートされているわけではありません。
<decimal_places>
- 表示する小数点以下の桁数を指定する整数。値はこの長さに丸められます(切り捨てられません)。デフォルトは 2 です。z
- 末尾のゼロを表示します。デフォルトは no です。s
- グループ セパレータを表示します。デフォルトは no です。x
またはy
- 指定された x 座標または y 座標のデータを表示します。x データの意味はグラフの種類によって異なります。グラフを試してその意味を判断してください。デフォルトは「y」です。
<following_text>
- 各値の後に続くリテラル テキスト。
- <opt_label_color>
- 軸のテキスト(軸線ではない)に適用する色(RRGGBB の 16 進形式)。軸の線の色は、opt_axis_color を使用して個別に指定します。デフォルトはグレーです。
- <opt_font_size>
- (省略可)フォントサイズをピクセル単位で指定します。このパラメータはオプションです。
- <opt_alignment>
- (省略可)ラベルの配置。上下の軸の場合、ラベルの上または下の目盛りとラベルの位置揃えを表します。左または右の軸の場合は、軸に接する境界ボックス内での位置揃えを表します。次のいずれかの数値を指定します。
-1
- 上または下: ラベルは目盛りの右側に配置されます。左または右: ラベルは領域内で左揃えされます。R 軸のラベルのデフォルト。0
- 上または下: ラベルは目盛りの中央に配置されます。左または右: ラベルは領域内で中央に配置されます。X 軸ラベルと T 軸ラベルのデフォルト。1
- 上または下: ラベルは目盛りの左側にあります。左または右: ラベルは領域内で右揃えされます。Y 軸のラベルのデフォルト。
- <opt_axis_or_tick>
- [省略可。Google メーターではサポートされていません] この軸の目盛りや軸線を表示するかどうかを指定します。目盛りと軸線は、最も内側の軸でのみ使用できます(たとえば、2 つの X 軸の外側ではサポートされていません)。次のいずれかの値を使用します。
l
(小文字の「L」) - 軸線のみを描画します。t
- 目盛りのみを描画します。目盛りは軸ラベルの横にある小さな線です。lt
- [デフォルト] すべてのラベルに軸線と目盛りの両方を描画します。_
-(アンダースコア)軸線も目盛りも描画しません。 軸線を非表示にする場合は、この値を使用します。
- <tick_color>
- [省略可。Google メーターではサポートされていません] 目盛りの色(RRGGBB の 16 進形式)。デフォルトはグレーです。
- <opt_axis_coloropt_axis_color>
- (省略可): この軸線の色(RRGGBB の 16 進形式)。デフォルトはグレーです。
例
説明 | 例 |
---|---|
2 番目の X 軸(1 月、2 月、3 月)のフォントサイズと色は、 |
|
右の Y 軸では、フォントサイズ、色、配置が指定されています。 目盛りは描画されますが、軸線は描画されません。 |
|
このグラフには 3 つのデータセットがあり、系列ごとに 1 つずつ、3 つの軸ラベルのセットが表示されています。ラベルの各セットは、ここで説明するように、カスタムの書式設定文字列を使用して書式設定されます。
軸ラベルの範囲は、 |
![]() chd=s: |
軸目盛りのスタイルchxtc
特定の軸に長い目盛りを指定できます。これは通常、グラフの長さ全体に目盛りを拡張するために使用します。目盛りの色を変更するには、chxs
パラメータを使用します。
複数の軸の値はパイプ文字(|
)で区切る必要があります。シリーズ内の値はカンマで区切る必要があります。
構文
chxtc= <axis_index_1>,<tick_length_1>,...,<tick_length_n> |...| <axis_index_m>,<tick_length_1>,...,<tick_length_n>
- <軸番号axis_index>
- これを適用する軸。これは、
chxt
パラメータに対するゼロから始まるインデックスです。バー区切り文字を使用して異なる軸の値を区切ります。 - <tick_length_1>,...,<tick_length_n>
- その軸の目盛りの長さ(ピクセル単位)。単一の値を指定すると、その値がすべての値に適用されます。複数の値を指定すると、軸の目盛りはその軸の値のリストを循環します。正の値はグラフ領域の外側に描画され、グラフの枠線で切り取られます。正の最大値は 25 です。負の値はグラフ領域内に描画され、グラフ領域の枠線で切り取られます。
例
説明 | 例 |
---|---|
|
|
このグラフでは、目盛りの長さを交互に変化させています。chxtc は、Y 軸の 2 つの目盛りの長さの値(5 と 15)を指定します。グラフに描画される目盛りは 2 つの値の間で切り替わります。 |
![]() chxt=x,y |
背景の塗りつぶし chf
[すべてのグラフ]
グラフのデータ領域やグラフの背景全体の塗りつぶしの色とスタイルを指定できます。塗りつぶしタイプには、単色塗りつぶし、ストライプ塗りつぶし、グラデーションがあります。
領域ごとに異なる塗りつぶしを指定できます(グラフ領域全体、データ領域のみなど)。グラフ領域の塗りつぶしは、背景の塗りつぶしを上書きします。すべての塗りつぶしは chf
パラメータを使用して指定します。値をパイプ文字(|)で区切ることで、同じグラフ内で異なる塗りつぶしタイプ(単色、ストライプ、グラデーション)を混在させることができます。グラフ領域の塗りつぶしは、グラフの背景の塗りつぶしを上書きします。
単色塗りつぶし chf
[すべてのグラフ]
背景やグラフ領域に無地の塗りつぶしを指定することも、グラフ全体に透明度の値を割り当てることもできます。パイプ文字(|
)を使用して、複数の塗りつぶしを指定できます(マップ: 背景のみ)。
構文
chf=<fill_type>,s,<color>|...
- <fill_typefill_type>
- グラフの塗りつぶし部分。次のいずれかの値を指定します。
bg
- 背景の塗りつぶしc
- グラフ領域の塗りつぶし。マップグラフではサポートされていません。a
- グラフ全体(背景を含む)を透明にします。<color>
の最初の 6 桁は無視され、最後の 2 桁(透明度の値)のみがグラフ全体とすべての塗りつぶしに適用されます。b<index>
- 棒の塗りつぶし(棒グラフのみ)。 <index> を単色で塗りつぶすバーの系列インデックスに置き換えます。この効果は、棒グラフでchco
を指定する場合と同様です。例については、棒グラフの系列の色をご覧ください。
- s
- 単色または透明の塗りつぶしを指定します。
- <color>
- 塗りつぶしの色(RRGGBB の 16 進形式)。透明性の場合、最初の 6 桁は無視されますが、含める必要があります。
例
説明 | 例 |
---|---|
このサンプルでは、グラフの背景を淡いグレー( |
|
この例では、グラフの背景を薄いグレー( |
|
この例では、グラフ全体に 50% の透明度を適用します(16 進数の 80 は 128、すなわち約 50% の透明度です)。表セルの背景がグラフ全体に表示されます。 |
|
グラデーション塗りつぶし chf
[Line, Bar, Google-o-meter, Radar, Scatter,Venn]
グラフ領域や背景に 1 つ以上のグラデーション塗りつぶしを適用できます。グラデーション塗りつぶしは、ある色から別の色にフェードする機能です。(円グラフ、Google メーターグラフ: 背景のみ)。
グラデーションの塗りつぶしではそれぞれ角度を指定し、指定した位置に固定された 2 つ以上の色を指定します。アンカー間の移動によって色が変化します。<color_centerpoint> の値が異なる 2 つ以上の色を使用して、一方が他方にフェードインできるようにします。追加の各グラデーションは、<color> と <color_centerpoint> のペアで指定されます。
構文
chf=<fill_type>,lg,<angle>,<color_1>,<color_centerpoint_1> ,..., <color_n>,<color_centerpoint_n>
- <fill_typefill_type>
- 塗りつぶすグラフ領域。次のいずれかです。
bg
- 背景の塗りつぶしc
- グラフ領域の塗りつぶし。b<index>
- 棒グラデーションの塗りつぶし(棒グラフのみ)。 <index> をグラデーションで塗りつぶすバーのシリーズ インデックスに置き換えます。例については、棒グラフの系列の色をご覧ください。
- lg
- グラデーションの塗りつぶしを指定します。
- <angle>
- 0(水平)から 90(垂直)までのグラデーションの角度を指定する数値。
- <color>
- 塗りつぶしの色(RRGGBB の 16 進形式)。
- <color_centerpoint>
- 色のアンカー ポイントを指定します。別のアンカーに近づくと、このポイントから色がフェードし始めます。値の範囲は 0.0(下端または左端)~ 1.0(上端または右端)で、<angle> で指定された角度で傾斜します。
例
説明 | 例 |
---|---|
グラフ領域には、角度 0 度( 色はピーチ( グラフの背景はグレー( |
|
グラフ領域には、45 度( 最初に指定した色はピーチ( 2 番目に指定する色は青( グラフの背景はグレー( |
|
グラフ領域には、90 度( 最初に指定した色は青( 2 番目に指定する色はピーチ( グラフの背景はグレー( |
|
ストライプ塗りつぶしchf
[線、棒、Google メーター、レーダー、散布、ベン]
グラフ領域またはグラフ全体に、ストライプの背景の塗りつぶしを指定できます。 (円グラフ、Google メーターグラフ: 背景のみ)。
構文
chf= <fill_type>,ls,<angle>,<color_1>,<width_1> ,..., <color_n>,<width_n>
- <fill_typefill_type>
- 塗りつぶすグラフ領域。次のいずれかです。
bg
- 背景の塗りつぶしc
- グラフ領域の塗りつぶしb<index>
- 棒のストライプの塗りつぶし(棒グラフのみ)。 <index> をストライプで塗りつぶすバーの系列インデックスに置き換えます。例については、棒グラフの系列色をご覧ください。
- ls
- 線形ストライプの塗りつぶしを指定します。
- <angle>
- すべてのストライプの角度。Y 軸を基準として指定します。縦のストライプには
0
、横のストライプには90
を使用します。 - <color>
- このストライプの色(RRGGBB の 16 進形式)。追加のストライプごとに <color> と <width> を繰り返します。ストライプが 2 つ以上必要です。ストライプはグラフが塗りつぶされるまで交互に表示されます。
- <width>
- このストライプの幅(
0
~1
)。1
はグラフの全幅です。ストライプはグラフが塗りつぶされるまで繰り返されます。 追加のストライプごとに <color> と <width> を繰り返します。ストライプが 2 つ以上必要です。ストライプはグラフが塗りつぶされるまで交互に表示されます。
例
説明 | 例 |
---|---|
|
![]() chf= |
|
![]() chf= |
グリッド線 chg
[折れ線、棒、レーダー、散布図]
chg
パラメータを使用すると、グラフ上に実線または点線のグリッド線を指定できます。
このパラメータでは、線の太さや色を指定することはできません。グラフ全体に線を引くその他の方法については、シェイプ マーカー(chm
タイプ h、H、v、V)、範囲マーカー(chm
)、軸の目盛り(chxtc
)をご覧ください。
構文
chg= <x_axis_step_size>,<y_axis_step_size>,<opt_dash_length>,<opt_space_length>,<opt_x_offset>,<opt_y_offset>
- <x_axis_step_size>、<y_axis_step_size>
- グラフに表示する x または y グリッド線の数を計算するために使用します。100 / step_size = グラフ上のグリッド線の数。したがって、20,25 は 5 本の垂直グリッド線と 4 本の水平グリッド線を意味します。
- <opt_dash_length>、<opt_space_length>
- (省略可): 点線のグリッド線を定義するために使用します。1 つ目のパラメータは、各線の長さ(ピクセル単位)です。2 つ目のパラメータは、ダッシュの間隔(ピクセル単位)です。実線の場合は、<opt_space_length> に 0 を指定します。デフォルト値は 4,1 です。
- <opt_x_offset>,<opt_y_offset>
- (省略可)x グリッド線と y グリッド線をそれぞれオフセットする、グラフのスケールに応じた単位数。正の値または負の値を指定できます。この値を指定する場合は、前の値もすべて指定する必要があります。デフォルト値は 0,0 です。
例
説明 | 例 |
---|---|
これらの例では、 |
![]() chg=20,50 ![]() chg=20,50 |
この例では、スペースを大きくして、薄いグリッド線( |
![]()
|
実線のグリッド線を表示するには、 また、このグラフでは X 軸のオフセットとして 10 が指定されています。 |
![]() chg=20,50,1,0,10 |
このグラフの X 軸のオフセットは 10、Y 軸のオフセットは 20 です。 |
![]() chg=20,50,3,3,10,20 |
動的アイコン マーカー chem
[棒グラフ、折れ線、レーダー、散布図]
グラフを作成し、1 つ以上の動的アイコンを chem 値として指定します。chem
の構文は次のとおりです。紫色で表示されるセミコロンで区切られた項目はすべて省略可能です。URL では、どれも完全に省略できます。| 文字で区切って複数の構文文字列を含めると、複数のマーカーを含めることができます。動的アイコンについて詳しくは、動的アイコンのページをご覧ください。
ダイナミック アイコンとして別のグラフ内にグラフを埋め込むこともできます。下記の埋め込みグラフのサブセクションをご覧ください。
chem= y;s=<icon_string_constant>;d=<marker_data_string>;ds=<which_series>;dp=<which_points>;py=<opt_z_order>;po=<x,y>;of=<x_offset,y_offset>
|...| y;s=<icon_string_constant>;d=<marker_data_string>;ds=<which_series>;dp=<which_points>;py=<opt_z_order>;po=<x,y>;of=<x_offset,y_offset>
- s=<icon_string_constant>
- ダイナミック アイコンのページにある、ダイナミック アイコンの文字列マーカー定数。この定数は、独立型アイコンの
chst
パラメータとほぼ同じです。ただし、独立型アイコンの文字列が「d_」で始まる場合、同等のダイナミック アイコン マーカーを取得するには、この接頭辞を削除する必要があります。例: 独立型アイコンはd_bubble_icon_text_small
、同等のダイナミック アイコン マーカーはbubble_icon_text_small
です。 - d=<マーカーデータ文字列marker_data_string>
- この特定のマーカータイプに必要なデータです。これは、同等の独立型アイコンの
chld
パラメータで使用される文字列と同じ文字列を保持します。ただし、すべての | 区切り文字をカンマで置き換える必要があります( 複数行のテキストには、パイプマーカーではなくカンマを使用してください)。データ文字列内では、パイプ(|)、アット(@)、等号(=)、カンマ(,)、セミコロン(;)も @ 記号でエスケープする必要があります。例:hello@,+world
、5@@10+cents+each
- ds=<which_series>
- (省略可): このマーカーが属するデータ系列の 0 から始まるインデックス。デフォルト値は 0 です。
- dp=<which_points>
- (省略可): マーカーの描画に使用するデータポイントを指定します。デフォルト値は 0(系列の最初の点)です。次のいずれかの形式を使用します。
n.d
- マーカーを描画するデータポイント。n.d は、シリーズにおけるゼロベースのインデックスです。整数以外の値を指定した場合、小数点は計算された中間点を示します。たとえば、3.5 はポイント 3 とポイント 4 の中間を意味します。range,<start>,<end>,<step>
- start から end までの範囲のすべての step データポイントにマーカーを描画します。start と end はインデックス値で、中間値を示す浮動小数点数を指定できます。値はすべて省略可能です。デフォルトは、start=0、end=last item、step=1 です。値をスキップする場合も中間カンマを含める必要がありますが、空の末尾カンマを含める必要はありません。例:dp=range,0,4
は要素 0 ~ 4 にマーカーを描画します。dp=range,5,10,2
は要素 5、7、9 にマーカーを描画します。dp=range,2
は 3 番目以降のポイントにポイントを描画します。dp=range,3,,1.5
は 4 番目のアイテムから最後のアイテムまでの 1.5 データポイントごとにマーカーを描画します。all
- すべての要素にマーカーを描画します。range,0,end_index
と同じです。例:dp=all
every,n
- n 番目のマーカーごとにマーカーを描画します。例:dp=every,2
はアイテム 0、2、4 にマーカーを描画します。
- py=<z_order>
- (省略可): マーカーを描画するレイヤ。他のマーカーや他のすべてのグラフ要素との比較を行います。これは -1.0 ~ 1.0 の浮動小数点数です。-1.0 は最下位、1.0 は上位です。グラフ要素(線と棒)は 0 のすぐ下にあります。2 つのマーカーが同じ値を持つ場合は、URL で指定された順序で描画されます。デフォルト値は 0.0 です(グラフ要素のすぐ上)。
- po=<x,y>
- (省略可): マーカーを描画するグラフ上の絶対位置。x と y は 2 つの浮動小数点数です。0.0,0.0 は左下隅、1.0,1.0 は右上隅です。
- of=<x_offset,y_offset>
- (省略可): アイコンを通常の位置からオフセットするピクセル数。x_offset と y_offset は、正または負の整数です。埋め込みの動的アイコンでは、この値を指定することが重要です。ポイントの上でマーカーが垂直方向と水平方向に中央揃えで配置されるため、データマーカーとポイントが整列しない可能性が高くなります。垂直ピンの適切なオフセットは
of=0,22
です。傾斜ピンの適切なオフセットは、傾斜の方向に応じてof=-12,20
またはof=12,20
ですが、実験が必要になる場合もあります。デフォルト値は 0,0 です。
例
説明 | 例 |
---|---|
同じダイナミック アイコンを自立型の画像として作成し、折れ線グラフのマーカーとして使用した例を次に示します。
グラフ 1: グラフ 2: |
|
動的アイコン マーカーは、その地点の水平方向と垂直方向の中央に配置されます。そのため、尾部分付きの動的アイコンを使用した場合、尾の部分はグラフのポイントに配置されません。マーカーの中心が配置されます。最初のグラフでは、データポイント 3 にマークが配置されています。実際には、テールが線のマークの少し右に配置されています。 2 つ目のグラフでは、 |
![]() chem=y;
chem=y; |
複数の動的アイコンを含めるには、「|」文字で区切って構文文字列を繰り返します。 この例では、範囲と 2 つの個別のマーカーを示しています。 垂直ピンのオフセットは 0,22、傾斜したピンのオフセットは 12,20 で、ピンのポイントが説明されているシリーズと揃っていることに注目してください。 |
![]() chem= |
複数行のテキスト マーカーを示しています。バブルはテキストに合わせてサイズ変更され、グラフ上で中央に配置されるため、テキストを追加した後はマーカーをオフセットする必要があります。d データ文字列では、テキスト内の改行がカンマによって示されることに注意してください。 |
![]() chem=y; |
埋め込みグラフ
動的アイコンの構文を使用すると、1 つのグラフを別のグラフ内に埋め込むことができます。
埋め込みグラフ マーカーには、バブル内の埋め込みグラフと、バブルなしの埋め込みグラフの 2 つのスタイルがあります。以下にその両方の例を示します。
![]() |
![]() |
バブル付きのグラフ |
バブルなしのグラフ |
バブルなしグラフとバブル埋め込みグラフの両方における、s=<icon_string_constant>;d=<marker_data_string>
パラメータの詳細を以下に示します(ここでは、上記のパラメータの説明を省略します)。
構文
Non-bubble: chem=y;s=ec;d=<alignment_string>,<chart_data>;ds=<which_series>;dp=<which_points>;py=<z_order>;po=<x,y>;of=<x_offset,y_offset> Bubble: chem=y;s=ecb;d=<frame_type>,<padding>,<frame_color>,<fill_color>,<chart_data>;ds=<which_series>;dp=<which_points>;py=<z_order>;po=<x,y>;of=<x_offset,y_offset>
- alignment_string
- [バブル以外の場合のみ] バブルのない埋め込みグラフのどの部分がデータポイントに固定されるか。次の図に示す 2 文字の文字列定数のいずれかを選択します。
- chart_data
- 埋め込みグラフのデータ。埋め込むグラフの URL の
https://chart.googleapis.com/chart?
より後の部分です。以下のツールを使用するか、ツールの下にリストされているルールに従います。 - frame_type
- (バブルのみ): ダイナミック アイコンのフレーム スタイル定数のいずれか。
- パディング
- [バブルのみ] バブル内のパディング(ピクセル単位)。
- frame_color
- [バブルのみ] フレームの色。# 記号なしの 6 桁の HTML 色文字列で指定します。例:
FF00FF
- fill_color
- [ふきだしのみ] ふきだしの塗りつぶしの色。# 記号なしの 6 桁の HTML 色文字列で指定します。例:
FF00FF
埋め込みグラフのデータ
グラフの文字列を生成するには、次の変換ツールを使用します。あるいは、ツールの後に指定したルールに沿って、グラフの文字列を手動で生成します。
手動変換のルール
1. まず、パラメータと値のペアに含まれる後続の文字を、以下の順序で次の値に置き換えます。
置き換える | このように |
---|---|
%7C または %7c |
| |
@ |
@@ |
% |
25% |
, |
@, |
| |
@| |
; |
@; |
& |
%26 |
= |
%3D |
2. 次に、parameter1=value1¶meter2=value2...
ペアのすべての &
値と =
値をカンマに置き換えます。
シェイプ マーカー chm
[棒グラフ、折れ線、レーダー、散布図]
グラフ上のすべてのデータポイントまたは個々のデータポイントに、グラフィカル マーカーを指定できます。複数のマーカーが同じポイントを占有している場合、マーカーは chm
パラメータで設定された順序で描画されます。データポイント上にテキスト マーカーを作成することもできます。これについては、データポイント マーカーをご覧ください。
パイプ文字(|
)を使用して chm
パラメータを区切ることで、図形マーカーを他の chm
パラメータと組み合わせることができます。
構文
マークするシリーズごとに、次のパラメータのセットを 1 つ指定します。複数のシリーズをマークするには、追加のパラメータ セットをパイプ文字で区切って作成します。すべてのシリーズをマークアップする必要はありません。データ系列にマーカーを割り当てない場合、マーカーは取得されません。
散布図では、シェイプ マーカーの動作が若干異なります。詳しくは、そちらのドキュメントをご覧ください。
chm= [@]<marker_type>,<color>,<series_index>,<opt_which_points>,<size>,<opt_z_order>,<opt_offset> |...| [@]<marker_type>,<color>,<series_index>,<opt_which_points>,<size>,<opt_z_order>,<opt_offset>
- @
- (省略可): マーカータイプの前にオプションの @ 文字を追加する場合は、<opt_who_points> に x:y 形式を使用します。
- <marker_type>
- 使用するマーカーのタイプ。次のいずれかのタイプを指定します。
a
- 矢印c
- クロスC
- 長方形。長方形マーカーの場合、データ シリーズが 2 つ以上必要です。シリーズ 0 は下端、シリーズ 1 は上端を表します。<size> には長方形の幅をピクセル単位で指定します。d
- ひし形E
- エラーバー マーカー() このマーカーを作成するには、2 つのデータ系列を作成します。1 つ目の値は最下位の値、2 つ目の系列内の対応する点は上部の値です。また、拡張された <size> 構文である line_thickness[:top_and_bottom_width] も公開されています。ここで、top_and_bottom_width は任意です。以下の例をご覧ください。
h
- 指定した高さでのグラフの水平線。 (<opt_which_points> パラメータの有効な形式は、opt_which_points のみです。)H
- 指定されたデータマーカーを通る水平線。これにより、線の長さを正確に指定できる拡張 <size> 構文(line_thickness[:length])がサポートされます。:length は任意で、デフォルトはグラフ領域の幅全体になります。o
- 円s
- 正方形v
- X 軸からデータポイントまでの垂直線V
- 長さを調整できる垂直線。これにより、拡張された <size> 値の構文(line_thickness[:length])がサポートされます。:length は任意で、デフォルトはグラフ領域全体の高さです。 マーカーはデータポイントが中央に配置されます。x
- X
- <color>
- : この系列のマーカーの色(RRGGBB の 16 進形式)。
- <series_indexseries_index>
- : マーカーを描画するデータ系列のゼロから始まるインデックス。
h
マーカーや、x/y 位置(@ 文字で始まる)で位置を指定するマーカーでは無視されます。非表示のデータ系列をマーカーのソースとして使用できます。詳しくは、複合グラフをご覧ください。グループ化した縦棒グラフでは、特別な拡張構文がサポートされており、マーカーを特定の棒に合わせることができます。 - <opt_which_points>
- (省略可): マーカーを描画するポイント。デフォルトはすべてのマーカーです。次のいずれかの値を使用します。
n.d
- マーカーを描画する場所。意味はマーカーのタイプによって異なります。- h を除くすべてのタイプ - マーカーを描画するデータポイント。n.d は、系列のゼロから始まるインデックスです。整数以外の値を指定した場合、小数点以下は計算された中間点を示します。たとえば、3.5 はポイント 3 とポイント 4 の中間を意味します。
h
- 0.0 ~ 1.0 の数値。0.0 はグラフの最下部、1.0 はグラフの上部です。
-1
- すべてのデータポイントにマーカーを描画します。このパラメータを空のままにして、すべてのデータポイントに描画することもできます。-n
- n 番目のデータポイントごとにマーカーを描画します。浮動小数点値。n が 1 より小さい場合、グラフは中間点を追加で計算します。たとえば、-0.5 はデータポイントの 2 倍のマーカーを配置します。start:end:n
- start から end までのインデックス値(両端を含む)の範囲内の n 番目のデータポイントごとにマーカーを描画します。すべてのパラメータは省略可能です(指定されていない可能性があるため、3::1 は 4 番目の要素から最後のステップ 1 まで)。このパラメータを完全に省略した場合、デフォルトの first:last:1 になります。すべての値には浮動小数点数を使用できます。start と end には負の値を指定して、最後の値から逆方向にカウントできます。start と end の両方を負の値にする場合は、昇順で指定します(例: -6:-1:1)。 ステップの n 値が 1 未満の場合は、指定されたデータ値を補間して追加のデータポイントを計算します。デフォルト値は first:last:1 ですx:y
- グラフ上の特定の x、y ポイントにマーカーを描画します。 このポイントは線上にある必要はありません。このオプションを使用するには、マーカータイプの前に @ 文字を追加します。座標を浮動小数点値として指定します。ここで、0:0
はグラフの左下隅、1:1
はグラフの右上隅です。たとえば、グラフの中心に 15 ピクセルの赤色のひし形を追加するには、@d,FF0000,0,0.5:0.5,15
を使用します。
- <size>
- : マーカーのサイズ(ピクセル単位)。多くの場合、このパラメータには単一の数値を指定します。V、H、S マーカーは、構文 <size>[:width] をサポートしており、オプションの 2 番目の部分には線またはマーカーの長さを指定します。
- <opt_z_order>
- (省略可): マーカーを描画するレイヤ。他のマーカーや他のすべてのグラフ要素との比較を行います。これは -1.0 ~ 1.0 の浮動小数点数です。-1.0 は最下部、1.0 は上部です。グラフの要素(線と棒)が 0 より少し小さい。2 つのマーカーに同じ値が設定されている場合、URL で指定された順序で描画されます。デフォルト値は 0.0 です(グラフ要素のすぐ上)。
- <opt_offset>
- (省略可): 指定した位置からの水平方向と垂直方向のオフセットを指定できます。「:」区切り文字を使用した構文は次のとおりです(
reserved:<horizontal_offset>:<vertical_offset>
)。指定する場合、<opt_z_order> のchm
パラメータ文字列に空の ,, 値を含めることができます。例:o,FF9900,0,4,12,,:10 o,FF9900,0,4,12.0,,:-10:20 o,FF9900,0,4,12,1,::20
- reserved - 空白のままにします。
<horizontal_offset>
- 水平オフセットを指定する正または負の数値(ピクセル単位)。省略可。使用しない場合は空白のままにします。<vertical_offset>
- 垂直オフセットを指定する正または負の数値(ピクセル単位)。省略可。使用しない場合は空白のままにします。
例
説明 | 例 |
---|---|
図形マーカーと線マーカーの例をいくつか示します。
|
![]() chm= |
1 つのデータ系列にひし形を使用し、もう 1 つのデータ系列に円を使用する例を次に示します。 複数のマーカーが同じポイントを占有している場合、マーカーは |
![]() chm= |
次の折れ線グラフでは、1 秒ごとに 1 つのデータポイントにマーカーが配置されています(-2 は 1 つおきを意味します)。 |
![]() chd=t: |
次の折れ線グラフには、データポイントの 2 倍のマーカー数が含まれます(-0.5 は 0.5 ポイントごとを意味します)。 | ![]() chd=t: |
この例では、h マーカーと v マーカーを使用して、カスタムの色と太さでグリッド線を作成する方法を示しています。Z オーダーの値(最後の値)は -1 に設定され、グリッド線がデータラインの下に描画されます。 |
![]() chm= |
次のグラフでは、折れ線グラフに垂直の塗りつぶし線を追加しています。
|
![]() chm= |
次のサンプルでは、正確な座標を使用してグラフに矢印とテキスト マーカーを追加しています。最初の D マーカーは、棒の下にあるトレース線です。2 つ目のマーカーは矢印、3 つ目のマーカーは矢印のテキストです。 | ![]() chm= |
特定のデータポイント(H )に固定された水平線は、相対値を表示したり、グラフ上のデータ値の高さを強調したりする場合に便利です。 |
![]() chm=H,FF0000,0,18,1 |
このグラフは、<size> パラメータで線の太さと長さを指定できるマーカーを示しています。
|
title="cht=lc&chd=s:2gounjqLaCf,jqLaCf2goun&chco=008000,00008033&chls=2.0,4.0,1.0&chs=250x150&chm=H,990066,1,2,5:50chm= |
テキスト マーカーとデータ値マーカーchm
[棒グラフ、折れ線、レーダー、散布図]
グラフ上の特定のポイントに、カスタム テキストや書式付きのデータを使用してラベルを付けることができます。
パイプ文字(|
)を使用して chm
マーカーを結合し、chm
パラメータ セットを区切ることができます。
文字列値に関する注意: ラベルの文字列には、URL セーフな文字のみを使用できます。安全のためには、文字セット 0-9a-zA-Z
にない文字を含む文字列は URL エンコードする必要があります。URL エンコーダは、Google ビジュアリゼーションのドキュメントにあります。
構文
マークするシリーズごとに、次のパラメータのセットを 1 つ指定します。複数のシリーズをマークするには、追加のパラメータ セットをパイプ文字で区切って作成します。すべてのシリーズをマークアップする必要はありません。データ系列にマーカーを割り当てない場合、マーカーは取得されません。
chm= <marker_type>,<color>,<series_index>,<opt_which_points>,<size>,<opt_z_order>,<opt_placement> |...| <marker_type>,<color>,<series_index>,<opt_which_points>,<size>,<opt_z_order>,<opt_placement>
- <marker_type>
- 使用するマーカーのタイプ。以下のタイプから選択できます。
f<text>
- テキストを含むフラグ。文字「f」に続けて URL エンコードされたカスタム テキストを指定します。テキスト マーカー内でカンマをエスケープするには、カンマの前に \ 記号を付けます。例:fHello\,+World!
t<text>
- 単純なテキスト マーカーです。文字「t」の後にカスタム URL エンコード テキストを指定します。テキスト マーカー内でカンマをエスケープするには、カンマの前に \ 記号を付けます。例:tHello\,+World!
A<text>
- アノテーション マーカーです。これはフラグマーカーに似ていますが、マーカーは重複しないように位置を調整します。<opt_which_points> に使用できるのは、系列内のポイントのインデックスを示す opt_which_points のみです。N<formatting_string>
- この時点のデータの値。必要に応じて書式を指定します。chds
パラメータを使用しない場合(カスタム スケーリング)は、エンコードされた正確な値になります。このパラメータを任意の形式タイプで使用した場合、値は指定した範囲にスケーリングされます。数値マーカー付きのchds
の例を以下に示します。積み上げ棒グラフでこのマーカータイプを使用する場合、<series_index> に -1 を指定すると、この積み上げ棒グラフのすべての値の合計を示すマーカーが表示されます。書式設定文字列の構文は次のとおりです。
<preceding_text>*<number_type><decimal_places>zs<x or y>*<following_text>
。
これらの要素はすべて省略可能です。各要素の意味は次のとおりです。<preceding_text>
- 各値の前に配置されるテキスト。*...*
- リテラル アスタリスクでラップされたオプションのブロック。数値の書式設定の詳細を指定できます。次の値がサポートされています。すべてオプションです。<number_type>
- 数値書式。数値に使用します。次のいずれかを選択します。f
- [デフォルト] 浮動小数点形式。 <decimal_places> 値とともに精度も指定することを検討してください。p
- パーセント書式。% 記号が自動的に追加されます。注: この形式を使用すると、0.0 ~ 1.0 のデータ値は 0 ~ 100% にマッピングされます(たとえば、0.43 は 43% と表示されます)。e
- 指数表記の形式。c<CUR>
- 指定した通貨で、適切な通貨マーカーを使用して数値を書式設定します。<CUR>
は、3 文字の通貨コードに置き換えます。(例: ユーロの場合はcEUR
)。コードの一覧は ISO のウェブサイトに記載されていますが、すべての記号がサポートされているわけではありません。
<decimal_places>
- 表示する小数点以下の桁数を指定する整数。値はこの長さに丸められます(切り捨てられません)。デフォルトは 2 です。z
- 末尾のゼロを表示します。デフォルトは no です。s
- グループ セパレータを表示します。デフォルトは no です。x
またはy
- 指定された x 座標または y 座標のデータを表示します。x データの意味はグラフの種類によって異なります。グラフを試してその意味を判断してください。デフォルトは「y」です。
<following_text>
- 各値の後に表示するテキスト。
- <color>
- : このセットのマーカーの色(RRGGBB の 16 進形式)。
- <series_indexseries_index>
- : マーカーを描画するデータ系列のゼロから始まるインデックス。積み上げ棒グラフで、マーカーの種類が N(データポイント値)の場合、-1 を指定して、棒の積み重ねごとに合計値のマーカーを作成できます。以下に例を示します。
- <opt_which_points>
- (省略可): マーカーを描画するポイント。デフォルトはすべてのマーカーです。次のいずれかの値を使用します。
n.d
- マーカーを描画するデータポイント。n.d は、シリーズ内のゼロから始まるインデックスです。整数以外の値を指定した場合、小数点以下は計算された中間点を示します。たとえば、3.5 はポイント 3 とポイント 4 の中間点を意味します。-1
- すべてのデータポイントにマーカーを描画します。このパラメータを空のままにして、すべてのデータポイントに描画することもできます。-n
- n 番目のデータポイントごとにマーカーを描画します。start:end:n
- start から end までのインデックス値(両端を含む)の範囲内の n 番目のデータポイントごとにマーカーを描画します。すべてのパラメータは省略可能です(指定されていない可能性があるため、3::1 は 4 番目の要素から最後のステップ 1 まで)。このパラメータを完全に省略した場合、デフォルトの first:last:1 になります。すべての値には浮動小数点数を使用できます。start と end には負の値を指定して、最後の値から逆方向にカウントできます。start と end の両方が負の値の場合は、値を昇順で指定する必要があります(例: -6:-1:1)。ステップの n 値が 1 未満の場合は、指定されたデータ値を補間して追加のデータポイントを計算します。デフォルト値は first:last:1 ですx:y
- [N タイプのマーカーではサポートされていません] グラフ上の特定の x、y ポイントにマーカーを描画します。このポイントは線上にある必要はありません。このオプションを使用するには、マーカータイプの前にアットマーク(@
)を追加します。座標は浮動小数点値として指定します。ここで、0:0
はグラフの左下隅、0.5:0.5
はグラフの中心、1:1
はグラフの右上隅です。たとえば、グラフの中心に 15 ピクセルの赤色のひし形を追加するには、@d,FF0000,0,0.5:0.5,15
を使用します。
- <size>
- : マーカーのサイズ(ピクセル単位)。3 つ目のデータ系列(ポイントのサイズの指定に使用)を含む散布図の場合、この値はデータ範囲ごとにスケーリングされます。たとえば、データ範囲が 0 ~ 100 で <size> が 30 の場合、データ値 100 は幅 30 ピクセル、データ値 50 は幅 15 ピクセル、というようになります。
- <opt_z_order>
- (省略可): マーカーを描画するレイヤ。他のマーカーや他のすべてのグラフ要素との比較を行います。これは -1.0 ~ 1.0 の浮動小数点数です。-1.0 は最下部、1.0 は上部です。グラフ要素(線と棒)が 0 よりも小さい。2 つのマーカーに同じ値が設定されている場合、URL で指定された順序で描画されます。デフォルト値は 0.0 です(グラフ要素の真上)。
- <opt_placement>
- (省略可): データポイントに基づき、このマーカーを配置する場所を指定する、プレースメントの詳細情報です。水平方向または垂直方向の相対位置や、オフセットを指定できます。次のように、プレースメント構文は区切り文字「:」を使用した文字列です。
<horizontal_and_vertical_justification>:<horizontal_offset>:<vertical_offset>
のすべての要素は省略可能です。指定する場合、<opt_z_order> のchm
パラメータ文字列に空の ,, 値を含めることができます(例:N,000000,0,1,10,,b
、N,000000,0,1,10,,lv
、N,000000,0,1,10,,r::10
)。- horizontal_and_vertical_justification
- マーカーのアンカー ポイント。これは両端揃えとは反対に動作するため、左のアンカーなら実際にはデータポイントの右にマーカーが配置されます。次のリストから、水平方向または垂直方向、あるいはその両方の両端揃えを選択できます。
- 横置き: 「l」、「h」、「r」 - 左、中央、右に固定します。デフォルトは「l」です。
- 垂直方向の配置: 'b'、'v'、't' - 垂直方向に、下部、中央、上部に固定されます。デフォルトは「b」です。
- 棒を相対的に配置する [棒グラフのみ]: 's'、'c'、'e' - 棒の底部、中央、上部。積み上げグラフの場合、これは棒全体ではなく、各系列の棒のセクションに対して相対的に算出されます。指定された系列インデックスが -1(スタック合計)の場合、棒全体に対する値です。「be」や「vs」など、縦向きプレースメントの値と組み合わせることができます。 デフォルト値は「e」です。
- horizontal_offset
- このマーカーの水平オフセット(ピクセル単位)。デフォルトは 0 です。
- vertical_offset
- このマーカーの垂直オフセット(ピクセル単位)。棒グラフ以外のデフォルト: 15、棒グラフのデフォルト: 2。
説明 | 例 | |
---|---|---|
棒グラフの値のラベルの例を次に示します。 1 つ目のグラフ( 2 つ目のグラフ( |
|
|
この例は、46、39、29、30、43、41 の単純エンコードされた値を持つグラフを示しています。単純なエンコード範囲は 0 ~ 61 です。
. |
![]() chd=s:underp |
|
最小ポイントにテキストラベル、最大ポイントにフラグラベルがあるグラフの例を次に示します。 |
|
|
この例は、個々の系列の値と系列の合計値を含む積み上げグラフを示しています。積み上げシリーズの値を表示するには、「c」配置オプションを使用する必要があります。使用しない場合、上部の棒の値が各棒の上部にある合計値と重なります。 | ![]() chm= |
|
垂直と水平の配置がどのように機能するかについて、さらにいくつかのデモンストレーションを行います。この例は、棒グラフのアンカー値のさまざまな組み合わせを示しています(垂直方向の配置に s、c、e を使用しています)。右アンカーはマーカーを左に移動し、上部のアンカーはマーカーを下に動かします(逆も同様)。赤い点は各バーの底部、中央、上部を示しています。数値は、棒ごとに異なるアンカー値を使用して固定されたデータ値です。 | ![]() chm= |
|
アノテーション マーカーは、ラベルが重ならないようにラベルの位置を自動的に調整します。最初の chm 値は線の塗りつぶしに使用します。以下の値はすべてアノテーション マーカーです。 |
![]() chm=B,C5D4B5BB,0,0,0 |
|
もう一つのアノテーション マーカーの例は、スイスの都市の高度を示しています。 | ![]() |
範囲マーカーchm
[Bar, Candlestick, Line, Radar, Scatter]
背景の塗りつぶしの帯域(水平方向または垂直方向)に色を付けることで、グラフの特定の領域をハイライト表示できます。
パイプ文字(|
)を使用して chm
マーカーを結合し、chm
パラメータ セットを区切ることができます。
構文
描画する帯域ごとに、次のパラメータのセットを 1 つ指定します。複数の帯を描画するには、追加のパラメータ セットをパイプ文字で区切って作成します。範囲は指定された順序で描画されるため、最後に描画される範囲は前の範囲の上に描画されます。
chm= <direction>,<color>,0,<start_point>,<end_point> |...| <direction>,<color>,0,<start_point>,<end_point>
- <direction>
- 水平または垂直のシェーディングを指定します。水平方向の範囲には
r
、垂直範囲にはR
を使用します。 - <color>
- RRGGBB 形式の 16 進数で表した範囲の色。
- 0
- 予約済み - ゼロでなければなりません。
- <start_point>
- 範囲の開始位置。
- 水平範囲マーカーの場合、Y 軸上の位置になります。ここで、
0.00
はグラフの最下部、1.00
はグラフの上部です。 - 垂直範囲マーカーの場合、これは X 軸上の位置です。
0.00
はグラフの左側、1.00
はグラフの右側です。
- <end_point>
- 範囲の終了位置。
- 水平範囲マーカーの場合、Y 軸上の位置になります。ここで、
0.00
はグラフの最下部、1.00
はグラフの上部です。 - 垂直範囲マーカーの場合、これは X 軸上の位置です。
0.00
はグラフの左側、1.00
はグラフの右側です。
例
説明 | 例 |
---|---|
範囲マーカーは、細い線または帯状のカラーのいずれかです。
|
![]()
|
この例は、垂直範囲マーカーを示しています。1 つ目のマーカーは赤い線( |
![]()
|
マーカーは指定された順序で描画されます。この例では、赤色の垂直マーカーが薄青色の水平マーカーより前に描画されています。 |
![]() chm= |
次の折れ線グラフの例では、範囲マーカーを使用して、グラフ上の基準線、中間線、上部にかすかな水平線を描画しています。 |
![]()
|
線マーカーchm=D
[棒グラフ、ローソク足、折れ線、レーダー、散布図]
データをトレースする線をグラフに追加できます。ほとんどの場合、複合グラフで使用されます。
複数の行を追加する(またはこれを他の chm
マーカーと組み合わせる)には、パイプ文字(|
)を使用して chm パラメータ セットを区切ります。このパラメータで破線マーカーを作成することはできません。
構文
chm= D,<color>,<series_index>,<which_points>,<width>,<opt_z_order>
- D
- これが線マーカーであることを示します。
- <color>
- 線の色(RRGGBB の 16 進形式)。
- <series_indexseries_index>
- 線の描画に使用されるデータ系列のインデックス。データ系列のインデックスは、最初のデータ系列の場合は
0
、2 つ目のデータ系列の場合は1
のようになります。 - <which_points>
- 線の描画に使用するシリーズ内の点。次のいずれかの値を使用します。
0
- 系列内のすべての点を使用します。start:end
- 系列内の特定の範囲(start から end まで)を使用します(ゼロベースのインデックス)。 浮動小数点値を使用して中間点を指定することも、start または end を空白のままにして最初または最後のデータポイントを示すこともできます。start と end には、最後の値からの逆インデックスとして負の値を指定できます。start と end の両方が負の値の場合は、値を昇順で記述します(例: -6:-1)。
- <size>
- ラインの幅(ピクセル単位)。
- <opt_z_order>
- (省略可): マーカーを描画するレイヤ。他のマーカーや他のすべてのグラフ要素との比較を行います。これは -1.0 ~ 1.0 の浮動小数点数です。-1.0 は最下部、1.0 は上部です。グラフ要素(線と棒)が 0 よりも小さい。2 つのマーカーに同じ値が設定されている場合、URL で指定された順序で描画されます。デフォルト値は 0.0 です(グラフ要素の真上)。
例
説明 | 例 |
---|---|
棒グラフにマーカーの線を描画する例です。Z オーダーは |
![]() chm=D,0033FF,0,0,5,1 |
これは同じ棒グラフですが、折れ線のみのデータ系列が追加されています。これは複合グラフの例です。複合グラフを描画するには、 詳しくは、複合グラフをご覧ください。 |
![]() chm=D,0033FF,1,0,5,1 |
データ関数chfd
[すべて chd
のグラフ]
muParser 関数の構文を使用して、グラフデータに対して実行するカスタム関数を指定できます。関数で使用されるデータは、次の 2 つのソースのいずれかから取得されます。
chd
のデータ系列 - データは、chd
で指定した系列から取得されます。chfd
パラメータ自体で宣言される値の範囲 - 任意のデータ範囲の開始値、停止値、ステップ値を宣言します。
いずれの場合も、出力を chd
の既存の系列に割り当てる必要があります。その系列は関数の出力によって上書きされます。グラフはすべての関数の処理が完了した後にのみレンダリングされるため、複数の関数を同じデータ系列に出力する場合、関数は指定された順序で実行されますが、グラフには最終的な関数の出力のみがプロットされます。関数を連結すると、前の関数が出力したシリーズを 1 つの関数が入力として受け取ることができます。
関数行に色または chm
マーカーを割り当てるには、関数の系列インデックスに色またはマーカーを割り当てます。マーカーは、関数が操作した後のデータに従って配置されます。
構文
chfd= <output_series_index>,<function_data>,<function_string> |...| <output_series_index>,<function_data>,<function_string>
- <出力シリーズのインデックスoutput_series_index>
- 関数の出力を書き込む
chd
のデータ系列のゼロベースのインデックス。既存のデータはすべて、関数の出力によって完全に上書きされます。シリーズが関数の入力として使用されていない場合は、そのシリーズに単一のダミー値を割り当てることをおすすめします。 - <function_data>
- プロットする変数とデータ。データは、定義した範囲、または
chd
データ系列のいずれかから取得できます。複数の変数に;(セミコロン)区切り文字を使用して、関数ごとに複数の変数を指定できます。1 つの関数に複数の変数を定義し、これらの変数のポイント数が異なる場合、関数は最初のエンドポイントに到達した時点で停止します。たとえば、x=1 ~ 5 のステップ 1 と y=1 ~ 10 のステップ 1 の両方を定義する関数では、5 番目のポイントに達した時点で終了します。
<variable_name>,<input_series_index>
または
<variable_name>,<start>,<end>,<step>
- variable_name - 変数の任意の文字列名です。 この関数は、function_string で定義される関数で使用します。
- input_series_index - 入力データとして使用する
chd
データ系列のインデックス。 - start - 範囲の開始数値。
- 終了 - 範囲の終了数値。
- step - start から end までのステップの数値。 正数でも負数でもかまいませんが、0 にはできません。
x,0,100,1
が、値 0、1、2、... 100 を持つx
という名前の変数を宣言します。x,0,100,1;r,0,3.1,.1
は同じx
変数に加えて、値が 0、0.1、0.2、...、3.0、3.1 のr
という名前の変数を宣言します。x,0
は、最初のchd
系列のデータを使用する x という名前の変数を宣言します。これらの変数は function_string で使用されます。 function_string で指定しない限り、グラフにプロットされません。 ステップが小さいほど、グラフは滑らかになります。 - <関数の文字列function_string>
- muParser 構文で記述した関数。この関数は、variable_data で指定された変数とデータに適用されます。このローカル関数セットで宣言された変数のみを参照でき、パイプで連結された別の
chfd
パラメータのセットで参照することはできません。概要 muParser 関数(最小、最大合計、平均)はサポートされていません。重要: 関数では必ず+
ではなく%2B
を使用してください。
例
説明 | 例 |
---|---|
単純な正弦波です。注意点:
|
![]() cht=lc |
この行では、chd パラメータのデータを使用しています。 |
![]() chd=t:5,10 |
関数行と非関数行が混在しています。 系列の色パラメータ 関数の出力上にマーカーが配置されていることに注目してください。データポイントは start、end、step から計算されます。範囲が 0 ~ 11 のステップ 0.1、ポイント 1 は 0、ポイント 1 は 0.1 というように、値が 11 のポイント 110 まで続きます。 |
![]() chd=t: |
2 つのディメンションの関数を定義するには、1 つの
|
![]() cht=lxy |
これらの画像をクリックして開き、チャート プレイグラウンドでプレイしてみてください。夢中になるでしょう。 |