Bluff:Beautiful graphs in JavaScript

2013-12-08 :  PCクリニック
本文の前に、
-・・・ -・-
現時点での、blogramのランクインカテゴリは、
3、2、2、0、0、 1、0、0、1、0(38)で、換算ポイント 60pt 。
「化学業界」2つアップして、2位に。
「C言語」浮上せず、3位のまま。
・-・ - -・

さて、本文。

また、HTML5 の canvas 要素。


「Web活メモ帳」なるブログの記事:
javascriptでグラフを描画できるライブラリ「Bluff」
  Bluffは画像を一切使用せずにHTMLでグラフを作成する事ができるライブラリ
が目に入った。

調べてみた。
Bluff: Beautiful graphs in JavaScript
  Bluff is a JavaScript port of the Gruff graphing library for Ruby.
  It is designed to support all the features of Gruff
   with minimal dependencies;
  the only third-party scripts you need to run it are
   a copy of JS.Class (2.6kB gzipped) and
   a copy of Google's ExCanvas to support canvas in Internet Explorer.
  Both these scripts are supplied with the Bluff download.
  Bluff itself is around 11kB gzipped.

  To draw a graph,
  you create a new Bluff graph object using the id of a canvas element
   on the page, set some options, add the data and labels,
   then tell the graph to draw.
  A basic example:
  ・・・・・
ですね。

例によって、・・・
  ブラフは、Rubyのライブラリをグラフどんのjavaスクリプトの設定ポートです。
   最小限の依存関係;
  と無愛想なのすべての機能をサポートするために設計されています
   それを実行する必要がある唯一のサードパーティ製のスクリプトは、
   JS のコピーです。Internet Explorer でキャンバスのクラス
   (2.6 キロバイト gzip 圧縮された) とサポートするために
   Google の ExCanvas のコピー。
  両方のこれらのスクリプトは、はったりダウンロードと共に提供されます。
  ブラフ自体は約 11 キロバイト gzip 圧縮されました。

  グラフを描画するには、
  キャンバス要素の id ページを使用して、新しいはったりグラフ オブジェクトを
   作成するいくつかのオプションを設定、
   追加するデータとラベルを描画するグラフを伝えるし。
  基本的な例:
  ・・・・・


取り敢えず、右上のリンク「Download v0.3.6.2」をクリックした。
  "http://bluff.jcoglan.com/assets/Bluff.0-3-6-2.zip"
ですか?・・・ダウンロードした。(48.4KB)

書庫内は、「Bluff 0.3.6.2」フォルダ1つ。
その中には、「.js」が4つに、「.txt」が2つ。

そこで、
「bluff-min.js」「js-class.js」
の2つのみ頂いた。
(「excanvas.js」は使わない!)


-・・・ -・-
試行錯誤の結果、「bluff-min.js」は、間違いでした。
正しくは、「bluff-src.js」なんですね???
・-・ - -・


「bluff-src.js」「js-class.js」
の2つで、
Bluff ホーム・ページ」の
サンプル・コードで、「.html」ファイルを作った。

もう一つミスがあった。

 <script type="text/javascript" src="./bluff-src.js"></script>
 <script type="text/javascript" src="./js-class.js"></script>
の順に記述したのではダメ。

 <script type="text/javascript" src="./js-class.js"></script>
 <script type="text/javascript" src="./bluff-src.js"></script>
の順番が大事!!!


そして、2つのグラフ( canvas )も出来る。


なお、2つの「.js」のサイズは?
「js-class.js」 7.36KB
「bluff-src.js」98.7KB
と、やや大きい。


それよりも何よりも、・・・
座標値の指定の仕方は?・・・

Y の値1つのみ指定している。
(x,y) 形式での指定は???

出来ないみたい???


<紙>的には、
残念ながら、見送りですね。


お粗末でした。


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


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

コメントの投稿

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

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



おきてがみ

最新記事
カレンダー
05 | 2017/06 | 07
- - - - 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 -
月別アーカイブ
カテゴリ
最新コメント
検索フォーム
リンク
プロフィール

<紙>

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

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


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

Google Analytics
ブックマーク