My favorites | 日本語 | Sign in

Google Chart API

デベロッパー ガイド

Google Chart API を使用すると、チャートを動的に生成できます。Chart API の動作を見るには、ブラウザ ウィンドウを開き、次の URL をコピーして貼り付けます。

http://chart.apis.google.com/chart?cht=p3&chd=t:60,40&chs=250x100&chl=Hello|World

Enter キーまたは Return キーを押すと、すぐに次の画像が表示されるはずです。

黄色い円グラフ

目次

  1. 対象読者
  2. 利用ポリシー
  3. 概要
  4. URL フォーマット
  5. 必須パラメータとオプション パラメータ
  6. チャート サイズ
  7. チャート データ
    1. テキスト エンコード
    2. データ スケーリングのあるテキスト エンコード
    3. 簡易エンコード
    4. 拡張エンコード
    5. JavaScript を使用したデータのエンコード
    6. 粒度に関するガイドライン
  8. チャート タイプ
    1. 折れ線グラフ
    2. スパークライン
    3. 棒グラフ
    4. 円グラフ
    5. ベン図
    6. 散布図
    7. レーダー チャート
    8. 地図
    9. Google-o-meter
    10. QR コード New!
    1. チャートの色
    2. 無地塗りつぶし
    3. 線形グラデーション
    4. 線形ストライプ
    5. 塗りつぶし領域
  1. ラベル
    1. チャート タイトル
    2. チャート凡例 Extended!
    3. 円グラフと Google-o-meter のラベル
    4. 複数軸ラベル
  2. スタイル
    1. 棒の太さと間隔
    2. 棒グラフの 0 座標位置
    3. 線のスタイル
    4. グリッド線
    5. 図形マーカーと範囲マーカー
  3. 文字マッピング
    1. 簡易エンコードの文字値
    2. 拡張エンコードの文字値
  4. 米国の州コード
  5. ISO 3166 国コード

トップへ戻る

対象読者

このドキュメントは、ウェブページに Google Chart API 画像を表示させたいプログラマーを対象としています。ここでは、API の使用方法と、用意されたパラメータに関する参考資料について説明します。

利用ポリシー

Google Chart API を呼び出す 1 日の回数に制限はありません。ただし Google は、悪意があるとみなした使用方法をブロックする権利を有しており、サービスの利用の明示的な拒否などを行うことができます。1 日に API を 25 万回以上呼び出すサービスの場合、予想回数を chart-api-notifications@google.com までお知らせください。

概要

Google Chart API は、URL へのレスポンスとして PNG 形式の画像を返します。生成できる画像には、折れ線グラフ、棒グラフ、円グラフなど、いくつかのタイプがあります。それぞれの画像タイプに対して、サイズ、色、ラベルなどの属性を指定できます。

ウェブページに Chart API 画像を表示するには、<img> タグに URL を埋め込みます。Chart API は、ウェブページがブラウザで表示される際に、そのページに画像をレンダリングします。

このドキュメントの画像はすべて、Chart API を使用して生成したものです。画像の URL を表示する方法は次のとおりです。

  • Firefox の場合は、右クリックして [View image] または [Properties] をクリックします。
  • Internet Explorer の場合は、右クリックして [Properties] をクリックします。

このドキュメントでは、Chart API URL で要求されるフォーマットと、用意されているパラメータについて説明します。

トップへ戻る

URL フォーマット

Google Chart API URL は、次のフォーマットに従う必要があります。

http://chart.apis.google.com/chart?<parameter 1>&<parameter 2>&<parameter n>

: URL は全体を 1 行で記述する必要があります。

パラメータとパラメータの間は、アンパサンド (&) 文字で区切ります。指定できるパラメータの数と順序に制限はありません。たとえば次の URL に対して、Chart API は次のチャートを返します。

黄色い円グラフ

http://chart.apis.google.com/chart?
chs=250x100
&chd=t:60,40
&cht=p3
&chl=Hello|World

ここで

  • http://chart.apis.google.com/chart? は Chart API がある場所です。
  • & はパラメータの区切り文字です。
  • chs=250x100 はチャートのサイズです (ピクセル単位)。
  • chd=t:60,40 はチャートのデータです。
  • cht=p3 はチャートのタイプです。
  • chl=Hello|World はチャートのラベルです。

HTML ドキュメントに Chart API 画像を表示するには、<img> タグに URL を埋め込みます。たとえば次の <img> タグを使用すると、上と同じ画像が生成されます。

<img src="http://chart.apis.google.com/chart?
chs=250x100
&amp;chd=t:60,40
&amp;cht=p3
&amp;chl=Hello|World
"
alt="Sample chart" />

: URL を HTML の <img> タグに埋め込む場合は、アンパサンド (&) の代わりに、文字実体参照 &amp; を使用してください。

トップへ戻る

必須パラメータとオプション パラメータ

少なくとも次のパラメータを指定する必要があります。

他のパラメータはすべてオプションです。次の表に、オプション パラメータをチャート タイプごとに示します。QR コードにはオプション パラメータがないので、ここでは省略しています。

パラメータ 棒グラフ 折れ線グラフとスパークライン レーダー チャート 散布図 ベン図 円グラフ Google-
o-meter
Maps
チャートの色
無地塗りつぶし 背景のみ 背景のみ
データ スケーリング  
線形グラデーション 背景のみ    
線形ストライプ 背景のみ    
チャート タイトル    
チャート凡例      
複数軸ラベル        
グリッド線        
図形マーカー        
水平範囲マーカー        
垂直範囲マーカー        
線のスタイル          
塗りつぶし領域          
棒の太さと間隔              
棒グラフの 0 座標位置              
円グラフと Google-o-meter のラベル            

トップへ戻る

チャート サイズ

チャートのサイズは、chs=<width in pixels>x<height in pixels> で指定します。

たとえば、chs=300x200 の場合、横 300 ピクセル、縦 200 ピクセルのチャートが生成されます。

地図以外のすべてのチャートの最大領域は 300,000 ピクセルです。横と縦の最大値は 1000 ピクセルなので、最大サイズの例は 1000x300、300x1000、600x500、500x600、800x375、375x800 のようになります。

地図では、最大サイズは横が 440 ピクセルで縦が 220 ピクセルです。

指定したサイズが小さすぎると、円グラフはカットされます (一部しか表示されません)。円グラフの一般的なサイズのガイドラインは、次のとおりです。

  • 2 次元グラフの場合、横が縦の約 2 倍である必要があります。
  • 3 次元グラフの場合、横が縦の約 2.5 倍である必要があります。

トップへ戻る

チャート データ

チャートを作成するには、Chart API が認識できる形式にデータをエンコードする必要があります。以下の形式のいずれかを使用します。

  • テキスト エンコードでは 0~100 までの正の浮動小数点値の文字列を使用します。
    データ スケーリングのあるテキスト エンコードでは、スケーリング パラメータと任意の正または負の浮動小数点値を組み合わせた文字列を使用します。これは、地図では使用できません。
    データ ポイントあたり 5 ピクセルを割り当てるとすると、約 500 ピクセルまでの折れ線グラフと棒グラフには整数 (1.0、2.0、...) で十分です。高解像度を希望する場合、小数第一位 (35.7 など) を含めます。テキスト エンコードは、サイズに関わらずすべてのタイプのチャートに適しています。通常このタイプのエンコードは、どのデータセットでも URL が最も長くなります。
  • 簡易エンコードでは英数字 (A~Z、a~z、0~9) を使用します。ここで、A は 0 を、B は 1 を意味し、最後の 9 は 61 を表します。このようにして、62 通りの値の解像度となります。
    データ ポイントあたり 5 ピクセルを割り当てるとすると、約 300 ピクセルまでの折れ線グラフと棒グラフにはこのエンコードで十分です。このタイプのエンコードは、どのデータセットでも URL が最も短くなります。
  • 拡張エンコードでは、英数字 (と後で説明するそれ以外のいくつかの文字) のペアを使用します。ここで、AA は 0 を、AB は 1 を意味し、最後の 2 つのピリオド (..) は 4095 を表します。このようにして、4,096 通りの値の解像度となります。
    拡張エンコードはデータ範囲が広い大きなチャートに適しています。このタイプのエンコードは、どのデータセットでも、URL の長さは簡易エンコードの 2 倍になります。

: 簡易エンコードと拡張エンコードでは通常、データをプログラムでエンコードすることになります。まずデータ エンコード用の JavaScript スニペットを参照してください。また、チャート グループのメンバーも API ライブラリを提供しています。Group で探すか、Useful links to API libraries の投稿を参照してください。

トップへ戻る

テキスト エンコード

テキスト エンコードは次のように指定します。

chd=t:<chart data string>

<chart data string> には 0 (0.0) から 100 (100.0) までの正の浮動小数点数、マイナス 1 (-1)、区切りを示すパイプ文字 (|) を含めます。

注:

  • マイナス 1 (-1) を使用して値の欠落を指定できます。
  • データセットが複数ある場合は、各セットをパイプ文字 (|) で区切ります。

例: chd=t:10.0,58.0,95.0|30.0,8.0,63.0

: テキスト エンコードでは、データセット内の最大値を使用してパーセントに変換しデータ スケーリングを行います。

トップへ戻る

データ スケーリングのあるテキスト エンコード

2 つのパラメータを使用し、データ スケーリングのあるテキスト エンコードを指定します。

chd=t:<chart data string>
chds=<data set 1 minimum value>,<data set 1 maximum value>,<data set n minimum value>,<data set n maximum value>

ここで

  • <chart data string> は正または負の浮動小数点値
  • <data set 1 minimum value> は最初のデータセットに適用する最小値
  • <data set 1 maximum value> は最初のデータセットに適用する最大値、100 の指定は省略
  • <data set n minimum value> は n 番目のデータセットに適用する最小値
  • <data set n maximum value> は n 番目のデータセットに適用する最大値、100 の指定は省略

データセットの数より少ないデータ スケーリング パラメータを指定した場合、最後のスケーリング パラメータが残りのデータセットに適用されます。チャートに単一の範囲を適用する場合は、1 組のスケーリング パラメータを指定します。

注:

  • これは地図には適用されません。
  • 範囲外の値により、欠損値を指定できます。
  • データセットが複数ある場合は、各セットをパイプ文字 (|) で区切ります。

例: chd=t:30,-60,50,120,80&chds=-80,140

トップへ戻る

簡易エンコード

簡易エンコードは次のように指定します。

chd=s:<chart data string>

ここで <chart data string> に含める文字は、AZaz09、アンダースコア (_)、カンマ (,) です。

注:

  • 大文字は、A = 0、B = 1、以下同様で Z = 25 です。
  • 小文字は、a = 26、b = 27、以下同様で z = 51 です。
  • ゼロ (0) = 52、以下同様で 9 = 61 です。
  • アンダースコア (_) を使用して値の欠落を指定できます。
  • データセットが複数ある場合は、各セットをカンマ (,) で区切ります。

データが 2 セットある場合の例として chd=s:ATb19,Mn5tz のように指定します。この最初のデータセットで、A は 0 を、T は 19、b は 27、1 は 53、9 は 61 を表します。

: 詳しい一覧表は、簡易エンコードの文字値をご覧ください。

トップへ戻る

拡張エンコード

拡張エンコードは次のように指定します。

chd=e:<chart data string>

ここで <chart data string> に含める文字のペアに使用できるのは、AZaz09、ハイフン (-)、ピリオド (.)、アンダースコア (_)、区切りを示すカンマ (,) です。

注:

  • AA = 0、AZ = 25、Aa = 26、Az = 51、A0 = 52、A9 = 61、A- = 62、A. = 63、
    BA = 64、BZ = 89、Ba = 90、Bz = 115、B0 = 116、B9 = 125、B- = 126、B. = 127、
    .A = 4032、.Z = 4057、.a = 4058、.z = 4083、.0 = 4084、.9 = 4093、.- = 4094、.. = 4095
  • 欠損値を指定するにはアンダースコアを 2 つ並べて (__) 使用します。
  • データセットが複数ある場合は、各セットをカンマ (,) で区切ります。

: 詳しい一覧表の生成手順は、拡張エンコードの文字値をご覧ください。

トップへ戻る

JavaScript を使用したデータのエンコード

実際のデータを Chart API データに変換するには、手作業でなくプログラムで行った方が簡単です。

次の JavaScript スニペットは、データセットを簡易エンコードでエンコードします。データセットは、正の数の配列として指定する必要があります。正数でないデータセット値は、アンダースコア (_) を使って、欠落している値としてエンコードされます。

var simpleEncoding = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
 
function simpleEncode(valueArray,maxValue) {

var chartData = ['s:'];
  for (var i = 0; i < valueArray.length; i++) {
    var currentValue = valueArray[i];
    if (!isNaN(currentValue) && currentValue >= 0) {
    chartData.push(simpleEncoding.charAt(Math.round((simpleEncoding.length-1) * currentValue / maxValue)));
    }
      else {
      chartData.push('_');
      }
  }
return chartData.join('');
}

simpleEncode 関数を呼び出して、配列 (valueArray) と、その配列内での最大値 (maxValue) を渡します。次の例では、maxValue を配列内の最大値より大きく設定することで、最高値とチャートの上端の間に多少の空間を確保しています。

var valueArray = new Array(0,1,4,4,6,11,14,17,23,28,33,36,43,59,65);
var maxValue = 70; 
simpleEncode(valueArray,maxValue);

トップへ戻る

粒度に関するガイドライン

チャートに必要なデータ ポイントの数を多く見積もりすぎないように注意してください。たとえば過去 10 年間の、ブリトニー・スピアーズの人気を示すために、毎日の検索クエリ件数を集計すると、3600 以上の値が必要になります。これは 1 つの URL で渡すデータとして多すぎるだけでなく、この粒度でグラフをプロットしても意味がありません。1024 ピクセル幅の画面では、1 つのデータ ポイントが画面上でおよそ 4 分の 1 ピクセルになってしまいます。これを次の例で示します。

200 x 100 のチャートにデータ ポイントが 20 個ある場合 (データ ポイントあたり 10 ピクセル)

黄色の折れ線グラフ: データ ポイントが x 軸に沿って十分に分散しているので読み取りやすい

データ ポイントが 40 個ある場合 (データ ポイントあたり 5 ピクセル)

黄色の折れ線グラフ: x 軸に沿ったデータ ポイントの分散が十分でなく、読み取りやすさが減小

データ ポイントが 80 個ある場合 (データ ポイントあたりわずか 2.5 ピクセル)

黄色の折れ線グラフ: データ ポイントが x 軸に沿って凝縮しているので読み取りにくい

トップへ戻る

チャート タイプ

次のタイプのチャートが用意されています。

折れ線グラフ

折れ線グラフは次のように指定します。

cht=<line chart type>

ここで、<line chart type>lc または lxy です。次の表で説明します。

  • タイプ lc のチャートでは、複数のデータセットが複数の折れ線として描画されます。
  • タイプ lxy のチャートでは、それぞれの折れ線に対してデータセットのペアが必要です。
  • 複数のデータセットを指定する方法について詳しくは、チャート データをご覧ください。
  • 用意されているパラメータについて詳しくは、チャート タイプごとのオプション パラメータをご覧ください。
パラメータ 説明

cht=lc

データ ポイントが x 軸に沿って等間隔で配置された折れ線グラフです。

折れ線が黄色いチャート
cht=lc

cht=lxy

描画する折れ線それぞれに対して、データセットのペアを指定します。各ペアの最初のデータセットは x 軸座標、2 番目のデータセットは y 軸座標を指定します。データセットの数が奇数の場合、最後のセットは無視されます。

データ ポイントを x 軸に沿って等間隔に配置するには、未定義値を 1 つ指定します。この例のチャートはテキスト エンコードを使用しているので、未定義値は -1 で表されます。未定義値または欠落している値には、簡易エンコードの場合はアンダースコア (_)、拡張エンコードの場合は 2 つ並べたアンダースコア (__) を使用します。

さまざまなデータ ポイントの形を chm パラメータで指定できます。これについては図形マーカーで説明します。

折れ線の色を指定します。これについてはで説明します。

間隔が不均等なデータ ポイントを持ち、折れ線が赤、緑、青の点線の折れ線グラフ
cht=lxy
chd=t:0,30,60,70,90,95,100|
20,30,40,50,60,70,80|
10,30,40,45,52|
100,90,40,20,10|
-1|
5,33,50,55,7

スパークライン

スパークラインは次のように指定します。

cht=ls

スパークラインは、折れ線グラフとまったく同じパラメータを指定します。違いは、スパークラインの場合デフォルトでは軸が描かれないことです。必要に応じて軸ラベルを追加できます。詳しくは複数軸ラベルをご覧ください。

スパークライン

トップへ戻る

棒グラフ

棒グラフは次のように指定します。

cht=<bar chart type>

ここで、<bar chart type>bhsbhgbvsbvg のいずれかです。次の表で説明します。

  • 棒グラフのタイプにより、複数のデータセットが積み重なった棒で描画される場合と、棒のグループで描画される場合があります。
  • 複数のデータセットを指定する方法について詳しくは、チャート データをご覧ください。
  • 用意されているパラメータについて詳しくは、チャート タイプごとのオプション パラメータをご覧ください。
パラメータ 説明

cht=bhs
cht=bvs

それぞれ、水平および垂直の棒グラフです。

最初の例 (濃い青のすべての棒) ではデータセットは 1 つです。

2 番目の例 (濃い青と薄い青の棒) ではデータセットは 2 つです。

ご覧のとおり、複数データセットは積み重ねられるため、それぞれのデータセットの色を指定する必要があります。また、単一データセットの場合も各データ ポイントの色を指定できます。詳しくはをご覧ください。

2 番目の例はデータ スケーリングを使用していないため、合計が 100 以上の値のデータ ポイントは範囲外になっています。

3 番目の例はデータ スケーリングを使用しているため、棒は正しくスケーリングされています。

データセットが 2 つある水平棒グラフ: 両方共に青
cht=bhs
chco=4d89f9

データセットが 2 つある垂直棒グラフ: 片方のデータセットは濃い青で、もう一方は薄い青
cht=bvs
chco=4d89f9,c6d9fd
chd=t:10,50,60,80,40|
50,60,100,40,20

データセットが 2 つある垂直棒グラフ: 片方のデータセットは濃い青で、もう一方は薄い青cht=bvs
chco=4d89f9,c6d9fd
chd=t:10,50,60,80,40|
50,60,100,40,20
chds=0,160

cht=bhg
cht=bvg

それぞれ、水平および垂直の棒グラフです。色が指定されており、複数データセットがグループにまとめられています。

データセットが 2 つある水平棒グラフ: 片方のデータセットは濃い青で、その隣のもう一方は薄い青
cht=bhg
chco=4d89f9,c6d9fd

データセットが 2 つある垂直棒グラフ: 片方のデータセットは濃い青で、その隣のもう一方は薄い青
cht=bvg
chco=4d89f9,c6d9fd

chbh

棒グラフのサイズは、他のチャート タイプと異なる方法で処理されます。

タイプ bhsbhg の水平棒グラフ、およびタイプ bvsbvg の垂直棒グラフでは、チャートのサイズは chs パラメータによって決定されます。chs で指定したサイズが小さすぎる場合、グラフがカットされて一部のみが表示されます。

このため、棒の太さと間隔を、以下のように指定することをお勧めします。
chbh=
<bar width in pixels>,
<optional space between bars in a group>,
<optional space between groups>

: 3 番目のパラメータ (棒の間隔) を指定しない場合、デフォルトで、グループ間の間隔の半分の値が使用されます。

青い水平棒グラフ、棒の幅はデフォルト
chbh 省略
cht=bhs

青い水平棒グラフ、棒の幅は 10 ピクセル
chbh=10
cht=bhs

トップへ戻る

円グラフ

円グラフは次のように指定します。

cht=<pie chart type>

ここで、<pie chart type>p または p3 です。次の表で説明します。

: Google Chart API は、チャート サイズ (chs) パラメータで指定された幅と高さの最小値から円の半径を計算します。指定されたサイズが小さすぎる場合、チャートはカットされます。ラベルを含める場合、幅は高さの 2 倍に通常指定する必要があります。

パラメータ 説明

cht=p

2 次元の円グラフです。

特に指定しない限り、円のセグメントは段階的に濃いオレンジから薄い黄色で描画されます。他の色を指定する方法は、で説明します。

ラベルは chl で指定します。円グラフのラベルで説明します。

セグメントが 4 つある 2 次元の円グラフで、セグメントの色は段階的に濃いオレンジから薄いオレンジへ

cht=p
chs=200x100

cht=p3

3 次元の円グラフです。

ラベルは chl で指定します。円グラフのラベルで説明します。

セグメントが 4 つある 3 次元の円グラフで、セグメントの色は段階的に濃いオレンジから薄いオレンジへ

cht=p3
chs=250x100

トップへ戻る

ベン図

ベン図は次のように指定します。

cht=v

次のようなデータセットを 1 つ指定します。

  • 最初の 3 つの値は、3 つの円 A、B、C の相対的なサイズを指定します。
  • 4 番目の値は、A と B の交わりの面積を指定します。
  • 5 番目の値は、A と C の交わりの面積を指定します。
  • 6 番目の値は、B と C の交わりの面積を指定します。
  • 7 番目の値は、A と B と C の交わりの面積を指定します。
パラメータ 説明

cht=v

この例で、最初の円は 100、2 番目は 80、3 番目は 60 と指定されています。すべての円が重なっている部分は 30 と指定されています。

ベン図に用意されているパラメータについて詳しくは、チャート タイプごとのオプション パラメータをご覧ください。

3 つの円が重なっているベン図
cht=v
chd=t:100,80,60,30,30,30,10

トップへ戻る

散布図

散布図は次のように指定します。

cht=s

  • 散布図での複数データセットの使用法は、他のチャート タイプの場合と異なります。散布図には 1 つのデータセットしか表示されませんが、3 つのデータセットを使用し、それぞれデータ ポイントの x 座標、y 座標、およびオプションのサイズを指定します。複数のデータセットを指定する方法について詳しくは、チャート データをご覧ください。
  • 用意されているパラメータについて詳しくは、チャート タイプごとのオプション パラメータをご覧ください。
パラメータ 説明

cht=s

2 つのデータセットを指定します。最初のデータセットは x 座標、2 番目のデータセットは y 座標を指定します。

データ ポイントのデフォルトの形は円です。さまざまなデータ ポイントの形を chm パラメータで指定できます。これについては図形マーカーで説明します。

データ ポイントのデフォルトの色は青です。他の色を指定する方法は、で説明します。

この例を見ると、さまざまなサイズのデータ ポイントがあります。これには、3 番目のデータセットを指定します。chm パラメータで指定する任意のサイズが、データ ポイントの最大サイズになります。各データ ポイントの描画サイズは、オプションの 3 番目のデータセットでスケーリングされます。このため、たとえば chm で 20 ピクセルのサイズを指定すると、3 番目のデータセットで使用しているエンコード タイプの最大値 (9100.0.. のいずれか) が 20 ピクセルのデータ ポイントになります。

デフォルトの青い円のデータ ポイントを持つ散布図で、異なるサイズを 3 番目のデータセットで定義
cht=s

トップへ戻る

レーダー チャート

レーダー チャートは次のように指定します。

cht=r または cht=rs

r タイプのチャートでは、ポイントは直線で繋がれます。

rs タイプのチャートでは、ポイントはゆるやかな曲線で繋がれます。

パラメータ 説明

cht=r

レーダー チャートでは、データ ポイントはチャートの中心と外周の間に描かれます。値が 0 のポイント (エンコード タイプにより、0AAA のいずれか) は中心に描かれ、使用しているエンコードの最大値 (1009.. のいずれか) は外周に描かれます。中間値はその 2 つの間に描かれます。

データセットの最初の値と最後の値を表すポイントは、チャートの中心とチャートの頂点の間に描かれます。それ以外のポイントは、チャートの周りに時計回りに等間隔で描かれます。そしてこのタイプのレーダー チャートでは、各ポイント間が直線で結ばれます。

これはデータセットが 1 つのシンプルなレーダー チャートの例です。

レーダー チャート
cht=r
chd=t:10,20,30,40,50,60,70,80,90

レーダー チャートに色、線のスタイル、軸ラベルを追加することで、情報を追加してわかりやすくすることができます。

これはデータセットが 2 つの少し複雑なレーダー チャートの例です。各データセットの色は chco で指定します。これについてはチャートの色で説明します。

線のスタイルは chls で指定します。これについては線のスタイルで説明します。

最後に軸ラベルは、chxtchxlchxr で指定します。詳しくは複数軸ラベルをご覧ください。レーダー チャートでは、x 軸は円となり、y 軸と r 軸は円の中心から円の頂点へと引かれる線となります。t 軸は無視されます。

: ラベルが指定されている場合、チャートのデータ ポイントの間隔は、ラベルの数またはデータ ポイント数 -1 のいずれか大きい方の数で決まります。

レーダー チャート
chco=FF0000,FF9900
chls=2.0,4.0,0.0|2.0,4.0,0.0
chxt=x
chxl=0:|0|45|90|135|180|225|270|315
chxr=0,0.0,360.0

この例では 1 つ前の例と同じパラメータを使用していますが、両方のデータセットに塗りつぶし領域が指定されています。

またグリッドも指定されています。詳しくはグリッド線をご覧ください。


レーダー チャート
chg=25.0,25.0,4.0,4.0
chm=
B,FF000080,0,1.0,5.0|
B,FF990080,1,1.0,5.0

最後の例では、1 つ前の例に図形マーカーが追加されています。水平線の図形マーカー (chm=h で指定) はレーダー チャートに円を表示し、垂直線 (chm=vchm=V) はチャートの中心から外周に向かって描かれます。

  • 外側の青い円は chm=h,0000FF,... で指定
  • 内側の半透明の青い円は chm=h,3366CC80,... で指定
  • 半透明の緑の線 (1 時と 2 時の方向の間) は chm=V,00FF0080,... で指定
  • 濃い緑の線 (8 時方向) は chm=V,008000,... で指定
  • 緑の線 (10 時方向) は chm=v,00A000,... で指定

詳しくは図形マーカーをご覧ください。

範囲マーカーも指定できます。詳しくは範囲マーカーをご覧ください。

レーダー チャート
chm=
h,0000FF,0,1.0,4.0|
h,3366CC80,0,0.5,5.0|
V,00FF0080,0,1.0,5.0|
V,008000,0,5.5,5.0|
v,00A000,0,6.5,4

トップへ戻る

地図

地図は次のように指定します。

cht=tchtm=<geographical area>

ここで <geographical area> は次のいずれかになります。

  • africa
  • asia
  • europe
  • middle_east
  • south_america
  • usa
  • world

例:

世界地図
chs=440x220
chd=s:_
cht=t
chtm=world

: データ スケーリングのあるテキスト エンコードは地図では利用できません。代わりに、テキスト エンコード簡易エンコード、または拡張エンコードを使用します。

上記はデフォルトの世界地図です。例で使用しているサイズ (440 x 220 ピクセル) は、すべての地図で利用可能な最大値です。また、データセットには文字がアンダースコア (_) 1 つしか含まれていないことにご注意ください。これは簡易エンコードの欠損値を指定するもので、最も単純な地図を表示します。また、地図上の 1 つ以上の国に色を指定することで、上記の地図にもっと多くの興味深い情報を追加できます。

3 つのパラメータを組み合わせて、地図の色や、地図内の各国や州にその色をどのように適用するかを指定します。

chco=<default color><colors for gradient>
chld=<list of codes for each country or state to be colored>
chd=<list of values for each country or state to be colored>

ここで

  • <default color><colors for gradient> は RRGGBB 形式の 16 進数です。デフォルトの色は、chld パラメータに指定していない国や州に適用されます。その他の色は、chld パラメータに指定するすべての国を塗りつぶす色のグラデーションの極限値を示します。適用される色は、chd パラメータ内のその国の値により異なります。
  • <list of codes for each country or state to be colored> は次のいずれかのリストです。
  • <list of values for each country or state to be colored> は簡易エンコード、テキスト エンコード、または拡張エンコードの値です。最初の値は、chld パラメータに指定した最初の国に使用され、2 番目の値は 2 番目の国に使用され、以下同様です。最小値は使用するエンコードの種類により A0、またはAA となり、chco<color for start of gradient> で指定した色で描画されます。最大値 (9100.. のいずれか) は <color for end of gradient> で指定した色で描画されます。中間値は中間色を指定します。

次に例を示します。

アフリカの地図
chtm=africa
chco=ffffff,edf0d4,13390a
chld=MGKETN
chd=s:Af9
chf=bg,s,EAF7FE

この例では

  • 最初の色 (白を表す ffffff) は chld パラメータには含まれていない任意の国に使用されます。
  • 2 番目と 3 番目の色は、薄い緑 (edf0d4) から濃い緑 (13390a) までの色のグラデーションを指定します。
  • 塗りつぶされる国は、マダガスカル (MG)、ケニア (KE)、チュニジア (TN) です。
  • マダガスカルには値 A が指定されており、これは簡易エンコードの最小値で、0 を意味します。
    よって、マダガスカルは薄い緑 (edf0d4) で描かれます。
  • ケニアには値 f が指定されており、これは 31 を意味します。よって、ケニアは薄い緑と濃い緑の中間の色で描かれます。
  • チュニジアには値 9 が指定されており、これは簡易エンコードの最大値で、61 を意味します。
    よって、チュニジアは濃い緑 (13390a) で描かれます。
  • 海は地図の背景となるため、薄い青 (EAF7FE) で描かれます。chf パラメータについては、チャート領域と背景の塗りつぶしで説明しています。

もっと多くの色を使った例を示します。

米国の地図
chco=
f5f5f5,
edf0d4,
6c9642,
13390a

デフォルトの色は f5f5f5 です。色のグラデーションは、edf0d46c964213390a で指定されています。テキスト エンコードを使用し、これらの色がどのように適用されているかを説明します。

  • 値 0 は最も薄い緑 (edf0d4) で描画されます。
  • 値 50 は中間の緑 (6c9642) で描画されます。
  • 値 100 は最も濃い緑 (13390a) で描画されます。
  • これらの値の間にある数は、最も近い色に補間されます。したがって、たとえば値 75 は中間の緑 (6c9642) と最も濃い緑 (13390a) の間の色になります。

トップへ戻る

Google-o-meter

Google-o-meter は次のように指定します。

cht=gom

用意されているパラメータについて詳しくは、チャート タイプごとのオプション パラメータをご覧ください。

パラメータ 説明

cht=gom

デフォルトの色 (左側は赤、右に進むにつれオレンジ、黄色、緑へと変化) を使用した Google-o-meter の例です。他の色の指定については、チャートの色をご覧ください。

矢印の先に表示されるテキストの指定については、円グラフと Google-o-meter のラベルをご覧ください。

デフォルトの赤から緑の色付けの Google-o-meter
cht=gom
chd=t:70

トップへ戻る

QR コード

QR コードは、よく使用されている 2 次元バーコードであり、ハードリンクまたは実世界でのハイパーリンクとも呼ばれます。QR コードには、ハイパーリンク、連絡先情報、電話番号のほか、1 編の詩の全テキストでも格納できます。

QR コードは、人間の目には象形文字のようですが、適切なソフトウェアがインストールされたデバイスで読み取ることができます。そうしたデバイスは、専用のリーダーから携帯電話にまでわたります。そのため、たとえば雑誌に掲載された QR コードを、対応している携帯電話でスキャンし、その電話のブラウザで QR コード内の URL にアクセスできます。

QR コードは次のように指定します。

cht=qr
chl=<text to encode>
choe=<output encoding>

ここで

  • <text to encode>QR コードのテキストです。これは UTF-8 の URL エンコードである必要があります。次の例では、helloworld の間の空白を %20 で指定しています。
  • <output encoding> は、オプションで出力のエンコード方法を指定します。これを指定しない場合は、デフォルトの UTF-8 が使用されます。指定できるオプションは、Shift_JISUTF-8ISO-8859-1 のいずれかです。

例:
QR コード
cht=qr
chl=hello%20world
choe=UTF-8

上記の 21 行 x 21 列の QR コードの例は、最小のコードで、バージョン 1 と呼ばれています。

  • バージョン 1 は 21 行/列で、最大 25 文字の英数字をエンコードできます。
  • バージョン 2 は 25 行/列で、最大 47 文字の英数字をエンコードできます。
  • バージョン 3 は 29 行/列で、最大 77 文字の英数字をエンコードできます。
  • ...
  • バージョン 40 は 177 行/列で、最大 4,296 文字の英数字をエンコードできます。

Chart API では、指定された文字数に応じて、適切な QR コードのバージョンを生成します。たとえば 55 文字の英数字を指定すると、Chart API はバージョン 3 の QR コードを生成します。これはエラー訂正 (EC) レベルを指定すると、変わってきます。EC レベルについては後のセクションで説明します。

: ここで行と列の数と QR コードのサイズを混同しがちです。指定する文字の数により、行と列の数が決まります。チャートのピクセル サイズは通常、chs で指定します (チャート サイズを参照)。

エラー訂正とマージン

4 つのレベルの EC が用意されています。デフォルトのレベル (L) では、QR コードの誤読、欠落、または不明瞭となる部分をコードの 7% まで許容します。他のレベルは、より大きい EC レベルを指定します。EC レベルを上げると、エンコードできる文字数が少なくなります。詳しくはバージョン、エラー訂正、最大文字数をご覧ください。

デフォルトのマージンは、4 モジュールです。これは QR コードの周りに、上下に 4 行、左右に 4 列の空白部分を設けることを意味します。これは QR リーダーの最小要件です。

オプションとして、EC レベルとマージンを次のように指定します。

chld=<EC level>|<margin>

ここで

  • <EC level> は次のいずれかです。
    - L は QR コードの 7% の復元が可能
    - M は QR コードの 15% の復元が可能
    - Q は QR コードの 25% の復元が可能
    - H は QR コードの 30% の復元が可能
    (または対応する小文字 l、m、q、h で指定)
  • <margin> は QR コードの周りのマージン (空白部分) を定義します。デフォルトの画像には、4 行/列のチャートのマージンが含まれます。

バージョン、エラー訂正、最大文字数

QR コードを生成する前に、そのコードの読み取りに使用するデバイスの種類を考えてください。最良の QR コード リーダーはバージョン 40 のコードを読み取ることができますが、携帯端末ではバージョン 4 までしか読み取れないことがあります。

バージョン 4 までにすることをお勧めします。これはデフォルトの EC レベルで、100 文字の英数字に相当します。

各バージョンと EC レベルに対する最大文字数については、次の表をご覧ください。

バージョン 行 x 列 EC レベル EC レベルと文字の種類による最大文字数
数字: 0~9 英数字:
0~9、A~Z、
空白、$ % * + - . / :
バイナリ 漢字
1 21x21 L 41 25 17 10
M 34 20 14 8
Q 27 16 11 7
H 17 10 7 4
2 25x25 L 77 47 32 20
M 63 38 26 16
Q 48 29 20 12
H 34 20 14 8
3 29x29 L 127 77 53 32
M 101 61 42 26
Q 77 47 32 20
H 58 35 24 15
4 33x33 L 187 114 78 48
M 149 90 62 38
Q 111 67 46 28
H 82 50 34 21
10 57x57 L 652 395 271 167
M 513 311 213 131
Q 364 221 151 93
H 288 174 119 74
40 177x177 L 7,089 4,296 2,953 1,817
M 5,596 3,391 2,331 1,435
Q 3,993 2,420 1,663 1,024
H 3,057 1,852 1,273 784

詳細情報と規格

QR コードは株式会社デンソーウェーブの商標です。デンソーウェーブのウェブサイトには、もちろん QR コードについての多くの有用な情報が記載されています。

QR コードは、

  • AIM International (国際自動認識工業会) 規格 (ISS - QR Code) として 1997 年 10 月に制定されました。
  • JEIDA (日本電子工業振興協会) 規格 (JEIDA-55) として 1998 年 3 月に制定されました。
  • JIS 規格 (日本工業規格) (JIS X 0510) として 1999 年 1 月に制定されました。
  • ISO 国際規格 (ISO/IEC18004) として 2000 年 6 月に制定されました。

QR コード リーダー のソフトウェアは、多くのソースから入手できます。Google は QR コード リーダー ライブラリとして、Zebra Crossing (ZXing) を無料で提供しています。詳しくは http://code.google.com/p/zxing/ をご覧ください。

バーコードへの情報の標準エンコーディングの概説は、Barcode Contents をご覧ください。

トップへ戻る

色は、RRGGBB という形式の 6 桁以上の 16 進値文字列で指定します。例:

  • FF0000 = 赤
  • 00FF00 = 緑
  • 0000FF = 青
  • 000000 = 黒
  • FFFFFF = 白

00FF の 16 進数値を付加して、オプションで透明度を指定できます。00 は完全に透明であり、FF は完全に不透明です。例:

  • 0000FFFF = 不透明な青
  • 0000FF00 = 透明な青

色には次のオプションが用意されています。

トップへ戻る

チャートの色

線、棒、ベン図、Google-o-meter、円グラフのセグメントの色を次のように指定します。

chco=
<color1>,
...
<colorn>

ここで、<color1> をはじめとする色の値はすべて、RRGGBB 形式の 16 進数です。

パラメータ 説明

chco

この例には 3 つのデータセットがあり、3 つの色が指定されています。

赤い線、青い線、緑の線で構成された折れ線グラフ

chco=ff0000,00ff00,0000ff

この例にも 3 つのデータセットがありますが、色は 2 つのみ指定されています。このため、後の 2 本の線が、どちらも最後の色 (赤 ff0000) で描画されます。

2 本の赤い線と 1 本の青い線の折れ線グラフ

chco=ff0000,0000ff

棒グラフでは、指定した色の数がデータセットの数より少ない場合、それらの色が順番に繰り返して使用されます。次のチャートでは、3 番目のデータセット Bar が最初の色で描画されています。1 つの色のみ指定した場合、すべてのデータセットがその色で描画されます。

最初のデータセットが赤、2 番目が緑、3 番目が赤の水平棒グラフ

chco=ff0000,00ff00
chd=s:FOE,THE,Bar

ここでは、同じチャートに 3 つの色が指定されています。

最初のデータセットが赤、積み重ねられた 2 番目が緑、3 番目が青の水平棒グラフ

chco=ff0000,00ff00,0000ff
chd=s:FOE,THE,Bar

単一のデータセット内の各データ ポイントの色を指定するには、chco 色パラメータをパイプ文字 (|) で区切ります。

最初のデータ ポイントが赤、2 番目が緑、3 番目が青の水平棒グラフ

chco=ff0000|00ff00|0000ff
chd=s:elo

円グラフでは、指定した色の数がセグメントの数より少ない場合、色が段階的に使用されます。

濃い青から薄い青にセグメントの色が段階的に変化する 3 次元円グラフ

chco=0000ff

ベン図では、指定した色の数が円の数より少ない場合、最後に指定した色が繰り返して使用されます。

3 つの円が重なるベン図、円は最初が青で残りが緑
chco=00ff00,0000ff

  Google-o-meter については、少なくとも 2 つの色を指定します。その間のグラデーションを指定する場合はさらに多くの色を指定します。 白から赤への Google-o-meter
chco=ffffff,ffaaaa,ff0000

トップへ戻る

塗りつぶし領域

塗りつぶし領域は次のように指定します。

chm=
b,<color>,<start line index>,<end line index>,<any value>|
...
b,<color>,<start line index>,<end line index>
,<any value>

ここで

  • <color>RRGGBB 形式の 16 進数です。
  • <start line index> は塗りつぶしが開始される線のインデックスです。これは、chd でデータセットを指定する順番により決定されます。最初に指定したデータセットのインデックスは 0、2 番目は 1、以下同様です。
  • <end line index> は塗りつぶしが終了する線のインデックスです。これは、chd でデータセットを指定する順番により決定されます。最初に指定したデータセットのインデックスは 0、2 番目は 1、以下同様です。
  • <any value> は無視されます。

複数の塗りつぶし領域はパイプ文字 (|) で区切ります。

パラメータ 説明

chm=b

最も大きい値があるデータセットを最初に指定するように注意してください。

最初の折れ線からチャートの上端までを塗りつぶすには、最大のデータ値のみのデータセットを含めます (9100.0.. のいずれかで、使用しているエンコード タイプにより異なります)。

最後の折れ線からチャートの下端までを塗りつぶすには、最小のデータ値のみのデータセットを含めます (A0AA のいずれかで、使用しているエンコード タイプにより異なります)。

線そのものは、chco を使用して黒で描画されています。これについてはで説明しています。

 

下端から最初の線までが緑、最初から 2 番目の線までが赤、2 番目から 3 番目の線までが濃い青、3 番目の線から上端までが薄い青に塗られている、3 本の折れ線がある折れ線グラフ
chd=s:
99,
cefhjkqwrlgYcfgc,

QSSVXXdkfZUMRTUQ,
HJJMOOUbVPKDHKLH,
AA

chm=
b,76A4FB,0,1,0| (薄い青)
b,224499,1,2,0| (青)
b,FF0000,2,3,0| (赤)
b,80C65A,3,4,0 (緑)

chco=000000,000000,000000,
000000,000000

対照的に、最初と最後のデータセット (99AA) は、このチャートでは削除されています。

また、chco が省略されているので、折れ線はチャート タイプのパラメータに応じて描画されています。ここで、パラメータは cht=lc なので、デフォルトの線の色である黄色が使用されています。

3 本の折れ線がある折れ線グラフ。下端から最初の線までは無色、最初から 2 番目の線までは赤、2 番目から 3 番目の線までは濃い青、3 番目の線から上端までは無色です。線はデフォルトの黄色で描画されています。
chd=s:
cefhjkqwrlgYcfgc,
QSSVXXdkfZUMRTUQ,
HJJMOOUbVPKDHKLH,

chm=
b,224499,0,1,0| (青)
b,FF0000,1,2,0| (赤)
b,80C65A,2,3,0 (緑)

chm=B

単一のデータセットでは、chm=B を使用すると簡単です。この場合、線の下部のすべての領域が塗りつぶされます。レーダー チャートでは chm=b は無視されます (chm=B の指定はできます)。

チャート下端から線までが青く塗られている、折れ線が 1 本の折れ線グラフ
chm=B,76A4FB,0,0,0
chd=s:ATSTaVd21981uocA

トップへ戻る

無地塗りつぶし

無地塗りつぶしは次のように指定します。

chf=
<bg or c or a>,s,<color>|
<bg or c or a>,s,<color>

ここで

  • <bg or c or a> は:
    - bg は背景塗りつぶし
    - c はチャート領域塗りつぶし
    - a はチャート全体に透明度を適用
  • <s> は無地塗りつぶしを示します。
  • <color> は RRGGBB 形式の 16 進数です。
  • 塗りつぶしの定義はパイプ文字 (|) で区切ります。2 番目の定義の後にパイプ文字は不要です。

次の指定が可能です。

  • 折れ線グラフ、スパークライン、散布図の背景塗りつぶし、チャート領域塗りつぶし、透明度
  • 棒グラフ、円グラフ、ベン図の背景塗りつぶし、透明度
  • 地図とレーダー チャートの背景塗りつぶし
パラメータ 説明

chf

この例は、画像の背景を薄いグレー (efefef) で塗りつぶしています。

薄いグレーの背景を持つ、赤い折れ線グラフ

chf=bg,s,efefef

この例は、背景を薄いグレー (efefef) で塗りつぶし、チャート領域を黒 (000000) で塗りつぶしています。

点が青、チャート領域が黒、背景が薄いグレーの散布図

chf=bg,s,efefef|
c,s,000000

透明度として背景に 16 進数の 20、チャート領域に 80 を指定した場合の効果を見てください。

点が青、チャート領域が濃いグレー、背景がとても薄いグレーの散布図

chf=bg,s,efefef20|
c,s,00000080

この例では、チャート全体に透明度を適用しています。

点が青、チャート領域と背景が白の散布図

chf=a,s,efefeff0

トップへ戻る

線形グラデーション

折れ線グラフ、スパークライン、棒グラフ、ベン図、レーダー チャート、散布図の線形グラデーションは、次のように指定します。

chf=<bg or c>,lg,<angle>,<color 1>,<offset 1>,<color n>,<offset n>

ここで

  • <bg or c> は、背景塗りつぶしの場合 bg、チャート領域塗りつぶしの場合 c を指定します。
  • lg は線形グラデーションの指定です。
  • <angle> には、0 (水平) から 90 (垂直) までの範囲でグラデーションの角度を指定します。
  • <color x> は RRGGBB 形式の 16 進数です。
  • <offset x> は、色が純色であるポイントを指定します。0 がチャートの右端、1 が左端です。
パラメータ 説明

chf

チャート領域に、0 度の角度が指定された、左から右への水平線形グラデーションが指定されています。

青 (76A4FB) は、最初に指定されている色です。純色で示されているのはチャートの右端です。

白 (ffffff) は、2 番目に指定されている色です。純色で示されているのはチャートの左端です。

チャートの背景はグレー (EFEFEF) で描画されています。

濃いグレーの折れ線グラフで、背景は薄いグレー、チャート領域は左から右に白から青への線形グラデーション

chf=
c,lg,0,76A4FB,1,ffffff,0|
bg,s,EFEFEF

チャート領域に、45 度の角度が指定された、左下から右上に向かう斜めの線形グラデーションが指定されています。

白 (ffffff) は、最初に指定されている色です。純色で示されているのはチャートの左下です。

青 (6A4FB) は、2 番目に指定されている色です。純色で示されているのはチャートの右上です。

チャートの背景は、これもグレー (EFEFEF) で描画されています。

濃いグレーの折れ線グラフで、背景は薄いグレー、チャート領域は左下隅から右上隅に白から青への斜めの線形グラデーション

chf=
c,lg,45,ffffff,0,76A4FB,0.75|
bg,s,EFEFEF

チャート領域に、90 度の角度が指定された、上から下への垂直線形グラデーションが指定されています。

青 (76A4FB) は、最初に指定されている色です。純色で示されているのはチャートの上端です。

白 (ffffff) は、2 番目に指定されている色です。純色で示されているのはチャートの下端です。

チャートの背景は、これもグレー (EFEFEF) で描画されています。

濃いグレーの折れ線グラフで、背景は薄いグレー、チャート領域は下から上に白から青への垂直線形グラデーション

chf=
c,lg,90,76A4FB,0.5,ffffff,0|
bg,s,EFEFEF

トップへ戻る

線形ストライプ

折れ線グラフ、スパークライン、棒グラフ、ベン図、レーダー チャート、散布図の線形ストライプは、次のように指定します。

chf=<bg or c>,ls,<angle>,<color 1>,<width 1>,<color n>,<width n>

ここで

  • <bg or c> は、背景塗りつぶしの場合 bg、チャート領域塗りつぶしの場合 c を指定します。
  • ls は線形ストライプの指定です。
  • <angle> には、0 (垂直) から 90 (水平) までの範囲でグラデーションの角度を指定します。
  • <color> は RRGGBB 形式の 16 進数です。
  • <width>01 である必要があります。ここで、1 はチャートの全幅を示します。ストライプは、チャート全体に届くまで繰り返されます。
パラメータ 説明

chf

チャート領域に角度 0 で垂直のストライプが指定されています。

指定されている最初の色 (濃いグレー CCCCCC) は、チャート全幅の 20% の幅で描画される最初のストライプです。

指定されている 2 番目の色 (白 ffffff) も 20% の幅で描画されます。

ストライプは、チャート全体に届くまで順番に繰り返されます。

チャートの背景は省略されます。

左から右に、グレーと白のストライプが交互にある青い折れ線グラフ

chf=c,ls,0,CCCCCC,0.2,
FFFFFF,0.2

チャート領域に角度 90 で水平のストライプが指定されています。

指定されている最初の色 (濃いグレー 999999) は、チャート全体の 25% の幅で描画される最初のストライプです。

指定されている 2、3 番目の色 (薄いグレー CCCCCC と白 FFFFFF) も 25% の幅で描画されます。

ストライプは、チャート全体に届くまで順番に繰り返されます。

チャートの背景は省略されます。

下から上に濃いグレー、薄いグレー、白、濃いグレーのストライプが設定されている青い折れ線グラフ

chf=
c,ls,90,
999999,0.25,
CCCCCC,0.25,
FFFFFF,0.25

トップへ戻る

ラベル

次のタイプのラベルが用意されています。

チャート タイトル

チャート タイトルは次のように指定します。

chtt=<chart title>

パラメータ 説明

chtt

スペースはプラス記号 (+) で指定します。

強制改行はパイプ文字 (|) で指定します。

 

タイトル付きの垂直棒グラフ
chtt=Site+visitors+by+month|
January+to+July

オプションで、タイトルの色とサイズを次のように設定できます。

chts=<color>,<fontsize>

chs で指定したサイズが小さすぎる場合、グラフがカットされて一部のみが表示されます。

青い 20 ピクセルのタイトル付きの垂直棒グラフ
chtt=Site+visitors
chts=FF0000,20

トップへ戻る

凡例

凡例は次のように指定します。

chdl=<first data set label>|<n data set label>

パラメータ 説明

chdl

chdl に線の色を添えて指定します。これについてはで説明します。

この例では、最初のデータセットが赤、2 番目が緑、3 番目が青で描画されています。

凡例が表示された、赤、青、緑の折れ線グラフ
chdl=NASDAQ|FTSE100|DOW
chco=ff0000,00ff00,0000ff
2 つの小さな円が大きな円に含まれたベン図
chdl=First|Second|Third
chco=ff0000,00ff00,0000ff
chdlchdlp

chdlchdlp のパラメータを併用して、凡例の位置を次のように指定します。

  • chdlp=b では、凡例を下部に配置します。
  • chdlp=t では、凡例を上部に配置します。
  • chdlp=r では、凡例を右側に配置します。
  • chdlp=l では、凡例を左側に配置します。
2 つの小さな円が大きな円に含まれたベン図
chdl=First|Second|Third
chco=ff0000,00ff00,0000ff
chdlp=l

トップへ戻る

円グラフと Google-o-meter のラベル

円グラフでは、ラベルは次のように指定します。

chl=
<label 1 value>|
...
<label n value>

値の欠落を指定するにはパイプ文字を 2 つ並べて (||) 使用します。

: ラベルを表示するには
- 2 次元グラフの場合、横が縦の約 2 倍である必要があります。
- 3 次元グラフの場合、横が縦の約 2.5 倍である必要があります。

Google-o-meter では、矢印の先に表示されるテキストを次のように指定します。

chl=<label>

パラメータ 説明
chl

3 次元円グラフのラベルです。

各セグメントに May、June、July、August、September、October とラベルが付けられた 3 次元円グラフ

chl=May|Jun|Jul|Aug|Sep|Oct
chs=220x100

上記は、ラベルを円グラフに含めるのに必要な幅に関する妥当な経験則ですが、ラベルの長さも加えて考慮する必要があります。この例では、チャートの横幅が狭いためにラベルの一部が表示されていません。

各セグメントに May、June、July、August、September、October とラベルが付けられた 3 次元円グラフ

chl=May|June|July|August|
September|October
chs=220x100

ラベルを全部表示するには、チャートの横幅が 280 ピクセル必要です。

各セグメントに May、June、July、August、September、October とラベルが付けられた 3 次元円グラフ

chl=May|June|July|August|
September|October
chs=280x100

ラベルの付いた Google-o-meter の例です。

デフォルトの赤から緑の色付けの Google-o-meter
chl=Hello

トップへ戻る

複数軸ラベル

複数軸ラベルは、折れ線グラフ、棒グラフ、レーダー チャート、散布図で指定できます。

軸タイプ

複数軸は次のように指定します。

chxt=
<axis 1>,
...
<axis n>

使用できる軸は次のとおりです。

  • x = 下部の x
  • t = 上部の x
  • y = 左側の y
  • r = 右側の y

軸は、chxt パラメータ指定におけるインデックスによって指定されます。最初の軸のインデックスは 0、2 番目の軸のインデックスは 1、以下同様です。xtyr を複数回含めることによって、複数の軸を指定できます。

複数の軸を作成するには、少なくとも chxt パラメータが必要です。他のパラメータが欠落している場合、Chart API はデフォルトを使用します。これについては以下のセクションで説明します。

パラメータ 説明

chxt

この例には 2 つの下部の x 軸 (x が 2 度指定されています)、左側と右側の y 軸 (yr)、および上部の軸 (t) が表示されています。

軸ラベルが省略されているので、Chart API により次のように範囲が設定されています。

  • 折れ線グラフでは、すべての軸の範囲は 0~100 です。
  • 垂直棒グラフでは、y 軸と r 軸の範囲は 0~100 ですが、各棒の真下に表示される x 軸と t 軸のラベルの範囲は 0~4 です。
  • 水平棒グラフでは、x 軸と t 軸の範囲は 0~100 ですが、各棒の真横に表示される y 軸と r 軸のラベルは軸インデックス (0~4) です。水平棒グラフの高さを高く指定する必要があります。高さが十分ではないと、グラフの一部がカットされます。

注: 説明を簡潔にするために、このセクションの後半では、垂直棒グラフについて説明し、水平棒グラフの説明は省略します。水平棒グラフでの y 軸と r 軸への指定は、垂直棒グラフの x 軸と t 軸の場合と同じです。

Line chart with the labels: 0, 20, 40, 60, 80, and 100 on the left and right and labels: 0, 25, 50, 75, and 100 twice on the x-axis one set below the other

Bar chart with the labels: 0, 20, 40, 60, 80, and 100 on the left and right and labels: 0, 1, 2, 3, and 4 twice on the x-axis one set below the other and once on the top axis

Bar chart with the labels: 0, 20, 40, 60, 80, and 100 on the left and right and labels: 0, 1, 2, 3, and 4 twice on the x-axis one set below the other and once on the top axis
chxt=x,y,r,x,t

トップへ戻る

軸ラベル

ラベルは次のように指定します。

chxl=
<axis index>:|<label 1>|<label n>|
...
<axis index>:|<label 1>|<label n>

index パラメータは、ラベルが適用される軸のインデックスを指定します。
ラベルはすべて、パイプ文字 (|) で区切ります。

: 軸ラベルは順番に指定する必要があります (0、1、2、... の順)。

最初のラベルは先頭、最後のラベルは末端に配置され、他のラベルは間に等間隔で配置されます。

パラメータ 説明

chxtchxl

この例では、左右の y 軸 (yr)、および x 軸 (x) のために 2 セットの値が指定されています。

: 棒グラフの x 軸ラベルは、各棒の真下に表示されます。そのため、折れ線グラフの場合と異なり、年のラベルも棒グラフのそれぞれの棒に対して指定します。

左に 0~100、右に A、B、C、x 軸に Jan、July、Jan、July、Jan、その下に 2005、2006、2007 とラベルが付けられた折れ線グラフ
chxt=x,y,r,x
chxl=
0:|Jan|July|Jan|July|Jan|
1:|0|100|
2:|A|B|C|
3:|2005|2006|2007

左に 0~100、右に A、B、C、x 軸に Jan、July、Jan、July、Jan、その下に 2005、2006、2007 とラベルが付けられた棒グラフ

上の折れ線グラフと同じで、ただし
3:|2005|2005|2006|2006|2007

上の例と同じですが、y 軸ラベル (インデックス 1) を指定していません。

左に 0~100、右に A、B、C、x 軸に Jan、July、Jan、July、Jan、その下に 2005、2006、2007 とラベルが付けられた折れ線グラフ
chxt=x,y,r,x
chxl=
0:|Jan|July|Jan|July|Jan|

(y 軸は省略)
2:|A|B|C|
3:|2005|2006|2007

左に 0~100、右に A、B、C、x 軸に Jan、July、Jan、July、Jan、その下に 2005、2006、2007 とラベルが付けられた棒グラフ
上の折れ線グラフと同じで、ただし
3:|2005|2005|2006|2006|2007

トップへ戻る

軸ラベル位置

ラベル位置は次のように指定します。

chxp=
<axis index>,<label 1 position>,<label n position>|

...
<axis index>,<label 1 position>,<label n position>

位置の値には浮動小数点数を使用します。軸と軸はパイプ文字 (|) で区切ります。ラベル (chxl) を省略すると、ラベル テキストはその位置の値から決定されます。

パラメータ 説明

chxp

この例では、左右の y 軸 (yr)、および x 軸 (x) が 1 つ表示されています。

x 軸 (インデックス 0) には位置もラベルも指定されていないので、Chart API により 0~100 の範囲と等間隔の値が設定されます。

左側の y 軸 (インデックス 1) には、ラベル (max、average、min) と位置 (10,35,75) の両方があります。

r 軸 (インデックス 2) には位置 (0,1,2,4) のみ指定されているので、Chart API ではその位置をラベルとして使用します。この軸には範囲 chxr=2,0,4 が指定されています。これについて詳しくは次のセクションをご覧ください。

Line chart with min, average, and max on the left, 0, 1, 2, and 4 on the right and 0, 25, 50, 75, and 100 along the x-axis
chxt=x,y,r
chxl=1:|min|average|max
chxp=1,10,35,75|2,0,1,2,4
chxr=2,0,4


この例では、左右の y 軸 (yr)、および 2 つの x 軸 (x) が表示されています。

上の例と同様ですが、2 つの x 軸のラベルの位置が指定されている点が異なります。この例では、chxp を使用して、棒グラフで Chart API によるラベルの位置を変更できることを示しています。

左に min、average、max、右に 0、1、2、4、x 軸に 0、1、2、3、4 と表示された棒グラフ
chxt=x,y,r,x
chxr=2,0,4|3,0,4
chxl=1:|min|average|max
chxp=0,10,35,75
    |1,10,35,75
    |2,0,1,2,4
    |3,0,1,2,4

トップへ戻る

軸範囲

範囲は次のように指定します。

chxr=
<axis index>,<start of range>,<end of range>|
...
<axis index>,<start of range>,<end of range>

複数軸の範囲はパイプ文字 (|) で区切ります。

パラメータ 説明

chxr

この例では、左右の y 軸 (yr)、および x 軸 (x) が 1 つ表示されています。

各軸に、定義された範囲があります。ラベルや位置が指定されていないため、値は等間隔に配置され、指定された範囲から決定されます。棒グラフの x 軸では、各棒にラベルが設定される点が異なることにもう一度注意してください。

: r 軸 (インデックス 2) では、先頭の値 (1000) が末尾の値 (0) より大きいため、軸方向が逆になっています。

左に 0、50、100、150、200、右に 1000、800、600、400、200、0、x 軸に 250、500 と表示された折れ線グラフ

左に 0、50、100、150、200、右に 1000、800、600、400、200、0、x 軸に 100、200、300、400、500 と表示された棒グラフ
chxt=x,y,r
chxr=0,100,500|
1,0,200|
2,1000,0

ここでは、x 軸のみが定義されています (x)。この軸には、範囲、ラベル、位置があるため、3 つの値セットがすべて使用されます。

x 軸に 200、300、400 と表示された折れ線グラフ

x 軸に 200、300、400 と表示された棒グラフ
chxt=x
chxr=0,100,500
chxl=0:|200|300|400
chxp=0,200,300,400

トップへ戻る

軸スタイル

軸ラベルのフォント サイズ、色、配置は次のように指定します。

chxs=
<axis index>,<color>,<font size>,<alignment>|
...
<axis index>,<color>,<font size>,<alignment>

ここで

  • <axis index> は、chxt で指定された軸インデックスです。
  • <color>RRGGBB 形式の 16 進数です。
  • <font size> はオプションです。サイズをピクセル単位で指定します。
  • <alignment> はオプションです。デフォルトでは、x 軸ラベルは中央揃え、左側の y 軸ラベルは右揃え、右側の y 軸ラベルは左揃えになっています。配置を指定するには、中央揃えの場合は 0、左揃えの場合は -1、右揃えの場合は 1 を指定します。

複数の値はパイプ文字 (|) で区切ります。

パラメータ 説明

chxs

2 番目の x 軸ラベルのフォント サイズ、色、配置が指定されています。

左に min、average、max、右に 0、1、2、3、4、x 軸に 0~100、その下に青で Jan、Feb、March とラベルが付けられた折れ線グラフ

Line chart with min, average, and max on the left, 0, 1, 2, 3, and 4 on the right, 0 to 100 along the x-axis and Jan, Feb, and March in blue below
chxt=x,y,r,x
chxr=2,0,4
chxl=3:|Jan|Feb|Mar|1:|min|average|max
chxp=1,10,35,75
chxs=3,0000dd,13

両方の x 軸ラベルのフォント サイズ、色、配置が指定されています。

x 軸に沿って 1st と 15th が交互に表示され、その下に Feb と Mar が表示されている折れ線グラフで、ラベルはすべて青

x 軸に沿って 1st と 15th が交互に表示され、その下に Feb と Mar が表示されている折れ線グラフで、ラベルはすべて青
chxt=x,y,r,x
chxl=3:|Jan|Feb|Mar||
     0:|1st|15th|1st|15th|1st
chxs=0,0000dd,10|3,0000dd,12,1

トップへ戻る

スタイル

次のスタイルが用意されています。

棒の太さと間隔

棒グラフの棒の太さと間隔は次のように指定します。
chbh=
<bar width in pixels>,
<optional space between bars in a group>,
<optional space between groups>

パラメータ 説明

chbh

最初の例では、棒の太さは 10 ピクセルに設定されています。棒の間隔はデフォルトの 4 ピクセル、グループの間隔はデフォルトの 8 ピクセルです。

2 番目の例では、棒の太さは 10 ピクセル、棒の間隔は 5 ピクセル、グループの間隔は 15 ピクセルに設定されています。

値を 2 つのみ入力する場合には注意が必要です。3 番目の例では、棒の間隔が 8 ピクセルに設定されています。これはグループの間隔のデフォルトと同じなので、視覚的に区別がつかなくなりました。8 より大きな値を指定すると、棒が不適切にグループ化されます。

データセットが 2 つある水平棒グラフ: 片方のデータセットは赤、その隣のもう一方は緑
cht=bhg
chbh=10

データセットが 2 つある水平棒グラフ: 片方のデータセットは赤、その隣のもう一方は緑
cht=bvg
chbh=10,5,15

データセットが 2 つある水平棒グラフ: 片方のデータセットは赤、その隣のもう一方は緑
cht=bhg
chbh=10,8

データセットが 2 つある水平棒グラフ: 片方のデータセットは赤、その隣のもう一方は緑
cht=bhg
chbh=10,15

トップへ戻る

棒グラフの 0 座標位置

棒グラフでは、0 座標位置は次のように指定します。

chp=
<value between 0 and 1 for dataset 1>,
<value between 0 and 1 for dataset n>

1 つの値のみを指定すると、すべてのデータセットに同じ 0 座標位置が適用されます。

パラメータ 説明

chp

この例では、chp の値が .5 なので、0 座標位置はグラフの中央の高さとなります。このグラフはテキスト エンコードを使用しているため、データ ポイントの値によって、次のようになります。

  • 0~49 は 0 座標位置より下
  • 50 は 0 座標位置 (ただし例の 3 番目のデータ ポイントのように、何も表示されない)
  • 51~100 は 0 座標位置より上

0 座標位置がグラフの中央の高さに位置する垂直棒グラフ
chp=.5
chd=t:20,35,50,10,95

chds

0 座標位置を指定するもう 1 つの方法は、テキスト エンコードとの組み合わせでデータ スケーリング パラメータ (chds) を使用する方法です。

この例のデータセットの範囲は -60~120 で、スケーリングは -80~140 なので、棒の上下に空白があります。

詳しくはデータ スケーリングのあるテキスト エンコードをご覧ください。

2 つのデータセットのある水平棒グラフ: 共に赤で色付け
chd=t:30,-60,50,120,80
chds=-80,140

トップへ戻る

線のスタイル

次のグラフの線のスタイルを指定できます。

折れ線とスパークラインのスタイル

折れ線とスパークラインのスタイルは次のように指定します。

chls=
<data set 1 line thickness>,<length of line segment>,<length of blank segment>|
...

<data set n line thickness>,<length of line segment>,<length of blank segment>

パラメータ値は浮動小数点数で、複数の線スタイルは、パイプ文字 (|) で区切ります。最初の線のスタイルは最初のデータセットに、2 番目のスタイルは 2 番目のデータセットに適用され、以下同様に適用されます。

パラメータ 説明

chls

ここでは、3,6,3 で太い破線が、1,1,0 で細い実線が指定されています。

線の色の指定について詳しくは、チャートの色をご覧ください。

実線と波線が 1 本ずつある折れ線グラフ
chls=3,6,3|1,1,0

トップへ戻る

折れ線グラフ、スパークライン、棒グラフの線のスタイル

折れ線グラフと棒グラフの線のスタイルは次のように指定します。

chm=D,<color>,<data set index>,<data point>,<size>,<priority>

ここで

  • <color> RRGGBB 形式の 16 進数です。
  • <data set index> は線を描画するデータセットのインデックスです。最初のデータセットの場合 0、2 番目の場合 1、以下同様です。
  • <data point> は 0 です。
  • <size> はマーカーのサイズです (ピクセル単位)。
  • <priority> は棒、線、マーカー、塗りつぶしが描画される優先度です。
    1 は、線が棒やマーカーの上に描画されることを示します。
    0 はデフォルトであり、線が棒の上、マーカーの下に描画されることを示します。
    -1 は線が棒とマーカーの下に描画されることを示します。
パラメータ 説明
chm=D

棒グラフのデータ線の例です。優先度は 1 に設定されているため、線は棒の上に描画されています。

線マーカーのある棒グラフ
chm=
D,4D89F9,0,0,5,-1

スパークラインの例です。スパークラインは折れ線グラフと同じですが、デフォルトでは軸が表示されません。スパークラインの機能も折れ線グラフと同一です。

2 本の青い線のある折れ線グラフ
chm=
D,C6D9FD,1,0,8|
D,4D89F9,0,0,4

トップへ戻る

グリッド線

グリッド線は次のように指定します。

chg=
<x axis step size>,
<y axis step size>,
<length of line segment>,
<length of blank segment>

パラメータ値は、整数か、小数点以下 1 桁の小数 (10.0、10.5 など) です。

パラメータ 説明

chg

ステップ サイズのみが定義されている例 (20,50) です。Chart API のデフォルトの破線のグリッドが使用されます。

縦に 5 本、横に 2 本の、薄いグレーの破線グリッドを持つ折れ線グラフ
chg=20,50

ここでは、ステップ サイズ (20,50)、分断線 (1)、空白部 (5) が指定されています。

縦に 5 本、横に 2 本の、薄いグレーの破線グリッドを持つ折れ線グラフ
chg=20,50,1,5

空白部に 0 を指定すると、グリッドは実線になります。

縦に 5 本、横に 2 本の、薄いグレーの実線グリッドを持つ折れ線グラフ
chg=20,50,1,0

トップへ戻る

図形マーカーと範囲マーカー

折れ線グラフ、レーダー チャート、棒グラフ、散布図では、図形マーカーと範囲マーカーを chm で指定します。範囲マーカーには水平範囲マーカーと垂直範囲マーカーがあります。

図形マーカー

図形マーカーは次のように指定します。

chm=
<marker type>,<color>,<data set index>,<data point>,<size>,<priority>|
...
<marker type>,<color>,<data set index>,<data point>,<size>,<priority>

ここで

  • <marker type> は次の文字のいずれかです。
    a は矢印を表します。
    c は十字を表します。
    d はひし形を表します。
    o は円を表します。
    s は四角を表します。
    t はテキストを表します。
    vx 軸からデータ ポイントまでの垂直線を表します。
    V はチャート上端までの垂直線を表します。
    h はチャートを横断する水平線を表します。
    x は図形 x を表します。

  • <color> RRGGBB 形式の 16 進数です。
  • <data set index> はマーカーを描画する線のインデックスです。最初のデータセットの場合 0、2 番目の場合 1、以下同様です。
  • <data point> は、水平線以外のすべてのマーカーの場合、マーカーがどのデータ ポイントに描画されるかを指定する浮動小数点値です。最初のデータ ポイントの場合 0、2 番目のデータ ポイントの場合 1、以下同様となり、すべてのデータ ポイントの場合 -1 と指定します。2 つのデータ ポイント間でマーカーを補完するには、小数点以下を指定します。水平線のマーカーの場合は、次の表の最初の例を参照してください。
  • <size> はマーカーのサイズです (ピクセル単位)。
  • <priority> は、棒、線、マーカー、塗りつぶしの行われる順番を指定します。
    -1 はグラフの他のすべての要素の下にマーカーを描画することを指定します。つまり、同じ場所に他のグラフ要素が描画されると、マーカーは隠れてしまいます。
    0 はデフォルトであり、マーカーを棒や線の上、他のマーカーの下に描画することを指定します。
    1 はマーカーをグラフの他のすべての要素の上に描画することを指定します。つまり、同じ場所に他のグラフ要素が描画されると、その要素は隠れてしまいます。

複数のマーカーはパイプ文字 (|) で区切ります。

パラメータ 説明

chm

 

図形マーカーと線マーカーの全セットの例です。

リストの最後のマーカーである h は、垂直線 v および V と交差する水平線です。このタイプのマーカーでは、データ ポイントは指定しません。その代わり、グラフの下部に線を引くには 0.0 を使用し、グラフの上端に線を引くには 1.0 を使用し、その間の線には、その 2 つで補間する値を使用します。この例の値は 0.3 であるため、線はグラフの約 1/3 の高さに描画されます。

単一の折れ線上の各データ ポイントに、20 ピクセルの赤い十字、20 ピクセルの緑のひし形、9 ピクセルの紫の矢印、20 ピクセルのオレンジの円、10 ピクセルの青い四角、1 ピクセルの薄いグレーの垂直線、1 ピクセルの青い線、20 ピクセルの黄色い十字が描画された折れ線グラフです。細い黒の水平線が、ポイント 7 で垂直線 V と交差
chm=
c,FF0000,0,1.0,20.0|
d,80C65A,0,2.0,20.0|
a,990066,0,3.0,9.0|
o,FF9900,0,4.0,20.0|
s,3399CC,0,5.0,10.0|
v,BBCCED,0,6.0,1.0|
V,3399CC,0,7.0,1.0|
x,FFCC33,0,8.0,20.0|
h,000000,0,0.30,0.5

これは散布図上のマーカー タイプ s の例です。

各データ ポイントのサイズ設定について詳しくは、散布図のセクションをご覧ください。

10 ピクセルの赤い四角のマーカーが表示された散布図
chm=
s,FF0000,1,1.0,10.0

 

これは、2 つのデータセットに対してひし形と円を使用した例です。

2 つのデータ ポイントが同一の位置を占める場合 (xy の値が同一)、先に指定されたポイントが描画されます。ここでは、円がひし形より優先されています。

1 つのデータセットのすべてのデータ ポイントに同じ図形を指定するには、-1 を使用します。

片方の折れ線のデータ ポイントには 10 ピクセルの円が、もう片方の折れ線には 10 ピクセルのひし形が描かれた折れ線グラフです。両方の折れ線が共有する点には円が描画されます。
chm=
o,ff9900,0,-1,10.0|
d,ff9900,1,-1,10.0

これは、マーカーにテキストを使用した棒グラフです。データと同じ順序でテキスト マーカーを指定します。

5 番目の値はオプションで、優先度を指定します。

  • 0 はデフォルトで、テキストを棒の上、他のマーカーの下に描画します。例のグラフの 2 番目の棒では、このように描画されています (April desktop hits)。
  • 1 は、テキストを棒や他のマーカーの上に描画します。
  • -1 は、テキストを棒や他のマーカーの下に描画します。例のグラフの 3 番目の棒では、このように描画されています (May mobile hits)。
テキスト マーカーのある棒グラフ
chm=
tApril+mobile+hits,000000,0,0,13|
tMay+mobile+hits,000000,0,1,13,-1|
tApril+desktop+hits,000000,1,0,13|
tMay+desktop+hits,000000,1,1,13

トップへ戻る

範囲マーカー

折れ線グラフ、レーダー チャート、散布図では、水平範囲マーカーと垂直範囲マーカーを次のように指定します。

chm=
<r or R>,<color>,<any value>,<start point>,<end point>|
...
<r or R>,<color>,<any value>,<start point>,<end point>

ここで

  • <r or R> は、水平範囲の場合 r、垂直範囲の場合 R を指定します。
  • <color>RRGGBB 形式の 16 進数です。
  • <any value> は無視されます。
  • <start point>
    水平範囲マーカーの場合、範囲始点の y 軸上の位置を示し、0.00 が下端、1.00 が上端です。
    垂直範囲マーカーの場合、範囲始点の x 軸上の位置を示し、0.00 が左端、1.00 が右端です。
  • <end point>
    水平範囲マーカーの場合、範囲終点の y 軸上の位置を示し、0.00 が下端、1.00 が上端です。
    垂直範囲マーカーの場合、範囲終点の x 軸上の位置を示し、0.00 が左端、1.00 が右端です。

複数の範囲マーカーはパイプ文字 (|) で区切ります。

パラメータ 説明

chm=r

範囲マーカーは、1 本の線の場合も、色の付いた帯の場合もあります。ここで、最初のマーカーは薄い青の帯 (E5ECF9)、2 番目のマーカーは黒い線 (000000) です。

薄い青の水平の帯が y 軸の 25%~75% の位置にあり、細い水平線が y 軸の 10% の位置にある折れ線グラフ
chm=
r,E5ECF9,0,0.75,0.25|
r,000000,0,0.1,0.11
chm=R これは、垂直範囲マーカーの場合の同様の例です。この例では、最初のマーカーは赤い線 (ff0000)、2 番目のマーカーは薄い青の帯 (A0BAE9) です。 薄い青の垂直の帯が x 軸の 25%~75% の位置にあり、細い垂直線が x 軸の 10% の位置にある折れ線グラフ
chm=
R,ff0000,0,0.1,0.11|
R,A0BAE9,0,0.75,0.25
chm=
R...|r...
水平と垂直の範囲マーカーは併用できます。重なった場合、最後に指定したマーカーがそれ以前のマーカーより優先されます。ここでは、水平なマーカーが最後に指定されているので、垂直のマーカーに重ねて描画されます。

青い垂直の帯と薄い青の水平の帯が、x 軸と y 軸それぞれの 25%~75% に位置する折れ線グラフ。垂直の細い赤線と水平の細い黒線が、x 軸と y 軸それぞれの 10% に位置しています。
chm=
R,ff0000,0,0.1,0.11|
R,A0BAE9,0,0.75,0.25
|
r,E5ECF9,0,0.75,0.25|
r,000000,0,0.1,0.11

chm=r 薄い水平線と右側の y 軸のラベルを組み合わせたスパークラインを示します。 1 本の黄色い線と 3 本の等間隔の水平線のあるスパークライン
chm=
r,000000,0,0.499,0.501|
r,000000,0,0.998,1.0|
r,000000,0,0.0,0.002

トップへ戻る

文字マッピング

簡易エンコードの文字値

簡易エンコードのマッピングを以下に示します。

文字
A 0
B 1
C 2
D 3
E 4
F 5
G 6
H 7
I 8
J 9
K 10
L 11
M 12
N 13
O 14
P 15
Q 16
R 17
S 18
T 19
U 20
V 21
W 22
X 23
Y 24
Z 25
a 26
b 27
c 28
d 29
e 30
f 31
g 32
h 33
i 34
j 35
k 36
l 37
m 38
n 39
o 40
p 41
q 42
r 43
s 44
t 45
u 46
v 47
w 48
x 49
y 50
z 51
0 52
1 53
2 54
3 55
4 56
5 57
6 58
7 59
8 60
9 61

トップへ戻る

拡張エンコードの文字値

拡張エンコードの 4,096 の値すべてをマップするには、63 x 63 のグリッドが必要です。そのようなグリッドは、この HTML ページでは判読できなくなります。このため、スプレッドシートを使用して、自分用のグリッドをセットアップすることをお勧めします。必要なグリッドの一部を以下に示します。

拡張エンコードをマッピングするためのスプレッドシートをセットアップする方法は次のとおりです。

  1. アルファベット大文字 (A-Z)、アルファベット小文字 (a-z)、0~9、ハイフン (-)、ピリオド (.) を順に 1 行に含むスプレッドシートを作成します。
  2. 同じ値を持つ 1 列を左側に作成します。
  3. A 行の A に 0 を入力し、A 行の B に 1 を入力し、以下同様に入力して、A 行のピリオド (.) に 63 を入力します。その一部を以下に示します。
  4. 行 B の A で、行 A の A に 64 を加算するように設定します。そのセルを、列 B の残りの部分にコピーします。
  5. 列 B を他のすべての列にコピーします。
  6. 表の最後の値、列ピリオド (.)、行ピリオド (.) は 4095 になるはずです。

表を読み取る場合、先に列を、その後で行を探します。次に例を示します。

  • 7 = AH
  • 133 = CF
  • 3975 = -H
  • 4037 = .F
  A B C -> 9 ハイフン (-) ピリオド (.)
A 0 64 128 ... 3904 3968 4032
B 1 65 129 ... 3905 3969 4033
C 2 66 130 ... 3906 3970 4034
D 3 67 131 ... 3907 3971 4035
E 4 68 132 ... 3908 3972 4036
F 5 69 133 ... 3909 3973 4037
G 6 70 134 ... 3910 3974 4038
H 7 71 135 ... 3911 3975 4039
I 8 72 136 ... 3912 3976 4040
J 9 73 137 ... 3913 3977 4041
K 10 74 138 ... 3914 3978 4042
L 11 75 139 ... 3915 3979 4043
M 12 76 140 ... 3916 3980 4044
N 13 77 141 ... 3917 3981 4045
O 14 78 142 ... 3918 3982 4046
P 15 79 143 ... 3919 3983 4047
Q 16 80 144 ... 3920 3984 4048
R 17 81 145 ... 3921 3985 4049
S 18 82 146 ... 3922 3986 4050
T 19 83 147 ... 3923 3987 4051
U 20 84 148 ... 3924 3988 4052
V 21 85 149 ... 3925 3989 4053
W 22 86 150 ... 3926 3990 4054
X 23 87 151 ... 3927 3991 4055
Y 24 88 152 ... 3928 3992 4056
Z 25 89 153 ... 3929 3993 4057
a 26 90 154 ... 3930 3994 4058
b 27 91 155 ... 3931 3995 4059
c 28 92 156 ... 3932 3996 4060
d 29 93 157 ... 3933 3997 4061
e 30 94 158 ... 3934 3998 4062
f 31 95 159 ... 3935 3999 4063
g 32 96 160 ... 3936 4000 4064
h 33 97 161 ... 3937 4001 4065
i 34 98 162 ... 3938 4002 4066
j 35 99 163 ... 3939 4003 4067
k 36 100 164 ... 3940 4004 4068
l 37 101 165 ... 3941 4005 4069
m 38 102 166 ... 3942 4006 4070
n 39 103 167 ... 3943 4007 4071
o 40 104 168 ... 3944 4008 4072
p 41 105 169 ... 3945 4009 4073
q 42 106 170 ... 3946 4010 4074
r 43 107 171 ... 3947 4011 4075
s 44 108 172 ... 3948 4012 4076
t 45 109 173 ... 3949 4013 4077
u 46 110 174 ... 3950 4014 4078
v 47 111 175 ... 3951 4015 4079
w 48 112 176 ... 3952 4016 4080
x 49 113 177 ... 3953 4017 4081
y 50 114 178 ... 3954 4018 4082
z 51 115 179 ... 3955 4019 4083
0 52 116 180 ... 3956 4020 4084
1 53 117 181 ... 3957 4021 4085
2 54 118 182 ... 3958 4022 4086
3 55 119 183 ... 3959 4023 4087
4 56 120 184 ... 3960 4024 4088
5 57 121 185 ... 3961 4025 4089
6 58 122 186 ... 3962 4026 4090
7 59 123 187 ... 3963 4027 4091
8 60 124 188 ... 3964 4028 4092
9 61 125 189 ... 3965 4029 4093
ハイフン 62 126 190 ... 3966 4030 4094
ピリオド 63 127 191 ... 3967 4031 4095

トップへ戻る

ISO 3166 国コード

次の表に、246 か国の国名を ISO 3166-1 で指定されている英語の正式な省略名のアルファベット順に、対応する ISO 3166-1-alpha-2 コード要素とともに示します。

これらのコードは、africaasiaeuropemiddle_eastsouth_americaworld の地域タイプの地図を描画するときに使用します。詳しくはこのドキュメントの地図をご覧ください。

国名 ISO 3166-1-alpha-2 コード
A  
アフガニスタン AF
オーランド諸島 AX
アルバニア AL
アルジェリア DZ
アメリカ領サモア AS
アンドラ AD
アンゴラ AO
アンギラ AI
南極 AQ
アンティグア・バーブーダ AG
アルゼンチン AR
アルメニア AM
アルバ AW
オーストラリア AU
オーストリア AT
アゼルバイジャン AZ
B  
バハマ BS
バーレーン BH
バングラデシュ BD
バルバドス BB
ベラルーシ BY
ベルギー BE
ベリーズ BZ
ベナン BJ
バミューダ諸島 BM
ブータン BT
ボリビア BO
ボスニア・ヘルツェゴビナ BA
ボツワナ BW
ブーベ島 BV
ブラジル BR
イギリス領インド洋地域 IO
ブルネイ・ダルサラーム国 BN
ブルガリア BG
ブルキナファソ BF
ブルンジ BI
C  
カンボジア KH
カメルーン CM
カナダ CA
カーボベルデ CV
ケイマン諸島 KY
中央アフリカ共和国 CF
チャド TD
チリ CL
中華人民共和国 CN
クリスマス島 CX
ココス (キーリング) 諸島 CC
コロンビア CO
コモロ KM
コンゴ共和国 CG
コンゴ民主共和国 CD
クック諸島 CK
コスタリカ CR
コートジボワール CI
クロアチア HR
キューバ CU
キプロス CY
チェコ共和国 CZ
D  
デンマーク DK
ジブチ DJ
ドミニカ国 DM
ドミニカ共和国 DO
E  
エクアドル EC
エジプト EG
エルサルバドル SV
赤道ギニア GQ
エリトリア ER
エストニア EE
エチオピア ET
F  
フォークランド諸島 (マルビナス諸島) FK
フェロー諸島 FO
フィジー FJ
フィンランド FI
フランス FR
フランス領ギアナ GF
フランス領ポリネシア PF
フランス領南方・南極地域 TF
G  
ガボン GA
ガンビア GM
グルジア GE
ドイツ DE
ガーナ GH
ジブラルタル GI
ギリシャ GR
グリーンランド GL
グレナダ GD
グアドループ GP
グアム GU
グアテマラ GT
ガーンジー島 GG
ギニア GN
ギニアビサウ GW
ガイアナ GY
H  
ハイチ HT
ハード島とマクドナルド諸島 HM
ローマ法王庁 (バチカン市国) VA
ホンジュラス HN
香港 HK
ハンガリー HU
I  
アイスランド IS
インド IN
インドネシア ID
イラン・イスラム共和国 IR
イラク IQ
アイルランド IE
マン島 IM
イスラエル IL
イタリア IT
J  
ジャマイカ JM
日本 JP
ジャージー島 JE
ヨルダン JO
K  
カザフスタン KZ
ケニア KE
キリバス KI
朝鮮民主主義人民共和国 KP
大韓民国 KR
クウェート KW
キルギス KG
L  
ラオス人民民主共和国 LA
ラトビア LV
レバノン LB
レソト LS
リベリア LR
リビア LY
リヒテンシュタイン LI
リトアニア LT
ルクセンブルク LU
M  
マカオ MO
マケドニア共和国 MK
マダガスカル MG
マラウイ MW
マレーシア MY
モルディブ MV
マリ ML
マルタ MT
マーシャル諸島 MH
マルチニーク島 MQ
モーリタニア MR
モーリシャス MU
マヨット島 YT
メキシコ MX
ミクロネシア連邦 FM
モルドバ MD
モナコ MC
モンゴル MN
モンテネグロ ME
モントセラト MS
モロッコ MA
モザンビーク MZ
ミャンマー MM
N  
ナミビア NA
ナウル NR
ネパール NP
オランダ NL
オランダ領アンティル AN
ニューカレドニア NC
ニュージーランド NZ
ニカラグア NI
ニジェール NE
ナイジェリア NG
ニウエ NU
ノーフォーク島 NF
北マリアナ諸島 MP
ノルウェー NO
O  
オマーン OM
P  
パキスタン PK
パラオ PW
パレスチナ PS
パナマ PA
パプアニューギニア PG
パラグアイ PY
ペルー PE
フィリピン PH
ピトケアン PN
ポーランド PL
ポルトガル PT
プエルトリコ PR
Q  
カタール QA
R  
レユニオン RE
ルーマニア RO
ロシア RU
ルワンダ RW
S  
サン・バルテルミー島 BL
セントヘレナ島 SH
セントクリストファー・ネイビス KN
セントルシア LC
サン・マルタン島 MF
サンピエール島・ミクロン島 PM
セントビンセントおよびグレナディーン諸島 VC
サモア WS
サンマリノ SM
サントメ・プリンシペ ST
サウジアラビア SA
セネガル SN
セルビア RS
セーシェル SC
シエラレオネ SL
シンガポール SG
スロバキア SK
スロベニア SI
ソロモン諸島 SB
ソマリア SO
南アフリカ ZA
南ジョージア島・南サンドイッチ諸島 GS
スペイン ES
スリランカ LK
スーダン SD
スリナム SR
スバールバル諸島・ヤンマイエン島 SJ
スワジランド SZ
スウェーデン SE
スイス CH
シリア・アラブ共和国 SY
T  
台湾 (台湾省/中華民国) TW
タジキスタン TJ
タンザニア TZ
タイ TH
東ティモール TL
トーゴ TG
トケラウ諸島 TK
トンガ TO
トリニダード・トバゴ TT
チュニジア TN
トルコ TR
トルクメニスタン TM
タークス諸島およびカイコス諸島 TC
ツバル TV
U  
ウガンダ UG
ウクライナ UA
アラブ首長国連邦 AE
イギリス GB
アメリカ合衆国 US
アメリカ領太平洋諸島 UM
ウルグアイ UY
ウズベキスタン UZ
V  
バヌアツ VU
バチカン市国 教皇庁を参照
ベネズエラ VE
ベトナム VN
イギリス領ヴァージン諸島 VG
アメリカ領ヴァージン諸島 VI
W  
ウォリス・フツナ WF
西サハラ EH
Y  
イエメン YE
Z  
ザンビア ZM
ジンバブエ ZW

トップへ戻る

米国の州コード

次の表に、アメリカ合衆国の各州の州コードを示します。これらのコードは、usa の地域タイプの地図を描画するときに使用します。詳しくはこのドキュメントの地図をご覧ください。

AL Alabama LA Louisiana OH Ohio
AK Alaska ME Maine OK Oklahoma
AZ Arizona MD Maryland OR Oregon
AR Arkansas MA Massachusetts PA Pennsylvania
CA California MI Michigan RI Rhode Island
CO Colorado MN Minnesota SC S Carolina
CT Connecticut MS Mississippi SD S Dakota
DE Delaware MO Missouri TN Tennessee
FL Florida MT Montana TX Texas
GA Georgia NE Nebraska UT Utah
HI Hawaii NV Nevada VT Vermont
ID Idaho NH New Hampshire VA Virginia
IL Illinois NJ New Jersey WA Washington
IN Indiana NM New Mexico WV W Virginia
IA Iowa NY New York WI Wisconsin
KS Kansas NC N Carolina WY Wyoming
KY Kentucky ND N Dakota  

トップへ戻る