jqplot.blockRenderer.js

jQueryのjqPlotプラグインの「plugins」フォルダに入っている「jqplot.blockRenderer.js」もしくは「jqplot.blockRenderer.min.js」は、ブロックチャートを生成する際に読み込む必要があるjavascriptファイルだ。

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

導入

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

読み込み

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

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

実装例（サンプル）

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

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

オプション

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

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

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

css

ブロックのCSS（スタイルシート）を指定することができる。

初期設定値は{padding:'2px', border:'1px solid #999', textAlign:'center'}。

escapeHtml

ブロックラベル内のHTMLをエスケープするか。「true」を指定するとHTMLエスケープする。「false」を指定するとHTMLエスケープしない。初期設定値は「false」。

insertBreaks

ブロックラベル内の半角スペースを、<br />に変更。

varyBlockColors

seriesColorsの配列に従って、各ブロックの色を違えるか。「true」を指定すると、seriesColorsの配列に従って、各ブロックの色を変える。「false」を指定すると、系列ごとに同一色でブロックを塗る。初期設定値は「false」。

実装例（サンプル）一覧

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

• jQuery の jqPlot プラグインで作るブロックチャート

  jQueryのjqPlotプラグインで、ブロックチャートを作る方法。

• jQuery の jqPlot で作るブロックチャートのXとYの最大値と最小値を指定

  jQueryのjqPlotプラグインで作るブロックチャートにおいて、X軸とY軸の、最大値と最小値を指定する方法。

• jQuery の jqPlot プラグインで作る複数系列のブロックチャート

  jQueryのjqPlotプラグインで、複数系列のブロックチャートを作る方法。

• jQuery の jqPlot プラグインで作る複数系列の凡例付きブロックチャート

  jQueryのjqPlotプラグインで、複数系列の凡例付きブロックチャートを作る方法。

• jQuery の jqPlot で作るブロックチャートの各ブロックの色を違える

  jQueryのjqPlotプラグインで作るブロックチャートにおいて、seriesColorsの配列に従って、各ブロックの色を変える方法。

• jQuery の jqPlot で作る複数系列ブロックチャートの各ブロック色を違える

  jQueryのjqPlotプラグインで作る複数系列の凡例付きブロックチャートにおいて、seriesColorsの配列に従って、各系列の各ブロックの色を変える方法。

• jQuery の jqPlot で作るブロックチャートのブロックのCSSを指定

  jQueryのjqPlotプラグインで作るブロックチャートにおいて、ブロックのCSS（スタイルシート）を指定する方法。

• jQuery の jqPlot のブロックチャートのブロックラベル内半角スペースを改行

  jQueryのjqPlotプラグインで作るブロックチャートにおいて、ブロックラベル内の半角スペースを、に変更する方法。

• jQuery UI と jqPlot で作るサイズを変更できるブロックチャート

  jQueryのjqPlotプラグインで作るブロックチャートにおいて、jQuery UIのResizableを併用し、ドラッグ＆ドロップで、サイズを変更できるようにする方法。