Servletで開発する方法

文書番号 : 37502     文書種別 : 使用方法     登録日 : 2014/08/20     最終更新日 : 2014/08/20
文書を印刷する
対象製品
WebCharts3D 5.4J
詳細
Servletで開発する場合も製品マニュアルで解説しているJSPの開発と同様に、com.gp.api.jsp パッケージのWebページ開発用のクラスであるMxServerComponentとMxChartDescriptionを使用します。
MxServerComponent
サーバでグラフイメージを作成するクラスです。ServletContextを引数にとる自身のstaticメソッドgetDegfaultInstance()でインスタンスを取得します。
MxChartDescription
グラフの情報を設定するためのクラスです。MxServerComponentクラスのnewImageSpec()メソッドを呼び出してインスタンスを取得します。

これらのクラスを用いてサーバで作成したグラフイメージをクライアントのブラウザに表示する方法は2つあります。
直接的な方法
サーバで作成したグラフイメージをHttpServletResponseでクライアントに直接配信します。
間接的な方法
サーバで作成したグラフイメージはサーバにキャッシュされ、キャッシュされたIDを指す<img>タグおよびイメージマップタグを配信します。キャッシュを参照するので間接的な方法と呼びます。ポップアップラベルなど対話式操作が可能になります。

以下、順に説明していきます。

直接的な方法によるチャート配信

使用するクラスはJSPと同じですから、デザイナで自動生成されるJSPのコードを利用することができます。以下は、デザイナでJSPの直接出力で自動生成されたコードをServletのdoGet()メソッドに張り付けて作成したServletの例です。

サンプルコード(SampleChartServlet1.java)
 import java.io.*
 import java.net.*
 import javax.servlet.*
 import javax.servlet.http.*
 import com.gp.api.jsp.*

 public class SampleChartServlet1 extends HttpServlet {
   
    public void doGet(HttpServletRequest request, HttpServletResponse response)
    throws ServletException, IOException {

    //ServletContextを取得します。MxServerComponent.getDefaultInstance()メソッドで必要です。
    ServletContext sc = getServletContext();

    try{
        // 以下のコードは、
        // MxServerComponent.getDefaultInstance()メソッドの引数の変数名以外は
        // デザイナの JSP直接出力で作成されるソースコードです。
        MxServerComponent  svr = MxServerComponent.getDefaultInstance(sc);

        MxChartDescription myChart = svr.newImageSpec();
        myChart.width = 409;
        myChart.height= 371;
        myChart.type = "PNG";  
        myChart.style = " <frameChart font=¥"Dialog-11¥"> <frame xDepth=¥"22¥" yDepth=¥"10¥" xTilt=¥"10¥"/> <xAxis>  <titleStyle font=¥"Dialog-14¥"/> </xAxis> <yAxis scaleMin=¥"0¥" scaleMax=¥"450¥"> <titleStyle font=¥"Dialog-14¥"/> </yAxis> <yAxis2> <titleStyle font=¥"Dialog-14¥"/> </yAxis2> <topYAxis> <titleStyle font=¥"Dialog-14¥"/> </topYAxis> <topYAxis2> <titleStyle font=¥"Dialog-14¥"/> </topYAxis2> <dataLabels font=¥"Dialog-12¥"/> <elements place=¥"Stacked¥" drawShadow=¥"true¥"> <morph stage=¥"Cols¥"/> </elements> <title font=¥"Dialog-16¥"/> <paint palette=¥"Pastel¥"/> </frameChart>";
        myChart.model = "<?xml version=¥"1.0¥" encoding=¥"UTF-8¥"?>¥n<XML type=¥"default¥">¥n<COL>2000</COL>¥n<COL>2001</COL>¥n<COL>2002</COL>¥n<COL>2003</COL>¥n<COL>2004</COL>¥n<ROW col0=¥"100.0¥" col1=¥"200.0¥" col2=¥"100.0¥" col3=¥"180.0¥" col4=¥"200.0¥">サンプル 0:</ROW>¥n<ROW col0=¥"150.0¥" col1=¥"300.0¥" col2=¥"250.0¥" col3=¥"230.0¥" col4=¥"250.0¥">サンプル 1:</ROW>¥n<ROW col0=¥"200.0¥" col1=¥"400.0¥" col2=¥"400.0¥" col3=¥"280.0¥" col4=¥"300.0¥">サンプル 2:</ROW>¥n<ROW col0=¥"250.0¥" col1=¥"500.0¥" col2=¥"550.0¥" col3=¥"330.0¥" col4=¥"350.0¥">サンプル 3:</ROW>¥n</XML>";

        svr.writeBytesTo(myChart,response)
    }catch (IOException ioex)   {
        ioex.printStackTrace();
    } 
    }
 }


ブラウザに表示するHTMLの<img>タグのsrc属性に上記のServletを指定することで、グラフのイメージがブラウザに表示されるようになります。

サンプルコード(SampleChartServlet1.java)
 <html>
 <body>
 <h1>WebCharts3D Servlet Sample</h1>
 <img src="./SampleChartServlet">
 </body>
 </html>


実行結果(SampleChartServlet1)
 sample1

以上のように、Servletの場合にも、デザイナのJSPのソースコードを利用して開発を行うことができます。また、MxChartDescriptionクラスのstyleとmodelのプロパティは、それぞれ次のメソッドによってファイルから読み込むことが可能です。
style
loadStyles()メソッドを使用してデザイナのXMLスタイルタブで保存できるXMLを読み込めます。
model
linkTo()メソッドを使用してデザイナのXMLモデルで作成できるXMLファイルを読み込めます。

サンプルコード(SampleChartServlet1_2)
 import java.io.*
 import java.net.*
 import javax.servlet.*
 import javax.servlet.http.*
 import com.gp.api.jsp.*

 public class SampleChartServlet1_2 extends HttpServlet {
   
    public void doGet(HttpServletRequest request, HttpServletResponse response)
    throws ServletException, IOException {

    //ServletContextを取得します。
    ServletContext sc = getServletContext();

    try{
        MxServerComponent  svr = MxServerComponent.getDefaultInstance(sc);

        MxChartDescription myChart = svr.newImageSpec();
        myChart.width = 409;
        myChart.height= 371;
        myChart.type = "PNG";  
        // styleとmodelプロパティをファイルから読み込むように変更。
        myChart.loadStyles(sc.getRealPath("./xml/style.xml"));
        myChart.linkTo(sc.getRealPath("./xml/model.xml"));
        svr.writeBytesTo(myChart,response)
    }catch (IOException ioex)   {
        ioex.printStackTrace();
    } 
    }
 }


ソースコードも読みやすくなりました。

間接的な方法によるチャート配信

イメージマップにより対話式のチャートを作成するためには、間接的な方法を用います。
この場合、MxServerComponentのキャッシュからチャートイメージを取得するためのjspが必要になり、製品にはサンプルとしてgetImage.jspが用意されています。デザイナのコードビューでJSP間接出力を選択したときにも、このgetImage.jspを用いたコードが出力されます。

サンプルコード(SampleChartServlet2)
 import java.io.*
 import java.net.*
 import javax.servlet.*
 import javax.servlet.http.*
 import com.gp.api.jsp.*

 public class SampleChartServlet2 extends HttpServlet {
   
    public void doGet(HttpServletRequest request, HttpServletResponse response)
    throws ServletException, IOException {

    //ServletContextを取得します。
    ServletContext sc = getServletContext()

        // 
        MxServerComponent  svr = MxServerComponent.getDefaultInstance(sc);

        MxChartDescription myChart = svr.newImageSpec();
        myChart.width = 409;
        myChart.height= 371;
        myChart.type = "PNG";  
        myChart.loadStyles(sc.getRealPath("./xml/style.xml"));
        myChart.linkTo(sc.getRealPath("./xml/model.xml"));

        //先ほどまでの例のようにHttpServletResponseにチャートイメージを
        //書き込むのではなく、PrintWriterを用いてHTMLタグをブラウザに返します。
        response.setContentType("text/htmlcharset=Shift_JIS");
        PrintWriter out = response.getWriter();

        try{
            out.println("<html>");
            out.println("<title>Servlet SampleChartServlet2</title>");
            out.println("</head>");
            out.println("<body>");
            out.println("<h1>Servlet 対話式チャート </h1>");
            //イメージマップタグを作成するメソッドを呼び、
            //その中でgetImage.jspを用いてイメージを取得するように記します。
            //製品ルート以下のsampleディレクトリにあるgetImage.jspをサーバーに配備し、
            //そのファイルへのパスを設定してください
            out.println(svr.getImageTag(myChart,"getImage.jsp?image="));
            out.println("</body>");
            out.println("</html>");
           
        } finally { 
            out.close();
        }
    }
 }


実行結果(SampleChartServlet2)
 sample1

イメージマップを用いたポップアップラベルが表示できました。