Chartsをダウンロード後、解凍し、好きな場所に置くだけです。Chartsと言う)を使用してフラッシュグラフ(SWF)の作成方法を紹介します。Chartsは、www.maani.usが著作権を持っています。Graph(フラッシュグラフ)を作成するためのWebページ(スクリプト言語)は、HTML、Perl、PHP、ASPやCFML等が可能です。Graph(フラッシュグラフ)が簡単、容易に作成することができます。Chartsで対応しているグラフの種類は、下表のとおりです。表内のグラフ名をクリックすると、サンプルグラフ(日本語対応)とXMLコードを表示します。コードをコピーする場合は、UTF-8で保存してください。各グラフのサンプルは、www.maani.usサイトのギャラリーページを合わせて参照ください。Chartsは、単にグラフを表示するだけでなく、刻々変化するデータに追従、対応したライブアップデート機能を有しています。Chartsでは、グラフのことをチャート(chart)と呼んでいますが、ここではグラフと呼ぶことにします。Perl5.6.1をベースに書いています。1.アプリケージョンの構成グラフ作成アプリケージョンの構成は、以下のとおりです。Serif」(Windows標準)を使用します。日本語を表示するためには、Arial以外を使用します(fontキー)。Chartsのデフォルトは「Arial」です。(2)グラフは、フラッシュSWF形式です。(3)グラフを作成表示するためのWebページ(スクリプト言語)は、HTMLのみ,Perl,PHP,ASP,CFML等を使用できます。(4)グラフ定義データは、XMLファイルを使用し、使用コードはUTF-8です。UTF-8は、Windowsのメモ帳で扱えます。下図の*2)および1XMLファイル(下図の*3)が、最小構成です。←日本語変換ルーチンJcode.pmの一部。私用ライブラリーとして使用します。Jcode.pmは、PerlでXMLを動的に生成する場合必要になります。#Windowsの場合、絶対パス)(注2)縦棒グラフサンプル。sample1_bar.xmlと対。(注3)折れ線グラフサンプル。sample-xml1.cgiと対。FLASHコントロールアクティブ化対応版。Playerは、6以上が必要です。*2:Jcode.pm(日本語変換ライブラリーは、インストールまたは私用ライブラリーで使用します。Jcode.pmの入手方法やインストール方法は、ここを参照。Jcode.pmは、PerlでXMLを動的に生成する場合必要になります。Serifは、日本語フォントです。P明朝"および"魚石行書"等も使用できます。Chartsのダウンロードは、ここ(英語サイト)より行います。Windowsの場合、zip形式ファイルをダウンロードします。ダウンロード後、解凍し任意の場所に配置します。これでインストールは終わりです。License(大口ライセンス)があります。License(フリー)とは、以下のとおりです。Chartsウェブサイトへリンクします。Chartsのフラッシュファイルを表示することはできません。・テクニカルサポートと電子メールによる製品アップデートはできません。Chartを用いたグラフの作成方法について説明します。ここのサンプルのWebページは、HTMLのみで作成しています。実際のグラフデータは、データベース等から読み込み、編集が必要になります。この場合はCGIで作成ことが現実的でしょう。ChartsのXML記述仕様(英語))を参照ください。90上表のグラフデータから、最も簡単なグラフ定義データXML(表4.1-2参照)で、表示したグラフです。凡例ラベル(日本語)が出ていないには、FONTのデフォルトが"Arial"のためなのです。→「Webページの作成」です。Chartsでは、いわゆるグラフをチャート(Chart)と呼んでいます。ここでは、グラフに統一しています。・カンバス上で、グラフ矩形(グラフ自身)の位置(矩形の左上端)を表すとき、カンバスの左上端のところが基準点x,y=(0,0)です。自分で描くときも、その位置はカンバスの左上の基準点からの相対ピクセル値で指定します。・4つの赤色のデータ(東京)のグループ(セット)をシリーズ(series)という。上のグラフは3シリーズです。・カンバス(キャンバス)の大きさとその背景は、Webページの<object>タグで指定します。その他のグラフを描く部分はXMLで作成します。グラフデータについて、表4.1-1のように、同じ項目名のデータ(Y軸データ)を1行に書き出します。データは、表示したいX軸ラベル名(水平軸ラベル名とかカテゴリー軸名と言う。)の順に1行に並べます。何もないところは、空白とします。テールを完成させます。過去4年の売上げデータは、3データ(Y軸データ)の例です。Chaertsの記述仕様に基づき、テキストエディターで、グラフ定義データXMLファイルを作成します。グラフ定義データXMLファイルはCGIで動的に作成することも可能です。XMLファイルの文字コードは、UTF-8です。テキストエディターはメモ帳が使用できます。グラフ定義データは、最低限、グラフのデータとX軸ラベル名の定義が必要です(表4.1-2参照)。グラフは、この表4.1-2の必要最低限のグラフ定義データXMLでも表示できます。Chaertsの記述仕様に基づきグラフ定義データXMLに追加定義します。XML構文は、次のとおりです。・XMLソースは、タグの根の要素です。・XMLタグは大文字と小文字の区別ができます。・XML要素は、完全な入れ子なければなりません。・特性値は、引用句で括られていなければません(シングルクォートまたはダブルクォート)。グラフを描くためのXMLタグは、次のとおりです。ChartsのXML記述仕様(英語))を参照または、下のタグ名をクリックしてください。<--chartタグで全体を挟みます。<--chart_dataタグは、グラフのデータを定義します。<!--rowタグは、カテゴリータイトル、凡例タイトルおよびデータ値の定義の開始です。<!--nul/タグは、NULLを定義します。カテゴリー軸名を順に並べて定義を意味します。<!--stringタグは、タイトルを定義します。カテゴリー軸名を定義します。<!--stringタグは、タイトルを定義します。カテゴリー軸名を定義します。<!--stringタグは、タイトルを定義します。カテゴリー軸名を定義します。<!--stringタグは、タイトルを定義します。カテゴリー軸名を定義します。<!--/rowタグは、カテゴリータイトル、凡例タイトルおよびデータ値の定義の終了です。<!--rowタグは、カテゴリータイトル、凡例タイトルおよびデータ値の定義の開始です。<!--stringタグは、タイトルを定義します。はじめに、凡例タイトルを定義します。<!--numberタグは、グラフデータの値を順に定義します。<!--numberタグは、グラフデータの値を順に定義します。<!--numberタグは、グラフデータの値を順に定義します。<!--numberタグは、グラフデータの値を順に定義します。<!--/rowタグは、カテゴリータイトル、凡例タイトルおよびデータ値の定義の終了です。