jqPlotで簡単でリッチなグラフを作成 - Taste of Tech Topics
こんにちは、fujiiです。 今回は、jqPlotというJavaScriptのライブラリを紹介したいと思います。 jqPlotとは? jqPlotとは、JavaScript上で線グラフや円グラフ、棒グラフといった 様々なグラフをcanvasを利用して描くためのライブラリです。 系列の表示の有無や色の変更といった基本的な操作から、 ズームやハイライトといったオプションも提供しているため、 リッチなUIでグラフを表現できることができます。 IE7、IE8、Firefox、Safari、Operaと幅広いブラウザをサポートしているので、 利用環境の制約も少ないです。 準備 まずは、jqPlotのページに行き、ダウンロードしてみましょう。 ヘッダ部のdownloadリンクを選択すると、 sample_jqplot1.zip ダウンロードページに移動します。 ダウンロードしたいバージョンのファイルを
jQuery の jqPlot プラグインで作るローソク足（ローソクチャート）
<script language="javascript" type="text/javascript" src="jquery-1.7.1.min.js"></script> <!--[if lt IE 9]> <script language="javascript" type="text/javascript" src="excanvas.min.js"></script> <![endif]--> <script language="javascript" type="text/javascript" src="jquery.jqplot.min.js"></script> <script language="javascript" type="text/javascript" src="plugins/jqplot.dateAxisRenderer.min.js"></scrip
jQuery の jqPlot プラグインで作るローソク足の陽線と陰線の色を指定
jQueryのjqPlotプラグインで作るローソク足（ローソクチャート）において、始値よりも終値が高い陽線のときの色と、始値よりも終値が安い陰線のときの色を、それぞれ指定する方法。 実装例（サンプル） <script language="javascript" type="text/javascript" src="jquery-1.7.1.min.js"></script> <!--[if lt IE 9]> <script language="javascript" type="text/javascript" src="excanvas.min.js"></script> <![endif]--> <script language="javascript" type="text/javascript" src="jquery.jqplot.min.js"></script> <scr
jQueryで見栄えのいいグラフが描ける「jqPlot」 (1/3)
証券会社のサイトの株式相場グラフ、ショッピングサイトの価格変動グラフなど、Webサイト上に変動するデータをもとに、動的にグラフを表示したいことがあります。従来は、Flashを使うことが多かったですが、最近はAjax/JavaScript人気もあって、「JavaScriptでグラフも作成したい」というニーズも強くなっています。 以前、本誌では、HTML5のCanvasを使った図形のサンプルとして、グラフの描画方法を紹介しましたが（関連記事）、今回はグラフ描画に特化した専用ライブラリ「jqPlot」を使って、もっと簡単に見栄えのいいグラフを作成する手順を紹介します。 グラフに特化したjQueryプラグイン「jqPlot」 「jqPlot」はクリス・レオネロ氏が開発しているJavaScriptライブラリで、jQueryのプラグインとして動作します。HTML5のCanvasを応用してグラフを描く仕
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
