jQuery の jqPlot プラグインのオプション

jQuery の jqPlot プラグインには、とても多くのオプションが存在する。

オプションを使いこなすと、タイトル、系列、軸、凡例、グラフの種類など、自由自在だ。

オプションの指定方法

jQuery . jqplot( 'グラフを表示する要素のID', データ, オプション );

オプションは、上記のように、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

X軸のラベル

labelOptions

X軸のラベルに関するオプション。

fontFamily

X軸のラベルのフォントの種類

fontSize

X軸のラベルのフォントサイズ
renderer

jQuery . jqplot . CategoryAxisRendererX軸をカテゴリとして扱う。

yaxis

Y軸に関するオプション。

min

Y軸上の最小値を指定。

max

Y軸上の最大値を指定。

pad

Y軸上の余白を調整。

面グラフ作成時には、「0」を指定し、余白をなくすことが多い。

ticks

Y軸上の目盛りを指定。

指定しない場合は、自動的に計算する。

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

Y軸のラベル

labelOptions

Y軸のラベルに関するオプション。

fontFamily

Y軸のラベルのフォントの種類

fontSize

Y軸のラベルのフォントサイズ
renderer

jQuery . jqplot . CategoryAxisRendererY軸をカテゴリとして扱う。

seriesDefaults

グラフの種類や、系列の色、太さなど、系列に関する初期設定。

show

系列を表示するかどうか。「true」は表示。「false」は非表示。初期設定値は、「true」。

color

系列の色。

linePattern

系列の線の種類を指定。初期設定値は、「solid」。

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

系列の生成編集に使うプラグインを指定。

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」。

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

凡例に関するオプション。

show

凡例を表示するか。「true」は表示。「false」は非表示。初期設定値は、「false」。

placement

凡例を配置する位置。

location

凡例を配置する位置(方角)。


xoffset

X軸またはX2軸から、凡例ボックスまでの、距離。

yoffset

Y軸またはY2軸から、凡例ボックスまでの、距離。

stackSeries

系列を積み上げ方式にするか。「true」にすると積み上げ方式。初期設定値は「false」。

スポンサード リンク

カテゴリー: JavaScript, jqPlot, jQuery, プラグイン パーマリンク