Zen レポートでの XPath グラフの使用法

Zen レポートの XPath グラフは古いグラフ・システムで、Zen ページのグラフで現在使用可能なすべての機能をサポートしているわけではありません。Zen レポートではこれを引続きサポートして、下位互換性を確保します。コールバック・グラフには、Zen ページのグラフの機能を完全に再現するグラフ・メカニズムが用意されています。“Zen レポートのコールバック・グラフ” のセクションを参照してください。Zen レポートに XPath グラフを配置するための構文は、Zen ページにグラフを配置するための構文と同じです。"Zen コンポーネントの使用法" の “Zen のグラフ” の章を参照してください。Zen レポートの XPath グラフは、グラフにデータを指定する方法において、Zen ページのグラフおよび Zen レポートのコールバック・グラフのどちらとも異なっています。"Zen レポートの XPath グラフの値の指定" のセクションでは、XPath グラフでのデータの取得方法について説明しています。XPath グラフは、chartStacked 属性のサポートは対象外で、インタラクティブでもありません。

Important:

同じ ZEN レポートで Xpath グラフとコールバック・グラフを組み込んだ場合、既定の色を使用すると、CSS の優先順位に起因する予期しない結果を招く場合があります。

項目は以下のとおりです。

Zen レポートでの XPath グラフの属性

Zen レポートで使用される XPath グラフの要素では以下の属性がサポートされます。

属性	説明
一般的な表示属性	style、width、class などの属性の説明は、“Zen レポートのデータの表示” の章の “レポートの表示属性” のセクションを参照してください。
共通の表示属性	Zen のグラフおよび Zen レポートの XPath グラフでは、ほぼ同じ構文を使用します。そのため、グラフの表示属性に関する情報の大半は、"Zen コンポーネントの使用法" の “Zen のグラフ” の章の “グラフのレイアウト、スタイル、および動作” を参照してください。 Zen レポートのグラフの正しい構文を確認するために "Zen コンポーネントの使用法" を参照する際は、SVG 属性またはデータ収集属性について説明する他のセクションへのドキュメント・リンクは無視してください。それらは、Zen レポートのグラフには適用されません。“グラフのレイアウト、スタイル、および動作” で説明している属性のみ使用してください。Zen のグラフでサポートされているすべての属性が Zen レポートの XPath グラフでサポートされるわけではありません。
データ・ソースの属性	“Zen レポートの XPath グラフの値の指定” のトピックでは、Zen レポートのグラフに表示されるデータを識別するグラフ属性について説明します。これらの属性は、レポートの XML ソース・データ内のフィールドを指定することで機能します。
グラフ・タイプの属性	“グラフのレイアウト、スタイル、および動作” および “Zen レポートの XPath グラフの値の指定” で説明する属性のほかに、一部の属性は特定のタイプのグラフにのみ適用されます。Zen レポートのグラフでは、次の属性が該当します。 <lineChart> — chartFilled および chartPivot。"Zen コンポーネントの使用法" の “Zen のグラフ” の章の "<lineChart>" に説明があります。 <diffChart> — chartPivot および refLineStyle。"Zen コンポーネントの使用法" の “Zen のグラフ” の章の "<diffChart>" に説明があります。 <barChart> — chartPivot。"Zen コンポーネントの使用法" の “Zen のグラフ” の章の "<barChart>" に説明があります。 <hilowChart> — chartPivot。"Zen コンポーネントの使用法" の “Zen のグラフ” の章の "<hilowChart>" に説明があります。 <pieChart> — labelValues。円グラフの扇形に使用するラベルをコンマで区切って並べたリスト。labelValues に値を指定しなかった場合、<pieChart> の seriesNames の値が適用されます。それ以外の場合、それぞれの扇形のラベルには「1、2、3、...」のように連続番号が割り当てられます。outputPercentage は、計算した割合を扇形のラベルに追加します。onlyPercentage は、outputPercentage が True の場合、割合を追加するのではなく、ラベルと置き換えます。formatPercentage は、formatNumber と同じ構文を使用して形式を設定します (<item> の属性リストを参照)。
height	レポートのそのグラフを表示するために使用可能な縦方向のスペースを指定する、HTML の長さの値。 "2in"、"5cm"、"12px"、"14pt"、"3em"、または "75%" は、すべて HTML の長さの値として使用可能な形式です。パーセント (%) は、グラフの親要素を基準とします。円グラフの場合、グラフが円形になるように、高さと幅を同じにする必要があります。

Zen レポートの XPath グラフの値の指定

このセクションでは、Zen レポートのグラフに表示されるデータを指定する属性について説明します。これらの属性は、Zen レポート・クラスの XData ReportDisplay ブロックのグラフ要素に適用できます。属性値が感嘆符 (!) で始まる場合、XML データ・ソースの値を指定する XPath 式を示します。! 以外で始まる値はリテラル値を示します。

以下のコードの例は、XPath 式で指定された dataFields および seriesNames を示しています。

 <barChart
  dataFields="!@AdultPrice,!@ChildPrice"
  seriesGroup="Theater"
  seriesNames="!@TheaterName" />

XML データ・ソースの収集方法の詳細は、“Zen レポートのデータの収集” の章を参照してください。Zen レポートのグラフのデータを XData ReportDefinition および XData ReportDisplay を組み合わせて指定する例は、この章で後述する “Zen レポートの XPath グラフ例” を参照してください。

Note:

Zen ページのグラフでは、このセクションで説明する属性はサポートされていません。このセクションの属性は、Zen レポートのグラフにのみ適用されます。Zen グラフに適用される対応する情報は、"Zen コンポーネントの使用法" の “Zen のグラフ” の章の “Zen ページのグラフの値の指定” を参照してください。

Zen レポートの XData ReportDisplay ブロック内のグラフ要素では、Zen レポートのグラフのデータ・ソースを指定する以下の属性がサポートされています。

Zen レポートのグラフのデータ・ソースの属性

属性	説明
dataFields	すべてのグラフ： 1 つ以上の XPath 式をコンマで区切って並べたリスト。これらの式には、グラフの作成に使用する XML データ・ソース内のノードを指定します。各 XPath 式の先頭には ! 文字を記述する必要があります。円グラフ：円グラフでは、dataFields リストの最初のデータ・フィールドのみが使用されます。このフィールドの値が合計され、合計に対するそれぞれの割合に比例した扇形のサイズになります。
dataGroup	折れ線グラフおよび棒グラフ： XML データ・ソース内のノードを識別する XPath 式を指定します。このデータ・ソースには dataFields で指定したノードを記述します。値の先頭に ! 文字を記述することはできません。dataGroup および seriesGroup は、相互に排他的です。 dataGroup と seriesGroup との違いの説明は、この章の “dataGroup と seriesGroup” を参照してください。円グラフ、差異グラフ、高低グラフ、散布図：有効なオプションはありません。seriesGroup は必須です。
seriesColors	seriesColors には、グラフをプロットするときに使用する 1 つ以上の CSS カラー値のコンマ区切りのリストを指定します。これらの色は、リテラルのカラー名で指定することも、XPath 式として指定することもできます。XPath 式の先頭には ! 文字を記述する必要があります。seriesColors の値を指定しない場合、その既定値は以下のとおりです。 "blue,red,green,yellow,orange,plum,purple" seriesColors で用意している色よりも多くの色がグラフで必要な場合、色リストが自動的に繰り返されます。
seriesCount	このグラフに表示されるデータ系列の数。この数には、リテラル値を指定することも、先頭に ! 文字を付けて XPath 式を指定することもできます。seriesCount を指定しなかった場合、または空白の文字列 ("") を指定した場合、系列の数がグラフのデータ・ソースに基づいて自動的に計算されます。
seriesGroup	すべてのグラフ： XML データ・ソース内のノードを識別する XPath 式を指定します。このデータ・ソースには dataFields に指定したノードを記述します。値の先頭には ! 文字を記述できません。棒グラフおよび折れ線グラフ： seriesGroup または dataGroup を使用できます。dataGroup と seriesGroup は相互排他的です。円グラフ、差異グラフ、高低グラフ、散布図： seriesGroup は必須です。 dataGroup と seriesGroup との違いの説明は、この章の “dataGroup と seriesGroup” を参照してください。
seriesNames	すべてのグラフ：凡例ボックスで各データ系列のラベルに使用する名前を指定します。seriesGroup を指定した場合、先頭に ! 文字を付けて XPath 式を使用できます。リテラル値のコンマ区切りのリストを使用することもできます。XPath 式とリテラル値を同時に使用することはできません。dataGroup を指定する場合、seriesNames に対してリテラル値を使用します。円グラフ： labelValues を設定しない場合、扇形および凡例ボックスのラベルには seriesNames が使用されます。
seriesSize	このグラフに表示する各データ系列内の項目の数。この数には、リテラル値を指定することも、先頭に ! 文字を付けて XPath 式を指定することもできます。seriesSize を指定しなかった場合、または空白の文字列 ("") を指定した場合、この数はグラフのデータ・ソースに基づいて自動的に計算されます。

Zen レポートのグラフ軸

Zen レポートのグラフには、<xaxis> および <yaxis> 要素を指定できます。これらの要素の構文は、Zen ページで使用される構文とほぼ同じです。Zen レポートのグラフの大半は、以下の 2 つの軸を使用してプロットされます。

<xaxis> は、データを表示するカテゴリを指定するカテゴリ軸です。
<yaxis> は各カテゴリのデータ値を表す値軸です。

ピボット・グラフの場合、これらのリレーションシップは逆になります。<xyChart> は散布図とも呼ばれ、<xaxis> 要素と <yaxis> 要素の両方に対して値軸を使用します。<pieChart> に軸はありません。

Caution:

大文字と小文字の区別は重要です。Zen ページでは、要素は <xAxis> および <yAxis> ですが、Zen レポートでは、要素は <xaxis> および <yaxis> となります。クラスを入力してコンパイルする際に、スタジオではこのような入力の違いが識別されます。

Zen レポートで使用する <xaxis> と <yaxis> は以下の属性をサポートします。

属性	説明
共通の軸属性	グラフの軸の汎用属性。説明は、"Zen コンポーネントの使用法" の “Zen のグラフ” の章の “グラフの軸” を参照してください。例外は、chartPivot を "true" に指定した場合で、Zen レポートの軸ラベルのラベル・テキストを回転させることができないため、この場合、labelAngle は無効になります。
labelDisplacement	テキスト・ラベルの行と軸自体の間の使用可能な追加スペースを指定する 10 進数値。labelDisplacement の値は、<xaxis> およびプロット領域間のテキスト・ラベルの縦方向の追加スペースを作成するのに便利です。このスペースは、labelAngle でテキスト・ラベルの回転を設定する場合に重要になります。 chartPivot を "true" に指定する場合、グラフの marginLeft の値を大きくすることで、<yaxis> およびプロット領域間のテキスト・ラベルの横方向の追加スペースを作成できます。この場合、labelDisplacement は適用されません。 labelDisplacement を省略した場合、または空白 ("") を指定した場合、追加スペースは作成されません。
labelGroup	XML データ・ソース内のノードを示す XPath 式を指定します。このデータ・ソースには labelValue で指定したノードを記述します。labelValue と組み合わせて使用します。その例は、“複数のデータ・ポイントを持つ折れ線グラフ” を参照してください。 labelValues に値を指定した場合、labelGroup および labelValueは無視されます。labelGroup、labelValue、または labelValues に値を指定しなかった場合、カテゴリ軸の各アイテムのラベルには「1、2、3、...」のように連続番号が割り当てられます。 labelGroup と labelValue を値軸で指定すると、軸の通常の数値ラベルが非表示になります。
labelValue	カテゴリ軸 (グラフがピボット処理されない限り、x 軸) のラベル値を提供する XML データ・ソース内のノードを指定する XPath 式。指定されたノードは、一連のラベル値を提供します。このラベル値はカテゴリ軸の各項目に対して 1 つ適用されます。labelValue の値の数とカテゴリ軸のポイントの数が同一でない場合、残りの項目はラベル付けされません。labelGroup と組み合わせて使用します。その例は、“複数のデータ・ポイントを持つ折れ線グラフ” を参照してください。 labelValues に値を指定した場合、labelGroup および labelValueは無視されます。labelGroup、labelValue、または labelValues に値を指定しなかった場合、カテゴリ軸の各アイテムのラベルには「1、2、3、...」のように連続番号が割り当てられます。 labelGroup と labelValue を値軸で指定すると、軸の通常の数値ラベルが非表示になります。
labelValues	カテゴリ軸の 1 つ以上のラベル値をコンマで区切って並べたリスト。! で始まる XPath 式は指定できません。円グラフの扇形の名前にはリテラル値を指定します。 labelValues の使用例は、“1 つのデータ系列を持つ棒グラフ” および “複数のデータ・ポイントを持つピボット処理された棒グラフ” を参照してください。 labelValues に値を指定した場合、labelGroup および labelValueは無視されます。labelGroup、labelValue、または labelValues に値を指定しなかった場合、カテゴリ軸の各アイテムのラベルには「1、2、3、...」のように連続番号が割り当てられます。
maxValueDisplacement	その軸で表現できる最大値を微調整するための正または負の浮動小数点数。maxValueDisplacement に指定する数値の末尾には、パーセント記号 (%) を記述してもしなくてもかまいません。軸の maxValue の指定方法に応じて、この属性は以下のように扱われます。 maxValue を指定すると、maxValueDisplacement は無視されます。グラフのデータに基づいて maxValue を自動計算する場合は、データの最大値に maxValueDisplacement の値が追加され、その結果がその軸の最大値として使用されます。 maxValueDisplacement の値を使用すると、その軸の最大値は以下のように計算されます。 maxValueDisplacement に数値のみを指定した場合： (データの最大値) + maxValueDisplacement maxValueDisplacement の末尾にパーセント記号 (%) を記述した場合： (データの最大値) + (((データの最大値) - (データの最小値)) * maxValueDisplacement / 100.0)
minValueDisplacement	その軸で表現できる最小値を微調整するための正または負の浮動小数点数。minValueDisplacement に指定する数値の末尾には、パーセント記号 (%) を記述してもしなくてもかまいません。軸の minValue の指定方法に応じて、この属性は以下のように扱われます。 minValue を指定すると、minValueDisplacement は無視されます。グラフのデータに基づいて minValue を自動計算する場合は、データの最小値に minValueDisplacement の値が追加され、その結果がその軸の最小値として使用されます。 minValueDisplacement の値を使用すると、その軸の最小値は以下のように計算されます。 minValueDisplacement に数値のみを指定した場合： (データの最小値) + minValueDisplacement minValueDisplacement の末尾にパーセント記号 (%) を記述した場合： (データの最小値) + (((データの最大値) - (データの最小値)) * minValueDisplacement / 100.0)
textAnchor	labelAngle に値を指定する場合、textAnchor の値によって、各軸ラベルを形成するテキスト文字列の回転点を指定できます。 textAnchor の値を設定しない場合の既定値は "middle" で、ラベルは各テキスト文字列の中心を基準に回転します。textAnchor の値を "start" に設定して、各テキスト文字列の開始位置を基準にラベルを回転させることも、"end" に設定して、各テキスト文字列の終了位置を基準にラベルを回転させることもできます。 Zen および Zen レポートで共通の labelAngle などの軸に関する設定についての詳細は、“Zen コンポーネントの使用法” の “Zen のグラフ” の章の “グラフの軸” を参照してください。

dataGroup と seriesGroup

<barChart> と <lineChart> の両方により、dataGroup または seriesGroup の属性を使用して、値をグラフに指定する XML データ・ソースのノードを特定する XPath 式を指定できます。その他のすべてのグラフ・タイプでは seriesGroup が必要です。dataGroup を使用するグラフでは、seriesGroup を使用するグラフとは異なる方法でデータを整理して表示します。以下の例は、これらの違いを示しています。

dataGroup を使用する <lineChart>

以下に XData ReportDisplay のブロックを示します。

XData ReportDisplay [ XMLNamespace = "http://www.intersystems.com/zen/report/display" ]
{
<report xmlns="http://www.intersystems.com/zen/report/display"
        name="test">
  <body> 
   <lineChart
    title="Adult Price, Child Price: Data Group"
    dataGroup ="Theater"
    dataFields="!@AdultPrice,!@ChildPrice"
    seriesNames ="Adult Price, Child Price"
    width ="450px"
    height="500px"
    marginTop="20"
    marginBottom="45"
    marginLeft="15"
    marginRight="10"
    legendVisible="true"
    legendWidth="18"
    legendX="70"
    legendY="10"
  >
<xaxis 
 labelGroup="Theater" labelValue="@TheaterName"
 labelAngle="90" textAnchor="begin"
  title="Theaters" />
<yaxis title="Price in Dollars" />
</lineChart>
  </body>
</report>
}

上記は、以下の折れ線グラフを定義しています。

generated description: linechart datagroup

dataGroup と seriesGroup との主な違いは、表示のためのデータのグループ化の方法です。このグラフでは、dataFields 属性の !@AdultPrice で指定した値は 1 行として表示され、!@ChildPrice で指定した値は別の 1 行として表示されます。追加データがデータ・セットで利用できる場合、これをカテゴリ (x) 軸のラベル付けに使用できます。この例では、!@TheaterName 属性の値によって x 軸がラベル付けされます。

次の図では、dataGroup を使用するグラフで XML データ・ソースの値をグループ化する方法を示しています。

seriesGroup を使用する <lineChart>

以下に XData ReportDisplay のブロックを示します。

XData ReportDisplay [ XMLNamespace = "http://www.intersystems.com/zen/report/display" ]
{
<report xmlns="http://www.intersystems.com/zen/report/display"
        name="test">
  <body>
    <lineChart title="Adult Price, Child Price: Series Group"
      seriesGroup="Theater"
      dataFields="!@AdultPrice,!@ChildPrice"
      seriesNames="!@TheaterName"
      seriesColors ="red,blue,green,yellow,orange,plum,purple,navy,maroon"
      width ="450px"
      height="400px"

      marginTop="10"
      marginLeft="10"
      marginRight="45"

      legendVisible="true"
      legendWidth="35"
      legendX="60"
      legendY="14"
      >
<xaxis 
 labelValues="Adult Price, Child Price"
  textAnchor="begin" />
    </lineChart>
  </body>
</report>
}

上記は、以下の折れ線グラフを定義しています。

generated description: linechart seriesgroup

このグラフでは、!@AdultPrice / !@ChildPrice ペアごとに 1 つの折れ線がデータ・セットで描画されます。この例では、重複値のある線があるため、すべての線は表示されません。追加データがデータ・セットで利用できる場合、これをグラフの凡例において色で線を識別するために使用できます。この例では、!@TheaterName 属性の値により線を識別します。

次の図では、seriesGroup を使用するグラフで XML データ・ソースの値をグループ化する方法を示しています。

dataGroup を使用する <barChart>

以下に XData ReportDisplay のブロックを示します。

XData ReportDisplay [ XMLNamespace = "http://www.intersystems.com/zen/report/display" ]
{
<report xmlns="http://www.intersystems.com/zen/report/display"
        name="test">
  <body>
    <barChart title="Adult Price, Child Price: Data Group"
      dataGroup="Theater"
      dataFields="!@AdultPrice, !@ChildPrice"
      seriesNames="Adult Price, Child Price"
      width ="450px"
      height="400px"
      marginTop="20"
      marginBottom="10"
      marginLeft="45"
      marginRight="5"
      chartPivot="true"
      legendVisible="true"
      legendWidth="18"
      legendX="76"
      legendY="10"
      >
      <yaxis
        labelGroup="Theater"
        labelValue="@TheaterName"
        title="Theaters"
        textAnchor="end"
      />
      <xaxis title="Price in Dollars" minValueDisplacement="-25%" majorGridLines="true"/>
    </barChart>
  </body>
</report>
}

上記は、以下の折れ線グラフを定義しています。

generated description: barchart datagroup

このグラフでは、dataFields 属性の !@AdultPrice で指定した値は、1 組みのバーとして表示され、!@ChildPrice で指定した値は別の 1 組みとして表示されます。1 組みのバーはデータ・ノードによりグループ化され、点は対応する <lineChart> でグループ化されます。追加データがデータ・セットで利用できる場合、これをカテゴリ軸のラベル付けに使用できます。グラフがピボット処理されているので、この例ではこれは y 軸になります。この例では、!@TheaterName 属性の値によってカテゴリ軸がラベル付けされます。

seriesGroup を使用する <barChart>

以下に XData ReportDisplay のブロックを示します。

XData ReportDisplay [ XMLNamespace = "http://www.intersystems.com/zen/report/display" ]
{
<report xmlns="http://www.intersystems.com/zen/report/display"
        name="test">
  <body>
    <barChart title="Adult Price, Child Price: Series Group"
      seriesGroup="Theater"
      dataFields="!@AdultPrice, !@ChildPrice"
      seriesNames="!@TheaterName"
      seriesColors ="red,blue,green,yellow,orange,plum,purple,navy,maroon"
      width ="450px"
      height="400px"
      marginTop="10"
      marginBottom="10"
      marginLeft="15"
      marginRight="45"
      legendVisible="true"
      legendWidth="35"
      legendX="60"
      legendY="15"
      >
      <yaxis 
       title="Price in Dollars" 
        minValueDisplacement="-25%" majorGridLines="true"/>
      <xaxis
       labelValues="Adult Price, Child Price"
       title="Theaters"
      />
    </barChart>
  </body>
</report>
}

上記は、以下の折れ線グラフを定義しています。

generated description: barchart seriesgroup

このグラフでは、!@AdultPrice / !@ChildPrice ペアごとに 1 つのバーがデータ・セットで描画されます。!@AdultPrice 値を示すバーがまとめてグループ化され、!@ChildPrice 値を示すバーも同様にグループ化されます。追加データがデータ・セットで利用できる場合、グラフの凡例において色でバーを識別するために使用できます。この例では、!@TheaterName 属性の値によりバーを識別します。

Zen レポートの XPath グラフ例

このセクションでは、折れ線グラフおよび棒グラフの例をいくつか紹介します。それぞれの例では、同じデータ・ソースからの情報を異なる方法で表しています。情報は、SAMPLES データベース内の Cinema アプリケーションから取得されます。このコードを使用するときには、SAMPLES ネームスペース内に存在する Zen レポート・クラスにコードを配置してください。独自の Caché アプリケーション内のデータに合わせて、この例を修正することもできます。

以下の XData ReportDefinition ブロックでは、すべてのサンプル・グラフに対してデータを指定しています。

XData ReportDefinition
[ XMLNamespace = "http://www.intersystems.com/zen/report/definition" ]
{
<report
 xmlns="http://www.intersystems.com/zen/report/definition"
 name="test"
 sql="Select Top 10 TheaterName, AdultPrice, ChildPrice from Cinema.Theater"
 >
  <group name="Theater">
    <attribute name="TheaterName" field="TheaterName" />
    <attribute name="AdultPrice" field="AdultPrice" />
    <attribute name="ChildPrice" field="ChildPrice" />
  </group>
</report>
}

以下のような XML 出力が生成されます。

<test>
  <Theater TheaterName="General Cinema Cambridge" 
   AdultPrice="7.25" ChildPrice="5.75"/>
  <Theater TheaterName="Boston Multiplex" 
   AdultPrice="7.75" ChildPrice="6.25"/>
  <Theater TheaterName="Loews Downtown" 
   AdultPrice="7.00" ChildPrice="5.50"/>
  <Theater TheaterName="General Cinema Boston" 
   AdultPrice="7.00" ChildPrice="5.50"/>
  <Theater TheaterName="Downtown Multiplex" 
   AdultPrice="7.00" ChildPrice="5.50"/>
  <Theater TheaterName="Loews Cambridge" 
   AdultPrice="6.25" ChildPrice="4.75"/>
  <Theater TheaterName="General Cinema Downtown" 
   AdultPrice="6.25" ChildPrice="4.75"/>
  <Theater TheaterName="Cambridge Multiplex" 
   AdultPrice="6.75" ChildPrice="5.75"/>
  <Theater TheaterName="Loews Boston" 
   AdultPrice="6.75" ChildPrice="5.75"/>
</test>

XData ReportDefinition ブロックでは、以下の例で示す XData ReportDisplay 構文がサポートされます。

1 つのデータ系列を持つ棒グラフ

以下に XData ReportDisplay のブロックを示します。

XData ReportDisplay
[ XMLNamespace = "http://www.intersystems.com/zen/report/display" ]
{
<report xmlns="http://www.intersystems.com/zen/report/display"
        name="test">
  <body>
    <barChart title="1 Field with 9 Data Points = 1 Series"

      dataFields="!@AdultPrice"
      seriesGroup="Theater"
      seriesNames="!@TheaterName"

      width ="450px"
      height="400px"
      marginTop="10"
      marginLeft="15"
      marginRight="5"

      legendVisible="true"
      legendWidth="38"
      legendX="56"
      legendY="11"
      >
      <xaxis labelValues="Adult Price" />
    </barChart>
  </body>
</report>
}

上記の XData ReportDefinition ブロックは、以下の棒グラフを定義しています。

generated description: barchart series 1

上記のデータを提供する XData ReportDefinition ブロックについては、"Zen レポートの XPath グラフ例" を参照してください。特定の <barChart> 属性の詳細は、“Zen レポートの XPath グラフ属性” のセクションを参照してください。

このグラフのデータ系列は、XData ReportDefinition ブロック内の AdultPrice 属性の値から取得しています。AdultPrice の値が設定された映画館は 9 つあるため、この系列には 9 つのデータ・ポイントが表示されています。これが一連のデータ・ポイントではなく 1 つの系列と見なされる理由は、<barChart> で seriesGroup 属性を dataFields 属性と組み合わせて使用して、データ・ソースを指定しているためです。

seriesNames 属性には、このグラフ内の凡例の各エントリに対するテキスト・ラベルを指定しています。凡例が示すとおり、これらのラベルは系列のそれぞれのデータ・ポイントに該当します。このグラフの系列は 1 つであるため、<xaxis> の labelValues 属性には、データ系列全体に対して 1 つのラベルを指定しています。後述の例、"2 つのデータ系列を持つ棒グラフ" では、2 つの系列 (1 つは AdultPrice、もう 1 つは ChildPrice) を示しています。

このグラフは 1 つの系列に基づいているため、棒グラフの各棒の異なる色は一連の 7 つの既定色を使用して自動的に割り当てられています。ここでは棒の数が 7 つを超えているので、8 番目と 9 番目の棒の色は繰り返されています。seriesColors 属性を使用すると、別の色のセットを指定することができます。

legendX 属性および legendY 属性の詳細は、"凡例" を参照してください。

複数のデータ・ポイントを持つ折れ線グラフ

以下に XData ReportDisplay のブロックを示します。

XData ReportDisplay
[ XMLNamespace = "http://www.intersystems.com/zen/report/display" ]
{
<report xmlns="http://www.intersystems.com/zen/report/display"
        name="test">
  <body>
    <lineChart title="9 Data Points From 1 Field = 9 Data Points"

      dataGroup="Theater"
      dataFields="!@AdultPrice"
      seriesNames="Adult Price"
      seriesColors="red"
      plotStyle="stroke-width:0.8"
      plotToEdge="false"

      width ="450px"
      height="400px"
      marginTop="10"
      marginBottom="25"
      marginLeft="15"
      marginRight="5"

      bandUpper="7.5"
      bandUpperStyle="fill:orange"
      bandLower="6.5"
      bandLowerStyle="fill:purple"

      legendVisible="true"
      legendWidth="18"
      legendX="76"
      legendY="27"
      >
      <xaxis
        labelAngle="45"
        labelGroup="Theater" labelValue="@TheaterName"
        title="Theaters"/>
    </lineChart>
  </body>
</report>
}

上記の XData ReportDefinition ブロックは、以下の棒グラフを定義しています。

上記のデータを提供する XData ReportDefinition ブロックについては、"Zen レポートの XPath グラフ例" を参照してください。特定の <lineChart> 属性の詳細は、“Zen レポートの XPath グラフ属性” のセクションを参照してください。

このグラフの 9 つのデータ・ポイントは、それぞれ XData ReportDefinition ブロック内の AdultPrice 属性の値から取得しています。AdultPrice の値が設定された映画館は 9 つあるため、9 つのデータ・ポイントが表示されています。これが 1 つの系列と見なされない理由は、<lineChart> で seriesGroup 属性を使用してデータ・ソースを指定していないためです。代わりに、dataGroup および dataFields を使用しています。

seriesColors の単一の値には、このグラフ内で 9 つのデータ・ポイントを描画する際に使用する色を指定しています。plotStyle には、線の幅などのよりスタイルに関する詳細を指定します。plotToEdge を "false" に設定することで、最後の値をグラフのプロット領域の境界線上に描画せず、すべての値を領域内に描画するように指定しています。視覚的効果を高めるために、bandUpper および bandLower で、このグラフの値の標準範囲を上回る部分と下回る部分の背景色の色付き範囲を定義しています。

seriesNames 属性は、このグラフ内の凡例に対してテキスト・ラベルを指定するために必要です。このラベルは、それぞれのデータ・ポイントすべてに該当するため、その色はグラフの seriesColors で指定した単一の値と一致します。x 軸ではこのセットのデータ・ポイントごとに 1 つずつラベルが割り当てられています。レポートでは、<xaxis> の labelGroup 属性および labelValue 属性を使用してデータ・ソースから該当するテキスト文字列を取得し、x 軸に沿って表示される各エントリのラベルを生成します。

<xaxis> の title 属性には、表示領域の下部に表示されるタイトルを指定します。このグラフの marginBottom の値は通常より大きくしており、プロット領域の下部と x 軸の title 上部の間に必要な追加スペースを作成し、x 軸のラベルを形成するテキスト文字列を回転するための領域を確保しています。labelAngle には、テキスト・ラベルの回転角度を指定します。この例の場合は 45 度に設定しています。テキスト文字列の中心を基準に回転しています。これらの文字列に対してより広い縦方向のスペースを作成したい場合は、labelDisplacement 値を追加できますが、この例では追加していません。

legendX 属性および legendY 属性の詳細は、"凡例" を参照してください。

複数のデータ・ポイントを持つピボット処理された棒グラフ

以下に XData ReportDisplay のブロックを示します。

XData ReportDisplay
[ XMLNamespace = "http://www.intersystems.com/zen/report/display" ]
{
<report xmlns="http://www.intersystems.com/zen/report/display"
        name="test">
  <body>
    <barChart title="9 Data Points From 1 Field = 9 Data Points"

      dataGroup="Theater"
      dataFields="!@AdultPrice"
      seriesNames="Adult Price"

      width ="450px"
      height="400px"

      marginTop="10"
      marginLeft="25"
      marginRight="5"

      chartPivot="true"

      legendVisible="true"
      legendWidth="18"
      legendX="76"
      legendY="84"
      >
      <yaxis
        labelValues="GenCinCam,BosMulti,LoewsDown,GenCinBos,
          DownMulti,LoewsCam,GenCinDown,CamMulti,LoewsBos,"
        title="Theaters"
      />
    </barChart>
  </body>
</report>
}

上記の XData ReportDefinition ブロックは、以下の棒グラフを定義しています。

このグラフの 9 つのデータ・ポイントは、それぞれ XData ReportDefinition ブロック内の AdultPrice 属性の値から取得しています。AdultPrice の値が設定された映画館は 9 つあるため、9 つのデータ・ポイントが表示されています。これが 1 つの系列と見なされない理由は、<barChart> で seriesGroup 属性を使用してデータ・ソースを指定していないためです。代わりに、dataGroup および dataFields を使用しています。

seriesColors の単一の値には、通常、このグラフ内で 9 つのデータ・ポイントを描画する際に使用する色を指定する必要があります。ここでは、seriesColors の値を指定していないので、グラフでは描画の既定色リストの最初の色 (青) が使用されています。seriesNames 属性は、このグラフ内の凡例に対してテキスト・ラベルを指定するために必要です。このラベルは、それぞれのデータ・ポイントすべてに該当するため、その色はグラフの seriesColors で指定した単一の値と一致します。

chartPivot が "true" に設定されているため、グラフがピボット処理されており、y 軸ではなく x 軸に AdultPrice の値が表示されています。この設計決定では、y 軸にこのセットの各データ・ポイントに対して 1 つずつラベルを割り当てる役割が与えられています。このグラフでは、<yaxis> の labelValues 属性にコンマで区切った名前のリストを指定して、y 軸に沿って表示される各エントリにリテラルのラベルを割り当てています。<yaxis> の title 属性には、表示領域の最も左側に表示される軸タイトルを指定します。

legendX 属性および legendY 属性の詳細は、"凡例" を参照してください。

1 つのデータ系列を持つ円グラフ

以下に XData ReportDisplay のブロックを示します。

XData ReportDisplay [ XMLNamespace = "http://www.intersystems.com/zen/report/display" ]
{
<report xmlns="http://www.intersystems.com/zen/report/display"
        name="test">
  <body>
    <pieChart title="Adult Price"
      dataFields="!@AdultPrice"
      seriesGroup ="Theater"
      seriesNames ="!@TheaterName"
      seriesColors ="blue,red,green,yellow,orange,plum,purple,brown,navy"
      width ="400px"
      height="400px"
      marginTop="10"
      marginBottom="10"
      marginLeft="10"
      marginRight="10"
      legendVisible="false"
      labelStyle="font-family:arial"
    >
    </pieChart>
  </body>
</report>
}

上記の XData ReportDefinition ブロックは、以下の棒グラフを定義しています。

generated description: piechart series 1

上記のデータを提供する XData ReportDefinition ブロックについては、"Zen レポートの XPath グラフ例" を参照してください。特定の <pieChart> 属性の詳細は、“Zen レポートの XPath グラフ属性” のセクションを参照してください。

このグラフのデータ系列は、XData ReportDefinition ブロック内の AdultPrice 属性の値から取得しています。AdultPrice の値が設定された映画館は 9 つあるため、この系列には 9 つのデータ・ポイントが表示されています。<pieChart> では、seriesGroup 属性を dataFields 属性と組み合わせて使用して、データ・ソースを指定しています。

seriesNames 属性には、このグラフ内の各扇形に対するテキスト・ラベルを指定しています。グラフ内のオブジェクトに対するラベル指定は、<pieChart> に固有の機能です。他のグラフでは使用できません。seriesNames に対してリテラル値を使用する必要はありません。ただし、すべてのタイプのグラフに関して、seriesNames 属性で指定した同じ一連のテキスト・ラベルが、グラフの凡例で使用されます。

既定では、凡例は表示されません。<pieChart> の labelValues 属性にコンマで区切られたラベルのリストを設定した場合、そのグラフでは、扇形のラベル指定には labelValues が使用され、凡例ボックスの入力には seriesNames が使用されます。この場合、legendVisible を使用して、凡例と扇形のラベルを表示することができます。

この <pieChart> に seriesColors 属性の値を指定すると、グラフが読みやすくなります。系列の既定色のセットに用意されているのは 7 つの値のみで、それを超える場合には色が繰り返されます。<pieChart> では、色が一巡して扇形 8 番目および 9 番目で 1 番目および 2 番目と同じ色が再び使用されると、紛らわしくなります。

2 つのデータ系列を持つ棒グラフ

以下に XData ReportDisplay のブロックを示します。

XData ReportDisplay
[ XMLNamespace = "http://www.intersystems.com/zen/report/display" ]
{
<report xmlns="http://www.intersystems.com/zen/report/display"
        name="test">
  <body>
    <barChart title="2 Fields with 9 Data Points Each = 2 Series"

      dataFields="!@AdultPrice,!@ChildPrice"
      seriesGroup ="Theater"
      seriesNames ="!@TheaterName"
      seriesColors ="blue,red,green,yellow,orange,plum,purple,brown,navy"

      width ="450px"
      height="400px"
      marginTop="10"
      marginLeft="15"
      marginRight="5"

      legendVisible="true"
      legendWidth="38"
      legendX="56"
      legendY="11"
      >
      <xaxis labelValues="Adult Price,Child Price" title="Theaters"/>
    </barChart>
  </body>
</report>
}

上記の XData ReportDefinition ブロックは、以下の棒グラフを定義しています。

generated description: barchart series 2

このグラフのデータ系列は、XData ReportDefinition ブロック内の AdultPrice 属性および ChildPrice 属性の値から取得しています。映画館は 9 つあるため、系列ごとにはそれぞれ 9 つのデータ・ポイントが表示されています。<barChart> では、seriesGroup 属性を dataFields 属性と組み合わせて使用して、データ・ソースを指定しています。

seriesNames 属性には、このグラフ内の凡例の各エントリに対するテキスト・ラベルを指定しています。凡例が示すとおり、これらのラベルは各系列のそれぞれのデータ・ポイントに該当します。凡例とは対照的に、x 軸にはデータ・ポイントごとではなく、系列ごとに 1 つのラベルが割り当てられています。このグラフには系列が 2 つあるため、<xaxis> の labelValues 属性には、コンマで区切ったリストで各系列に対して 1 つのラベルを指定しています。

この <barChart> には seriesColors 属性を指定すると便利です。系列の既定色のセットに用意されているのは 7 つの値のみで、それを超える場合には最初の色から再び繰り返されます。この例では、8 番目と 9 番目の色を指定することでグラフ内の色の重複を解消し、グラフを見やすくしています。また、上記の "1 つのデータ系列を持つ棒グラフ" の例のように、既定の 7 色を単に繰り返すこともできます。

legendX 属性および legendY 属性の詳細は、"凡例" を参照してください。