jqplot.meterGaugeRenderer.js

jQueryのjqPlotプラグインの「plugins」フォルダに入っている「jqplot.meterGaugeRenderer.js」もしくは「jqplot.meterGaugeRenderer.min.js」は、メーターゲージを生成する際に読み込む必要があるjavascriptファイルだ。

「jqplot.meterGaugeRenderer.min.js」は、「jqplot.meterGaugeRenderer.js」の圧縮版で、機能に違いはない。

導入

「jqplot.meterGaugeRenderer.js」もしくは「jqplot.meterGaugeRenderer.min.js」は、jqPlotの「plugins」フォルダに入っている。

読み込み

パスは、アップロードした場所を指定する。

もちろん、「jquery-1.7.1.min.js」や「jquery.jqplot.min.js」なども読み込む必要がある。

実装例（サンプル）

実装例（サンプル）について

実装例（サンプル）のソースコードについては、こちら。

オプション

meterGaugeRendererに関する主要なオプション。

seriesDefaults

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

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

系列の生成編集オプション。

min

ゲージの目盛りの最小値。

max

ゲージの目盛りの最大値。

label

「km/h」「MB/s」「kph」「Volts」などの、ゲージラベルを指定。

labelPosition

ゲージラベルの位置。「inside」か「bottom」のどちらか。初期設定値は「inside」。

• inside：ゲージの内側
• bottom：ゲージの下側。

labelHeightAdjust

ゲージラベルの表示位置の高さを調整。プラス値は、表示位置を下へ、マイナス値は、表示位置を上へ調整する。初期設定値は「0」。

showTickLabels

ゲージの目盛りラベルを表示するか。「true」は表示。「false」は非表示。

ticks

表示する目盛りラベルを指定。

[ １つ目の目盛りラベル, ２つ目の目盛りラベル, ３つ目の目盛りラベル, ... ]のように配列で指定。

intervals

ゲージに表示する目安用の色分け範囲。

[ １つ目の範囲の最大値, ２つ目の範囲の最大値, ３つ目の範囲の最大値, ... ]のように配列で指定。

intervalColors

ゲージに表示する目安用の色分けの色。

[ １つ目の範囲の色, ２つ目の範囲の色, ３つ目の範囲の色, ... ]のように配列で指定。

intervalOuterRadius

ゲージに表示する目安用の色分けの半径をピクセル単位で指定。

実装例（サンプル）一覧

「jqplot.meterGaugeRenderer.js」もしくは「jqplot.meterGaugeRenderer.min.js」の実装例（サンプル）一覧。

• 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プラグインで作るメーターゲージにおいて、目安用の色分けを表示し、色を指定する方法。