jQuery の jqPlot プラグインには、とても多くのオプションが存在する。
オプションを使いこなすと、タイトル、系列、軸、凡例、グラフの種類など、自由自在だ。
オプションの指定方法
オプションは、上記のように、jqplotの3つ目の引数で、
プロパティ: 値,
プロパティ: 値,
プロパティ: 値
}
のように、プロパティごとに指定する。
オプション
- seriesColors
系列の色を配列で順番に指定。
- title
下記のタイトル用プロパティでカスタマイズすることもできる。
- text
タイトルのテキスト。
- show
タイトルを表示するか。
- fontFamily
タイトルのフォントの種類。
- fontSize
タイトルのフォントサイズ。
- textAlign
タイトルのテキストの水平方向の配置位置。
left
: 左寄せcenter
: 中央left
: 右寄せ
- textColor
タイトルのフォントの色。
- axes
軸に関するオプション。
- xaxis
X軸に関するオプション。
- min
X軸上の最小値を指定。
- max
X軸上の最大値を指定。
- pad
X軸上の余白を調整。
面グラフ作成時には、「0」を指定し、余白をなくすことが多い。
- ticks
X軸上の目盛りを指定。
指定しない場合は、自動的に計算する。
- tickOptions
目盛りに関するオプション。
- mark
目盛りの位置。初期設定値は、「outside」。
- outside:外側
- inside:内側
- showMark
目盛りを表示するか。「true」は表示。「false」は非表示。初期設定値は、「true」。
- showGridline
グリッド線を表示するか。「true」は表示。「false」は非表示。初期設定値は、「true」。
- markSize
目盛りのサイズ。初期設定値は、「4」。
- show
目盛りと目盛りのラベルを表示するか。「true」は表示。「false」は非表示。初期設定値は、「true」。
- showLabel
目盛りのラベルを表示するか。「true」は表示。「false」は非表示。初期設定値は、「true」。
- formatString
目盛りのラベルの形式を指定。
%d
: 整数%f
: 小数%g
: データ値%s
:文字列
- showTicks
目盛りと目盛りのラベルを表示するか。「true」は表示。「false」は非表示。初期設定値は、「true」。
- label
- labelOptions
X軸のラベルに関するオプション。
- fontFamily
- fontSize
- X軸のラベルのフォントサイズ。
- renderer
jQuery . jqplot . CategoryAxisRenderer
: X軸をカテゴリとして扱う。
- yaxis
Y軸に関するオプション。
- min
- max
- pad
Y軸上の余白を調整。
面グラフ作成時には、「0」を指定し、余白をなくすことが多い。
- ticks
指定しない場合は、自動的に計算する。
- tickOptions
-
- mark
目盛りの位置。初期設定値は、「outside」。
- outside:外側
- inside:内側
- showMark
目盛りを表示するか。「true」は表示。「false」は非表示。初期設定値は、「true」。
- showGridline
グリッド線を表示するか。「true」は表示。「false」は非表示。初期設定値は、「true」。
- markSize
目盛りのサイズ。初期設定値は、「4」。
- show
目盛りと目盛りのラベルを表示するか。「true」は表示。「false」は非表示。初期設定値は、「true」。
- showLabel
目盛りのラベルを表示するか。「true」は表示。「false」は非表示。初期設定値は、「true」。
- formatString
目盛りのラベルの形式を指定。
%d
: 整数%f
: 小数%g
: データ値%s
:文字列
- showTicks
目盛りと目盛りのラベルを表示するか。「true」は表示。「false」は非表示。初期設定値は、「true」。
- label
- labelOptions
Y軸のラベルに関するオプション。
- fontFamily
- fontSize
- Y軸のラベルのフォントサイズ。
- renderer
jQuery . jqplot . CategoryAxisRenderer
: Y軸をカテゴリとして扱う。
- seriesDefaults
グラフの種類や、系列の色、太さなど、系列に関する初期設定。
- show
系列を表示するかどうか。「true」は表示。「false」は非表示。初期設定値は、「true」。
- color
- linePattern
系列の線の種類を指定。初期設定値は、「solid」。
- solid: 実線
- dashed: 破線
- dotted: 点線
[ 1つ目の破線の長さ, 次の破線までの長さ, 2つ目の破線の長さ, 次の破線までの長さ, ・・・ ]
のように、「破線の長さ」と「破線の間隔(次の破線までの距離)」を、交互に配列で指定することもできる。-.
のように、破線と点線を組み合わせることもできる。-
は、dash(破線)、.
は、dot(点線)を意味する。
- lineWidth
- shadow
系列の影を表示するか。「true」は表示。「false」は非表示。初期設定値は、「true」。
- shadowAngle
系列の影の角度。x軸から時計回り。
- showLine
系列の線を表示するか。「true」は表示。「false」は非表示。初期設定値は、「true」。
- showMarker
系列のマーカーを表示するか。「true」は表示。「false」は非表示。初期設定値は、「true」。
- fill
系列の線の下を塗りつぶすか。「true」は塗りつぶ。「false」は塗らない。初期設定値は、「false」。
面グラフ生成時に使うオプション。
- fillAndStroke
系列の線を表示するか。「true」は表示。「false」は非表示。初期設定値は、「false」。
面グラフ生成時に使うオプション。
- fillColor
系列の線の下を塗りつぶす色。
面グラフ生成時に使うオプション。
- fillAlpha
面グラフ生成時に使うオプション。
- fillToZero
系列の線とゼロ(0値)の間を塗りつぶすか。「true」を指定すると、系列の線の下であっても、0以下は塗りつぶさず、値が負の値である場合だけ、0と負の値の間を塗りつぶす。初期設定値は、「false」。
面グラフ生成時に使うオプション。
- renderer
系列の生成編集に使うプラグインを指定。
jQuery . jqplot . BarRenderer
: 棒グラフjQuery . jqplot . BezierCurveRenderer
: ベジェ曲線グラフjQuery . jqplot . BlockRenderer
: ブロックチャートjQuery . jqplot . BubbleRenderer
: バブルチャートjQuery . jqplot . DonutRenderer
: ドーナツグラフjQuery . jqplot . MeterGaugeRenderer
: メーターゲージjQuery . jqplot . MekkoRenderer
: マリメッコ・チャートjQuery . jqplot . OHLCRenderer
: いかり足、ローソク足jQuery . jqplot . PieRenderer
: 円グラフjQuery . jqplot . PyramidRenderer
: ピラミッドグラフ
- rendererOptions
系列の生成編集オプション。
- barDirection
棒グラフの種類。
horizontal
: 横棒グラフ
- markerOptions
系列のマーカーに関するオプション。
- show
系列のマーカーを表示するか。「true」は表示。「false」は非表示。初期設定値は、「true」。
- style
2012/02/11現在、指定できるスタイルは、diamond、circle、square、x、plus、dash、filledDiamond、filledCircle、filledSquareの9つ。
初期設定値は、「filledCircle」。
- lineWidth
系列のマーカーの線の太さ。初期設定値は、「2」。
- size
系列のマーカーの大きさ。初期設定値は、「9」。
- color
系列のマーカーの色。初期設定値は、系列の線の色と同じ。
- shadow
系列のマーカーの影を表示するか。「true」は表示。「false」は非表示。初期設定値は、「true」。
- shadowAngle
系列のマーカーの影の角度。x軸から時計回り。初期設定値は、「45」。
- shadowOffset
系列のマーカーの影の、線からのオフセット。初期設定値は、「1」。
- shadowDepth
初期設定値は、「3」。
- shadowAlpha
系列のマーカーの影の不透明度。初期設定値は、「0.07」。
- series
各系列ごとに指定する系列に関するオプション。1つ目の系列から順に、配列で指定する。
- show
系列を表示するかどうか。「true」は表示。「false」は非表示。初期設定値は、「true」。
- label
- color
- linePattern
系列の線の種類を指定。初期設定値は、「solid」。
- solid: 実線
- dashed: 破線
- dotted: 点線
[ 1つ目の破線の長さ, 次の破線までの長さ, 2つ目の破線の長さ, 次の破線までの長さ, ・・・ ]
のように、「破線の長さ」と「破線の間隔(次の破線までの距離)」を、交互に配列で指定することもできる。-.
のように、破線と点線を組み合わせることもできる。-
は、dash(破線)、.
は、dot(点線)を意味する。
- lineWidth
- shadow
系列の影を表示するか。「true」は表示。「false」は非表示。初期設定値は、「true」。
- shadowAngle
系列の影の角度。x軸から時計回り。
- showLine
系列の線を表示するか。「true」は表示。「false」は非表示。初期設定値は、「true」。
- showMarker
系列のマーカーを表示するか。「true」は表示。「false」は非表示。初期設定値は、「true」。
- fill
系列の線の下を塗りつぶすか。「true」は塗りつぶ。「false」は塗らない。初期設定値は、「false」。
面グラフ生成時に使うオプション。
- fillAndStroke
系列の線を表示するか。「true」は表示。「false」は非表示。初期設定値は、「false」。
面グラフ生成時に使うオプション。
- fillColor
系列の線の下を塗りつぶす色。
面グラフ生成時に使うオプション。
- fillAlpha
面グラフ生成時に使うオプション。
- fillToZero
系列の線とゼロ(0値)の間を塗りつぶすか。「true」を指定すると、系列の線の下であっても、0以下は塗りつぶさず、値が負の値である場合だけ、0と負の値の間を塗りつぶす。初期設定値は、「false」。
面グラフ生成時に使うオプション。
- renderer
系列の生成編集に使うプラグインを指定。
jQuery . jqplot . BarRenderer
: 棒グラフjQuery . jqplot . BubbleRenderer
: バブルチャートjQuery . jqplot . BlockRenderer
: ブロックチャートjQuery . jqplot . MekkoRenderer
: マリメッコ・チャートjQuery . jqplot . BezierCurveRenderer
: ベジェ曲線グラフjQuery . jqplot . PieRenderer
: 円グラフjQuery . jqplot . DonutRenderer
: ドーナツグラフjQuery . jqplot . MeterGaugeRenderer
: メーターゲージ
- rendererOptions
系列の生成編集オプション。
- barDirection
棒グラフの種類。
horizontal
: 横棒グラフ
- markerOptions
系列のマーカーに関するオプション。
- show
系列のマーカーを表示するか。「true」は表示。「false」は非表示。初期設定値は、「true」。
- style
2012/02/11現在、指定できるスタイルは、diamond、circle、square、x、plus、dash、filledDiamond、filledCircle、filledSquareの9つ。
初期設定値は、「filledCircle」。
- lineWidth
系列のマーカーの線の太さ。初期設定値は、「2」。
- size
系列のマーカーの大きさ。初期設定値は、「9」。
- color
系列のマーカーの色。初期設定値は、系列の線の色と同じ。
- shadow
系列のマーカーの影を表示するか。「true」は表示。「false」は非表示。初期設定値は、「true」。
- shadowAngle
系列のマーカーの影の角度。x軸から時計回り。初期設定値は、「45」。
- shadowOffset
系列のマーカーの影の、線からのオフセット。初期設定値は、「1」。
- shadowDepth
初期設定値は、「3」。
- shadowAlpha
系列のマーカーの影の不透明度。初期設定値は、「0.07」。
- legend
凡例に関するオプション。
- stackSeries
系列を積み上げ方式にするか。「true」にすると積み上げ方式。初期設定値は「false」。