jqPlot

各種グラフ（チャート、図表）を生成するには、jQuery の jqPlot プラグインが便利。

• 線グラフ
• 縦棒グラフ
• 横棒グラフ
• 面グラフ
• ウォーターフォールチャート
• 散布図
• バブルチャート
• マリメッコチャート
• 円グラフ
• ドーナツグラフ
• メーターゲージ
• トレンドライン
• ローソク足
• いかり足
• ブロックチャート
• ピラミッドグラフ

リファレンス

• jQuery の jqPlot プラグイン

  導入方法や基本的使い方について。

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

  オプションについて。

• jqplot.barRenderer.js

  棒グラフを生成するのに必要なプラグイン。

• jqplot.blockRenderer.js

  ブロックチャートを生成するのに必要なプラグイン。

• jqplot.bubbleRenderer.js

  バブルチャートを生成するのに必要なプラグイン。

• jqplot.canvasOverlay.js

  グラフに線を描き加えるのに必要なプラグイン。

• jqplot.dateAxisRenderer.js

  年月日や時刻など、軸を時間軸として扱う際に必要なプラグイン。

• jqplot.donutRenderer.js

  ドーナツグラフを生成するのに必要なプラグイン。

• jqplot.dragable.js

  系列のデータポイントをドラッグで移動できるようにするのに必要なプラグイン。

• jqplot.enhancedLegendRenderer.js

  凡例機能を拡張するのに必要なプラグイン。

• jqplot.highlighter.js

  ツールチップなど、ハイライト表示に必要なプラグイン。

• jqplot.meterGaugeRenderer.js

  メーターゲージを生成するのに必要なプラグイン。

• jqplot.ohlcRenderer.js

  いかり足やローソク足などのチャートを生成するのに必要なプラグイン。

• jqplot.pieRenderer.js

  円グラフ（パイチャート）を生成するのに必要なプラグイン。

• jqplot.pointLabels.js

  データポイントラベルを表示するのに必要なプラグイン。

• jqplot.trendline.js

  トレンドラインを描き加えるのに必要なプラグイン。

線グラフ

• jQuery の jqPlot プラグインで作るシンプルな折れ線グラフ
• jQuery の jqPlot プラグインで作るタイトル付き折れ線グラフ
• jQuery の jqPlot プラグインで作る軸ラベル付き折れ線グラフ
• jQuery の jqPlot プラグインによるグラフの軸ラベルのフォントを指定
• jQuery の jqPlot において、X軸をカテゴリとして扱う
• jQuery の jqPlot プラグインで作る複数系列の折れ線グラフ
• jQuery の jqPlot で作る外側右上の凡例付き複数系列の折れ線グラフ
• jQuery の jqPlot で作るグリッド右上の凡例付き複数系列の折れ線グラフ
• jQuery の jqPlot で作る内側右下の凡例付き複数系列の折れ線グラフ
• jQuery の jqPlot で作るグリッド左の凡例付き複数系列の折れ線グラフ
• jQuery の jqPlot で作るグラフのタイトルをカスタマイズ
• jQuery の jqPlot の折れ線グラフのマーカースタイルをまとめて変更
• jQuery の jqPlot の折れ線グラフのマーカースタイルを系列ごとに変更
• jQuery の jqPlot の折れ線グラフの線の太さをまとめて変更
• jQuery の jqPlot の折れ線グラフの線の太さを系列ごとに変更
• jQuery の jqPlot の折れ線グラフのマーカーの表示/非表示をまとめて変更
• jQuery の jqPlot の折れ線グラフのマーカーの表示/非表示を系列ごとに指定
• jQuery の jqPlot の折れ線グラフのマーカーのサイズをまとめて変更
• jQuery の jqPlot の折れ線グラフのマーカーのサイズを系列ごとに指定
• jQuery の jqPlot の折れ線グラフのマーカーの色をまとめて変更
• jQuery の jqPlot の折れ線グラフのマーカーの色を系列ごとに指定
• jQuery の jqPlot の折れ線グラフの線とマーカーの色を配列で変更
• jQuery の jqPlot の折れ線グラフの線の表示/非表示をまとめて変更
• jQuery の jqPlot の折れ線グラフの線の表示/非表示を系列ごとに変更
• jQuery の jqPlot の折れ線グラフの系列の色をまとめて変更
• jQuery の jqPlot の折れ線グラフの系列の色を系列ごとに変更
• jQuery の jqPlot プラグインで作る積み上げ折れ線グラフ
• jQuery の jqPlot の折れ線グラフにおいてY軸の最小値と最大値を指定
• jQuery の jqPlot プラグインで作る科目別得点推移の折れ線グラフ
• jQuery の jqPlot で作るデータポイントラベル付き折れ線グラフ
• jQuery の jqPlot の線グラフのポイントとラベルの縦パディングを調整
• jQuery の jqPlot の折れ線グラフで、データポイントラベルを左に表示
• jQuery の jqPlot の線グラフのポイントとラベルの横パディングを調整
• jQuery の jqPlot の折れ線グラフのデータポイントラベルのテキストを調整
• jQuery の jqPlot で作るHTML形式データポイントラベル付き折れ線グラフ
• jQuery の jqPlot の折れ線グラフのデータポイントラベルを予め指定①
• jQuery の jqPlot の折れ線グラフのデータポイントラベルを予め指定②
• jQuery の jqPlot で作る折れ線グラフのY軸上の目盛りを指定
• jQuery の jqPlot で作る折れ線グラフのY軸上の目盛りをカスタマイズ
• jQuery の jqPlot プラグインで作る滑らかな線の線グラフ
• jQuery の jqPlot プラグインで作る負の値を含む滑らかな線の線グラフ
• jQuery の jqPlot プラグインで作る破線の線グラフ
• jQuery の jqPlot プラグインで作る滑らかな破線の線グラフ
• jQuery の jqPlot プラグインで作る点線の線グラフ
• jQuery の jqPlot プラグインで作る滑らかな点線の線グラフ
• jQuery の jqPlot で作る破線の線グラフの破線の長さと間隔を指定
• jQuery の jqPlot で作る点線と破線を組み合わせた線グラフ
• jQuery の jqPlot の折れ線グラフにおいて系列の線と線の間を塗る
• jQuery の jqPlot の折れ線グラフに実線や破線の水平線を描き加える
• jQuery の jqPlot の折れ線グラフの水平の実線をカスタマイズ
• jQuery の jqPlot の折れ線グラフの水平の破線をカスタマイズ
• jQuery の jqPlot の線グラフに加える水平の実線の始点と終点を指定
• jQuery の jqPlot の線グラフに加える水平の破線の始点と終点を指定
• jQuery の jqPlot の線グラフに加えた水平線を、ボタン操作で移動
• jQuery の jqPlot プラグインで作るX軸が時間軸である折れ線グラフ
• jQuery の jqPlot で作るカスタマイズした時間軸の折れ線グラフ
• jQuery の jqPlot で作る折れ線グラフの目盛りラベルの角度を調整
• jQuery の jqPlot プラグインで作る、折れ線と縦棒を併用したグラフ
• jQuery の jqPlot で作る折れ線グラフの折れ線をアニメーションで出現
• jQuery の jqPlot プラグインで作るベジェ曲線グラフ①
• jQuery の jqPlot プラグインで作るベジェ曲線グラフ②
• jQuery の jqPlot プラグインで作るトレンドライン付き折れ線グラフ
• jQuery の jqPlot で作る色を指定したトレンドライン付き折れ線グラフ
• jQuery の jqPlot で作る複数系列のトレンドライン付き折れ線グラフ
• jQuery の jqPlot で作る色指定トレンドライン付きの複数系列折れ線グラフ
• jQuery の jqPlot で作るトレンドラインのラベルを含む凡例付き折れ線グラフ
• jQuery の jqPlot で作る線の幅を指定したトレンドライン付き折れ線グラフ
• jQuery の jqPlot で作る、影なしトレンドライン付き折れ線グラフ
• jQuery の jqPlot で作る、ドラッグでポイントを移動できる折れ線グラフ
• jQuery の jqPlot で作るトレンドライン付きドラッグ移動可能折れ線グラフ
• jQuery の jqPlot で作る、ポイントをY軸方向だけ移動できる折れ線グラフ
• jQuery の jqPlot で作る折れ線グラフのドラッグ中のポイントの色を指定
• jQuery の jqPlot で作るツールチップ風ハイライト表示付き折れ線グラフ
• jQuery の jqPlot で作るフェード無効ハイライト表示付き折れ線グラフ
• jQuery の jqPlot で作るフェード速度を指定したハイライト付き折れ線グラフ
• jQuery の jqPlot で作る線グラフのハイライトのツールチップ表示位置を調整
• jQuery の jqPlot で作るXY値のツールチップ風ハイライト付き折れ線グラフ
• jQuery の jqPlot で作る折れ線グラフでハイライトした系列を前面に移動
• jQuery の jqPlot で作るマーカー非表示のハイライト付き折れ線グラフ
• jQuery の jqPlot で作る折れ線グラフのハイライトのサイズ調整
• jQuery の jqPlot で作る複数系列の折れ線グラフの凡例の行数を指定
• jQuery の jqPlot で作る折れ線グラフの系列の表示/非表示切替
• jQuery の jqPlot で作る折れ線グラフの系列をフェードイン/フェードアウト
• jQuery UI と jqPlot で作るサイズを変更できる折れ線グラフ
• jQuery の jqPlot プラグインで作るズーム機能付き折れ線グラフ
• jQuery の jqPlot プラグインで作るツールチップ機能付き折れ線グラフ
• jQuery の jqPlot プラグインで作るツールチップ機能付き折れ線グラフ 2
• jQuery の jqPlot プラグインで作るX軸だけズームできる折れ線グラフ
• jQuery の jqPlot プラグインで作るグラフの外までズームできる折れ線グラフ
• jQuery の jqPlot の折れ線グラフで、カーソル位置に垂直線と水平線を表示
• jQuery の jqPlot プラグインで作るグラフの外までズームできる折れ線グラフ 2
• jQuery の jqPlot の折れ線グラフで、コントロール用グラフで拡大範囲を指定

面グラフ

• jQuery の jqPlot プラグインで作る面グラフ
• jQuery の jqPlot プラグインで作る積み上げ面グラフ
• jQuery の jqPlot プラグインで作る負の値を含む面グラフ
• jQuery の jqPlot プラグインで作る負の値を含む積み上げ面グラフ
• jQuery の jqPlot プラグインで作る科目別得点推移の積み上げ面グラフ
• jQuery の jqPlot プラグインで作る半透明の面グラフ
• jQuery の jqPlot プラグインで作る折れ線付き面グラフ
• jQuery の jqPlot プラグインで作る特定の値と線の間を塗る面グラフ
• jQuery の jqPlot プラグインで作る滑らかな面グラフ
• jQuery の jqPlot プラグインで作る負の値を含む滑らかな面グラフ

散布図

• jQuery の jqPlot プラグインで作る散布図
• jQuery の jqPlot プラグインで作る負の値を含む散布図
• jQuery の jqPlot プラグインで作る凡例付きの複数系列の散布図
• jQuery の jqPlot で作る負の値を含む散布図に、斜めの直線を加える
• jQuery の jqPlot で作るツールチップ風ハイライト表示付き散布図

バブルチャート

• jQuery の jqPlot プラグインで作るバブルチャート
• jQuery の jqPlot プラグインで作るタイトル付きバブルチャート
• jQuery の jqPlot プラグインで作るバブルチャートのタイトルをカスタマイズ
• jQuery の jqPlot プラグインで作る影のないバブルチャート
• jQuery の jqPlot プラグインで作るグラデーションカラーのバブルチャート
• jQuery の jqPlot プラグインで作る半透明のバブルチャート
• jQuery の jqPlot プラグインで作る半透明グラデーションのバブルチャート
• jQuery の jqPlot のバブルチャートのバブルサイズを拡大縮小させない
• jQuery の jqPlot のバブルチャートのバブルサイズを乗数で調整
• jQuery の jqPlot のバブルチャートのバブル数に応じバブルサイズ調整
• jQuery の jqPlot のバブルチャートの系列のラベルを非表示にする
• jQuery の jqPlot のバブルチャートでマウスダウンイベント時ハイライト表示
• jQuery の jqPlot で作る系列ごとに同一色のバブルチャート
• jQuery UI と jqPlot で作るサイズを変更できるバブルチャート

ブロックチャート

• jQuery の jqPlot プラグインで作るブロックチャート
• jQuery の jqPlot で作るブロックチャートのXとYの最大値と最小値を指定
• jQuery の jqPlot プラグインで作る複数系列のブロックチャート
• jQuery の jqPlot プラグインで作る複数系列の凡例付きブロックチャート
• jQuery の jqPlot で作るブロックチャートの各ブロックの色を違える
• jQuery の jqPlot で作る複数系列ブロックチャートの各ブロック色を違える
• jQuery の jqPlot で作るブロックチャートのブロックのCSSを指定
• jQuery の jqPlot のブロックチャートのブロックラベル内半角スペースを改行
• jQuery UI と jqPlot で作るサイズを変更できるブロックチャート

縦棒グラフ

• jQuery の jqPlot プラグインで作るシンプルな縦棒グラフ
• jQuery の jqPlot プラグインで作る複数系列の縦棒グラフ
• jQuery の jqPlot で作る外側右の凡例付き複数系列の縦棒グラフ
• jQuery の jqPlot で作る内側上の横並び凡例付き縦棒グラフ
• jQuery の jqPlot プラグインで作る積み上げ縦棒グラフ
• jQuery の jqPlot プラグインで作る縦棒グラフの系列の色を変更
• jQuery の jqPlot で作る積み上げ縦棒グラフの系列の色を変更
• jQuery の jqPlot プラグインで作る科目別得点推移の縦棒グラフ
• jQuery の jqPlot で作る科目別得点推移の積み上げ縦棒グラフ
• jQuery の jqPlot プラグインで作るデータポイントラベル付き縦棒グラフ
• jQuery の jqPlot の縦棒グラフで、値が0のデータポイントラベルを非表示に
• jQuery の jqPlot の縦棒グラフでポイントラベルをグリッド境界の外に表示
• jQuery の jqPlot プラグインで作る負の値を含む縦棒グラフ
• jQuery の jqPlot で作る縦棒グラフの棒の幅や影などをカスタマイズ
• jQuery の jqPlot の縦棒グラフでマウスダウンイベント時ハイライト表示
• jQuery の jqPlot の縦棒グラフのハイライト表示色を指定
• jQuery の jqPlot の縦棒グラフのハイライト表示色を配列で指定
• jQuery の jqPlot の縦棒グラフの棒をいくつかのグループに分類
• jQuery の jqPlot の縦棒グラフにおいて、カテゴリごとに棒の色を変更
• jQuery の jqPlot の縦棒グラフにおいて、カテゴリごとに棒の色を指定
• jQuery の jqPlot の縦棒グラフにおいて、目盛りラベルの角度を調整
• jQuery の jqPlot プラグインで作る、折れ線と縦棒を併用したグラフ
• jQuery の jqPlot で作る縦棒グラフの縦棒をアニメーションで出現
• jQuery の jqPlot の縦棒グラフの縦棒とポイントラベルをアニメーションで出現
• jQuery の jqPlot プラグインで作るトレンドライン付き縦棒グラフ
• jQuery の jqPlot プラグインで作る色指定したトレンドライン付き縦棒グラフ
• jQuery の jqPlot で作る、ドラッグでY軸方向だけ伸縮できる縦棒グラフ
• jQuery の jqPlot で作るツールチップ風ハイライト表示付き縦棒グラフ
• jQuery の jqPlot で作る縦棒グラフの系列の表示/非表示切替
• jQuery の jqPlot で作る縦棒グラフの系列の表示/非表示切替を無効に
• jQuery の jqPlot で作る縦棒グラフの系列をフェードイン/フェードアウト
• jQuery UI と jqPlot で作るサイズを変更できる縦棒グラフ
• jQuery の jqPlot プラグインで作るY軸だけズームできる縦棒グラフ

横棒グラフ

• jQuery の jqPlot プラグインで作るシンプルな横棒グラフ
• jQuery の jqPlot プラグインで作る複数系列の横棒グラフ
• jQuery の jqPlot プラグインで作る積み上げ横棒グラフ
• jQuery の jqPlot プラグインで作る横棒グラフの系列の色を変更
• jQuery の jqPlot で作る積み上げ横棒グラフの系列の色を変更
• jQuery の jqPlot プラグインで作るデータポイントラベル付き横棒グラフ
• jQuery の jqPlot プラグインで作る負の値を含む横棒グラフ
• jQuery の jqPlot で作る横棒グラフの棒の幅や影などをカスタマイズ
• jQuery の jqPlot プラグインで作る水平グリッド線が非表示の横棒グラフ
• jQuery の jqPlot の横棒グラフでマウスダウンイベント時ハイライト表示
• jQuery の jqPlot の横棒グラフのハイライト表示色を指定
• jQuery の jqPlot の横棒グラフのハイライト表示色を配列で指定
• jQuery の jqPlot の横棒グラフの棒をいくつかのグループに分類
• jQuery の jqPlot の横棒グラフにおいて、カテゴリごとに棒の色を変更
• jQuery の jqPlot の横棒グラフにおいて、カテゴリごとに棒の色を指定
• jQuery の jqPlot の横棒グラフに垂直の実線を描き加える
• jQuery の jqPlot の横棒グラフに垂直の破線を描き加える
• jQuery の jqPlot で作る、ドラッグでX軸方向だけ伸縮できる横棒グラフ
• jQuery の jqPlot で作るツールチップ風ハイライト表示付き横棒グラフ

ウォーターフォールチャート

• jQuery の jqPlot プラグインで作るウォーターフォールチャート
• jQuery の jqPlot で作る合計が負の値のウォーターフォールチャート
• jQuery の jqPlot のウォーターフォールチャートでカテゴリごとに棒の色を変更
• jQuery の jqPlot のウォーターフォールチャートでカテゴリごとに棒の色を指定
• jQuery の jqPlot のウォーターフォールチャートで垂直グリッド線を非表示に
• jQuery の jqPlot で作るポイントラベル付きウォーターフォールチャート
• jQuery の jqPlot で作る右のY軸を使うウォーターフォールチャート

マリメッコチャート

• jQuery の jqPlot プラグインで作るマリメッコチャート
• jQuery の jqPlot プラグインで作る、色を指定したマリメッコチャート
• jQuery の jqPlot のマリメッコチャートのバーのラベルの角度を調整

円グラフ

• jQuery の jqPlot プラグインで作る円グラフ
• jQuery の jqPlot プラグインで作るデータラベル付き円グラフ
• jQuery の jqPlot の円グラフにおいて、ラベルをデータラベルとして表示
• jQuery の jqPlot の円グラフにおいて、値をデータラベルとして表示
• jQuery の jqPlot の円グラフで、パーセンテージをデータラベルとして表示
• jQuery の jqPlot プラグインで作る凡例付き円グラフ
• jQuery の jqPlot プラグインで作る2列の凡例付き円グラフ
• jQuery の jqPlot プラグインで作るスライスを塗りつぶさない円グラフ
• jQuery の jqPlot プラグインで作る、スライス間に余白がある円グラフ
• jQuery の jqPlot で作る、塗りつぶさないスライス間に余白がある円グラフ
• jQuery の jqPlot の円グラフの1つ目のスライスを描き始める場所を指定
• jQuery UI と jqPlot で作るサイズを変更できる円グラフ

ドーナツグラフ

• jQuery の jqPlot プラグインで作るドーナツグラフ
• jQuery の jqPlot プラグインで作る２重ドーナツグラフ
• jQuery の jqPlot で作るスライス間に余白があるドーナツグラフ
• jQuery の jqPlot プラグインで作るデータラベル付きドーナツグラフ
• jQuery の jqPlot のドーナツグラフにおいて、ラベルをデータラベルとして表示
• jQuery の jqPlot のドーナツグラフにおいて、値をデータラベルとして表示
• jQuery の jqPlot のドーナツグラフでパーセンテージをデータラベルとして表示
• jQuery の jqPlot のドーナツグラフで、配列の内容をデータラベルとして表示
• jQuery の jqPlot のドーナツグラフの1つ目のスライスを描き始める場所を指定
• jQuery の jqPlot プラグインで作るスライスを塗りつぶさないドーナツグラフ
• jQuery の jqPlot プラグインで作る凡例付きドーナツグラフ
• jQuery の jqPlot プラグインで作る2列の凡例付きドーナツグラフ

メーターゲージ

• jQuery の jqPlot プラグインで作るメーターゲージ
• jQuery の jqPlot で作る、最小値と最大値を指定したメーターゲージ
• jQuery の jqPlot プラグインで作るゲージラベル付きメーターゲージ
• jQuery の jqPlot で作るメーターゲージの下にゲージラベルを表示
• jQuery の jqPlot で作るメーターゲージのゲージラベルの位置を調整
• jQuery の jqPlot プラグインで作るメーターゲージの目盛りラベルを非表示に
• jQuery の jqPlot プラグインで作るメーターゲージの目盛りラベルを指定
• jQuery の jqPlot プラグインで作る色分けメーターゲージ
• jQuery の jqPlot で作る色分けメーターゲージの色分けサイズ指定
• jQuery の jqPlot プラグインで作る色分けメーターゲージの色を指定

トレンドライン

• jQuery の jqPlot プラグインで作るトレンドライン付き折れ線グラフ
• jQuery の jqPlot で作る色を指定したトレンドライン付き折れ線グラフ
• jQuery の jqPlot で作る複数系列のトレンドライン付き折れ線グラフ
• jQuery の jqPlot で作る色指定トレンドライン付きの複数系列折れ線グラフ
• jQuery の jqPlot で作るトレンドラインのラベルを含む凡例付き折れ線グラフ
• jQuery の jqPlot で作る線の幅を指定したトレンドライン付き折れ線グラフ
• jQuery の jqPlot で作る、影なしトレンドライン付き折れ線グラフ
• jQuery の jqPlot プラグインで作るトレンドライン付き縦棒グラフ
• jQuery の jqPlot プラグインで作る色指定したトレンドライン付き縦棒グラフ

いかり足

• jQuery の jqPlot プラグインで作るいかり足のチャート
• jQuery の jqPlot プラグインで作るY2軸を使ういかり足のチャート
• jQuery の jqPlot で作るツールチップ風ハイライト付きのいかり足のチャート
• jQuery の jqPlot で作るいかり足の始値と終値の線の長さを指定
• jQuery の jqPlot で作るいかり足の始値と終値の線の色を指定
• jQuery の jqPlot で作るいかり足の高値と安値を結ぶ線の色を指定
• jQuery の jqPlot プラグインで作る始値なしのいかり足のチャート
• jQuery の jqPlot プラグインで作るいかり足の線の幅を指定

ローソク足

• jQuery の jqPlot プラグインで作るローソク足（ローソクチャート）
• jQuery の jqPlot プラグインで作るY2軸を使うローソク足（ローソクチャート）
• jQuery の jqPlot で作るツールチップ風ハイライト付きのローソク足のチャート
• jQuery の jqPlot プラグインで作るローソク足の幅を指定
• jQuery の jqPlot で作るローソク足の高値と安値を結ぶ線の色を指定
• jQuery の jqPlot プラグインで作るローソク足の陽線と陰線の色を指定

ピラミッドグラフ

• jQuery の jqPlot プラグインで作るピラミッドグラフ
• jQuery の jqPlot プラグインで作るピラミッドグラフの系列の色を指定
• jQuery の jqPlot プラグインで作るセンターY軸目盛りのピラミッドグラフ
• jQuery の jqPlot プラグインで作るピラミッドグラフの背景色を指定
• jQuery の jqPlot のピラミッドグラフのY軸の2目盛りごとにグリッド色分け
• jQuery の jqPlot プラグインで作る比較ライン付きピラミッドグラフ
• jQuery UI と jqPlot で作るサイズを変更できるピラミッドグラフ