EspressChartで使用するグラフのY軸の最大値や最小値と間隔については、デフォルトでは「自動設定」となっており、実データに合わせて適切に設定されます。

以下が自動設定時のサンプルグラフです。チャートデザイナ上ではデフォルトで「自動設定」となっているため、上記ではY軸の最大値90、最小値0、間隔30となっています。

意図的に手動で設定したい場合には、「手動設定」にすることで任意の最大値・最小値・間隔の設定が可能です。
以下が手動設定時のサンプルグラフです。チャートデザイナ上で「手動設定」にし、Y軸の最大値120、最小値0、間隔30としたものです。

JavaAPIで手動設定を行う場合は下記のように記述します。

// 手動設定（自動設定をOFF）
QbChart#gethYAxis().setScaleAutomatic(false);
// 最大値設定
QbChart#gethYAxis().setMaxScale(120);
// 最小値設定
QbChart#gethYAxis().setMinScale(0);
// 間隔設定
QbChart#gethYAxis().setScaleStep(30);

●手動設定の際の注意点

JavaAPIで手動設定の際には1点注意です。実データ（CSVやDBなどの実際の値）がY軸の最大値や最小値を超えないようにするる必要があります。もし超えてしまった場合にはEspressChartはエラーを返します。
例えば、上でも使用しているグラフで手動設定で最大値を80にしてみます。すると実データがY軸の最大値を超過しますので、以下のようなエラーが返ってきてしまいます。「最大値は85以上で設定してください」というものです。

java.lang.IllegalArgumentException: Max must be >= 85.0
at quadbase.chart.Chart.setAxisMaxScale(Chart.java:4916)
at quadbase.ChartAPI.QbChartBasic$CAxis.setMaxScale(QbChartBasic.java:1179)

このエラーを回避する方法として、「Patch6.jar」というパッチファイルが用意されています。このファイルをサーバにデプロイすることで、Y軸の最大値や最小値を超えてもエラーを出さずにグラフを表示させることは可能です。以下がサンプルです。Y軸の最大値80を超えていますがエラーは出ずにグラフが表示されています。

ただ、この方法は非推奨となっており、可能な限りはY軸の最大値最小値を超えないように設定していただくことを推奨しております。
手動設定の際は、最大値・最小値の設定にご注意ください。

EspressChartで画像に出力する際、画像形式がJPEGやPNGの場合には圧縮率を設定することが可能です。ファイルサイズを小さくすることを優先するか、画質の良さを優先するか、ユーザ様の要件に合わせて調整することができます。PNGの場合はデフォルト・最大圧縮・圧縮なしの3パターンから選択可能、JPEGの場合は圧縮率を0～100%で指定可能です。

■チャートデザイナでJPEG出力時に表示される圧縮率設定画面

// APIでは以下のように記述することで対応可能です。最後の引数が画質の度合いで、100が最高画質、0が最低画質です。
QbChart#export(QbChart.JPEG, “[出力先]”, 0, 0, 0);
QbChart#export(QbChart.JPEG, “[出力先]”, 0, 0, 50);
QbChart#export(QbChart.JPEG, “[出力先]”, 0, 0, 100);

■チャートデザイナでPNG出力時に表示される圧縮設定画面

// APIでは以下のように記述することで対応可能です。
chart.export(QbChart.PNG, “[出力先]”, 0, 0, QbChart.PNG_COMPRESSION_DEFAULT);
chart.export(QbChart.PNG, “[出力先]”, 0, 0, QbChart.PNG_COMPRESSION_MAX);
chart.export(QbChart.PNG, “[出力先]”, 0, 0, QbChart.PNG_COMPRESSION_NONE);

では実際に圧縮率を変えた時にどの程度表示に違いが出るのか、複数ケースで検証してみました。

●PNG（デフォルトの場合）

サイズは25KBでした。

●PNG（最大圧縮の場合）

サイズは24KBでした。デフォルトとの違いが分かりません。

●PNG（圧縮なしの場合）

サイズは385KBでした。ただこれもデフォルトと違うが分かりません。可逆圧縮形式というのに関係しているのでしょうか。

●JPEG（圧縮率0%の場合）

サイズは33KBでした。

●JPEG（圧縮率10%の場合）

サイズは17KBでした。圧縮率0%と比較すると約半分のサイズになっています。画質もよくよく見れば確かにちょっと劣化していますが、気になるほどではありません。

●JPEG（圧縮率20%の場合）

サイズは14KBでした。見る人によってはそろそろ気になってくる画質でしょうか。

●JPEG（圧縮率30%の場合）

サイズは12KBでした。粗さが目立つようになってきました。

●JPEG（圧縮率50%の場合）

サイズは10KBでした。ここまで来てしまうと実用的ではないかもしれません。

●JPEG（圧縮率100%の場合）

サイズは4KBでした。これを使用するのは現実的ではありません。

EspressChartでは、作成したグラフをJPEGやPNGなどの画像形式で出力し、web上に展開する方法が一般的で多くのユーザ様がこの方法を利用しています。ただ、画像形式の場合はいわゆる「静止画」なため、動きのあるグラフを作成できません。

EspressChartでは動きのあるアニメーショングラフとしてFlash(swf)形式をサポートしております。このFlash形式のグラフは画像と同様にweb上に展開することが可能です。

●Flash形式で出力したアニメーショングラフのサンプル

//www.climb.co.jp/soft/espresschart/chart/animation.html
このようにグラフ表示時にアニメーション形式で動くグラフが作成な他、マウスオーバーによりデータをツールチップ形式で表示させたり、同じくマウスオーバーによりグラフ自体の色に変化を加えることも可能です。

●webへの展開方法

1.サーブレットプログラムを作成します。以下はサンプルです。

import quadbase.ChartAPI.*;

import java.applet.Applet;
import java.io.*;

import javax.servlet.*;
import javax.servlet.http.*;

public class FlashSample extends HttpServlet {

public void doGet(HttpServletRequest req, HttpServletResponse res)
throws ServletException, IOException {

// コンテンツタイプ設定
res.setContentType(“application/x-shockwave-flash”);
OutputStream toClient = res.getOutputStream();

try {

// EspressManager
QbChart.setEspressManagerUsed(false);

// チャートファイルのパス
String chartLocation = “EC/cht/Animation.tpl”;

// チャートオブジェクトの作成
QbChart chart = new QbChart((Applet) null, chartLocation);

// エクスポート
chart.export(QbChart.FLASH, toClient, null, null, 0, 0, false, 0, 0, false);

toClient.close();

} catch (Exception e) {
e.printStackTrace();
}

}

}

通常の画像形式と異なる個所を赤文字にしました。他は画像形式のときと全く同じですが、注意点としてFlashExport.jarの配置が必要となります。

2.サーブレットを呼ぶhtmlを準備します。以下はサンプルです。

一般的にhtmlからswf形式のファイルを読み込ませる方法と同じです。

3. webブラウザからアクセスし、以下のように表示されればOKです。

通常のグラフではY軸の目盛は、例えば5,10,15のように等間隔で目盛が振られます。以下が通常のグラフの例です。

対数グラフでは対数目盛として、1,10,100,1000、すなわち10の0乗(=1)、10の1乗(=10)、10の2乗(=100)、10の4乗(=1000)のように振られます。

EspressChartでも対数目盛を使用した対数グラフを作成することが可能です。

対数グラフの作成方法

1. Axis Option画面にて「Logarithmic scale」にチェックを入れます。

2. Logarithmic Option画面が開きますので、「Log Base」に底となるベースの数値を指定します。1,10,100,1000のような目盛の場合は10を、1,2,4,8,16のような目盛の場合は2を指定します。

2において、Show Log Valueのチェックを外すと、以下のような対数目盛のグラフが作成されます。

※2において、Show Log Valueのチェックを入れると、以下のような対数目盛のグラフが作成されます。底に対する指数（累乗の数）が目盛として割り当てられます。

このサンプルプログラムは、EspressChartで作成したチャートをそのまま web 上に展開するための最もシンプルなプログラムです。

●配置ライブラリ

以下のライブラリをwebアプリケーションサーバに配置する必要があります。

・EspressAPI.jar
・ExportLib.jar
・qblicense.jar

●表示イメージ

●サンプルプログラム

チャートオブジェクトを生成してそのまま画像に出力している最もシンプルな例です。生成したオブジェクトに対して、プログラムからチャートを細かく制御することも可能です。
————————————————–
package sample;

import quadbase.ChartAPI.*;

import java.applet.Applet;
import java.io.*;
import javax.servlet.*;
import javax.servlet.http.*;

public class Sample extends HttpServlet {

public void doGet(HttpServletRequest req, HttpServletResponse res)
throws ServletException, IOException {

// コンテンツタイプ設定
res.setContentType(“image/html”);
OutputStream toClient = res.getOutputStream();

try {

// バージョンチェック
System.out.println(QbChart.getVersion());

// EspressManager
QbChart.setEspressManagerUsed(false);

// チャートファイルのパス
String chartLocation = “EC/tpl/ECsample.tpl”;

// チャートオブジェクトの作成
QbChart chart = new QbChart((Applet) null, chartLocation);

// エクスポート
chart.export(QbChart.JPEG, toClient);

toClient.close();

} catch (Exception e) {
e.printStackTrace();
}

}

}
————————————————–

EspressChartではY軸のデータは、2つまでであればデフォルトでそのまま簡単にグラフにすることができます。3つ以上の複数データの場合は、ちょっとだけ設定変更が必要です。

例えば以下のようなテキストデータをグラフに展開したいとします。

“int”, “float”, “float”, “float”, “float”
“日”,”データ1″,”データ2″,”データ3″,”データ4″
“01”, “20”, “15.1”, “1.1”, “5”
“02”, “11”, “17.6”, “2.1”, “5.1”
“03”, “18”, “17.5”, “3.1”, “5.5”
“04”, “40”, “18.6”, “4.1”, “6”
“05”, “37”, “19.0”, “5.1”, “6.5”
“06”, “40”, “21.6”, “6.1”, “7”
“07”, “42”, “21.1”, “7.1”, “8”
“08”, “23”, “23.7”, “8.1”, “6”
“09”, “13”, “23.2”, “9.1”, “5”
“10”, “39”, “25.7”, “10.1”, “5”

「日」に対してデータが4つあるパターンです。

EspressChartのチャートデザイナでまずデータを取り込み、「Transpose Data」にチェックを入れます。

対象のデータすべてにおいて「Transpose」にチェックを入れます。

以下のような表示になります。

データマッピングの画面で正しくマッピング設定することで、以下のようにY軸に複数のデータを使用したグラフを作成することができます。

EspressChartでデータが一部欠落している場合（null値の場合）に折れ線グラフを作成するとどのような表示になるか、どのような表示方法があるかご紹介します。

●使用データのサンプル

以下のデータを使用します。2009年度の値が欠落している状態です。

“int”,”float”
“年度”,”値”
“2007”,”69.00″
“2008”,”80.00″
“2009”,””
“2010”,”100.00″
“2011”,”66.00″

●折れ線グラフ表示例

表示方法は様々です。用途に合わせて使い分けてください。

・デフォルトでは、下記のように欠落部分は点線で表示されます。
・下記は、欠落部分を点線ではなく実践で表示させています。

・下記は欠落データを0としてグラフを作成しています。

・下記は欠落部分は何も表示しないようにしています。

設定はフォーマットのメニューから「Format」⇒「Data Properties」で可能です。
下記の赤枠は「欠落部分（null値）を表示する」のオプションで、チェックを外すことで欠落部分を非表示にします。

ドリルダウンとは、データの集計レベルを1つずつ掘り下げて集計項目をさらに詳細にする操作のことを指します。
例えば、国別データを都道府県別に集計し直す、月別データを日別に集計しなおすなどの操作がこれに当たります。
EspressReportはドリルダウンに対応しており、集計レベルを掘り下げたレポートを作成することが可能です。

●ドリルダウンのイメージ

1. まずはrootレポート（ここでは日付別データを使用）を作成します。

2. 次にサブレポート（ここでは時間別データを使用）を作成します。その際、ドリルダウン時のパラメータに設定するフィールドをあらかじめ設定しておく必要があります。

3. 以下実際のドリルダウンイメージです。まずrootレポートとして日付別のデータが表示されます。このとき「日付」の「2010/12/01」の部分をクリックすると・・・

12月1日の時間別データが表示されます。

このように、ドリルダウンを使用してデータの集計レベルを掘り下げて集計項目をさらに詳細にすることが可能です。