use: jqchart:line,labelX:'useChart'
use: jqchart:line,labelX:['a','b','c','d','e','f','g','h','1','j','k','l']
use: jqchart:bar,labelYunit:'(単位 m)'



update 2008.3.17 csv2table-0.02-b-1.6

<!--[if IE]>
<script src="./lib/excanvas/excanvas-compressed.js" type="text/javascript" ></script>
<![endif]-->
<script src="./lib/jquery-1.2.3.min.js" type="text/javascript"></script>
<script src="./jquery..js" type="text/javascript" charset="utf-8"></script>
<script src="./lib/jquery..js" type="text/javascript" charset="utf-8"></script>

<script type="text/javascript">
jQuery(function($){
    $(".btn1").attr("disabled","");
});
</script>

<script>
  $.extend($.csv2table,{
    loadImg  : 'http://jsgt.org/lib/jquery/plugin/csv2table/v002/img/icon-loadinfo.gif',
    sortDImg : 'http://jsgt.org/lib/jquery/plugin/csv2table/v002/img/icon-d.gif',
    sortAImg : 'http://jsgt.org/lib/jquery/plugin/csv2table/v002/img/icon-a.gif'
  })
</script>
<style>
/* ラベル Y軸 */
.jQchart-labelY-canvasMyID{
	font-size : 12px;
}

/* label Data */
.jQchart-labelData-canvasMyID{
	font-size : 10px;
}

.jQchart-labelYunit{
	width : 100px;
}
</style>


1.単位の表示

labelYunit:'単位(kw)' と書くと表示されます。

たとえば、こんなふうに、、、。

"$('#view40').csv2table('./data/Book4chart.csv',{
         use      : 'jqchart:bar#canvasMyID',
         title    : 'This HTML is setting.config.title',
         labelYunit : '(単位 m)',
         scaleY   : {min: 0,max:100,gap:10}
       });

2.x軸下側にlabelXを表示

CSVの1行目を使う場合は、

labelX:'useChart' 

と書くと、自動的に抽出されます。

$('#view40').csv2table('./data/Book4chart.csv',{
         use      : 'jqchart:line#canvasMyID',
         title    : 'This HTML is setting.config.title',
         labelX   : 'useChart',
         scaleY   : {min: 0,max:100,gap:10}
       });

それとは別に自分で命名したい時は、

labelX:['label1','label2','label3','labeln',...]のように書きます。

$('#view40').csv2table('./data/Book4chart.csv',{
         use      : 'jqchart:line#canvasMyID',
         title    : 'This HTML is setting.config.title',
         labelX   : ['a','b','c','d','e','f','g','h','1','j','k','l'],
         scaleY   : {min: 0,max:100,gap:10}
       });
labelX関係
  • labelXは、省略時した場合(デフォルト)そのボックスごと表示されません。
  • use:'jqchart:...'でchart使用時には、labelX:'useChart' でcsv2tableの1行目がlabelXとして表示されます。
  • labelX:['label1','label2','label3','labeln',...]でlabelX表示をカスタマイズできます。
  • labelXのCSSは、.jQchart-labelYunit { width : 100px; } などでページ内すべてのグラフを一括指定(グローバル)できます。
  • labelXのCSSは、.jQchart-labelYunit-キャンバスID名 { width : 100px; } などで該当するグラフだけを指定(ローカル)できます。
    labelX関係 将来
  • 将来、use:'jqchart:...'のオプションは、labelXではなくjqchart.labelXで指定するようにしたいと思っています。

    FYI: The simple outputting method of the version.




    <script>document.write($.jQchart.ver)</script><br>
    <script>document.write($.csv2table.ver)</script><br>
    <script>document.write($.jQchart.version)</script><br>
    <script>document.write($.csv2table.version)</script><br>
    |++かも日記 | jQuery › Downloads › Plugins › jQchart | nightly.htm |
    | jQuery › Downloads › Plugins › csv2table (v002 test)