Flotr2 : HTML5 charts & graphs library

2013-11-27 :  PCクリニック
本文の前に、
-・・・ -・-
現時点での、blogramのランクインカテゴリは、
3、2、2、0、1、 0、0、1、0、0(38)で、換算ポイント 63pt 。
昨日「C言語」がダウンしたが今朝方戻った。
・-・ - -・

さて、本文。

一昨日(2013-11-25)の記事:
RGraph : HTML5 charts library
では、

  ・・・・・
  多少中身を読み比べて、
  「RGraph: HTML5 charts library
  が良さそうな気がした。
  ・・・・・

と云うことで、
早速導入し、学習していた。
が、しかし、・・・

  ・・・・・
  グラフ作成用データ点の指定が、・・・
  1次元配列?・・・
  つまり、X座標値は一定間隔で、Y座標値のみの指定???
  これだと、欲しいものでは無いのだが???
  ・・・・・・

もっと突っ込んで見てみたが、
どうも、ダメそう???


諦めて(?)、
前回記事の最初に挙げた5つの内の、他の4つを調べてみた。

Chart.js」(「HTML5 Charts for your website.」サイト内)
Javascript ライブラリー」(「HTML5.JP」サイト内)
CanvasJS:Beautiful HTML5 & JS Charts
は、どれもダメ???


・・・ Flotr2 を試してみた」(「株式会社LIG」サイト内)
にある例でもそうですが、
リンク先=本家:
http://humblesoftware.com/flotr2/
では、
データ点の指定が、[x,y]形式の2次元に成っている。


そうすると、最初に挙げた5つの内からは、
「Flotr2」に決まりかな?


documentation」のページには、

  Flotr2 is a library for drawing HTML5 charts and graphs.
  It is a branch of flotr which removes the Prototype dependency
   and includes many improvements.

つまり、「flotr」から派生したモノで、
「Prototype」依存から脱却し、多くの機能強化を図った。

特徴としては、
  ・ mobile support
  ・ framework independent
  ・ extensible plugin framework
  ・ custom chart types
  ・ FF, Chrome, IE6+, Android, iOS
そして描けるグラフは、、
  ・ lines
  ・ bars
  ・ candles
  ・ pies
  ・ bubbles

使い方は、
  To use Flotr2, include the flotr2.min.js script in your page and
  create a visible <div> with positive width and height.
  A graph is drawn with the Flotr.draw(container, data, options) method.

つまり、
 「flotr2.min.js」を取り込み。
 サイズを指定した<div>を定義し、
 「Flotr.draw(container, data, options)」メッソッドを
 用いて描画する。
と云うこと。

その下に、例が載っている。

この例は、
「LIGブログ」の例とは、(<紙>にとっては)異なるが。


さて、
肝心の「flotr2.min.js」の入手方法は???

この、GitHub」ですか。


それで、ダウンロードし、
しかるべき(テスト用)ディレクトリに格納。

そこで、
「LIGブログ」の「デモ」にある、
「折れ線グラフ」の「デモページはこちら」をクリックし、
そのページを「名前を付けて保存」。

これは、ローカルで表示できた。

でも、中身は「flotr2.min.js」じゃなく「flotr2.js」に成っている!!!


それから、
「GitHub」から、「flotr2.min.js」をダウンロードして、
自分なりに、HTMLコードを書いてみた。

「JavaScript」はおろか「HTML」もまともじゃないのに。

何とか、曲がりなりにも表示された。
 「Firefox」や「SeaMonkey」では。
 「IE」はダメ。
・・・・・

なお、
「Flotr2」では、
「flotr2.min.js」(96.7KB)1つで、OK。

前回の「RGraph」では、
「RGraph.common.core.js」(124KB)、
「RGraph.line.js」(121KB)
の2つが必要。


では、
「Flotr2」をしっかり学習するかナ?


お粗末でした。


見ていただいた序でとは厚かましい限りですが、
お帰りに投票して頂けるとなお嬉しいです。 ⇒ blogram投票ボタン


131122
関連記事
スポンサーサイト

コメントの投稿

管理者にだけ表示を許可する

おきてがみ/blogram
blogram投票ボタン



おきてがみ

最新記事
カレンダー
09 | 2017/10 | 11
1 2 3 4 5 6 7
8 9 10 11 12 13 14
15 16 17 18 19 20 21
22 23 24 25 26 27 28
29 30 31 - - - -
月別アーカイブ
カテゴリ
最新コメント
検索フォーム
リンク
プロフィール

<紙>

Author:<紙>
ようこそ。
「パソコンヲタクの雑記帳」
もろもろなことを綴っています。
パソコン ヲタクってねくら?
画像は kami でなく kani です。

カウンター(fc2、i2i) /Google Analytics


i2i(from 2010-08-24)
Total =
Today  =  
Yesterday=
アンチエイジング

Google Analytics
ブックマーク