1. Report Designer’s Guide
  2. Visualizations
  3. Combo Chart

Combo Chart

JSON Data Attribute XML declaration Description / Notes

name

<cell type="text" data-format="text" alignment="left" style="col_header_1" print-width="130" chart-attr-name="seriesName">TotalOperatingCosts</cell>

“seriesName” is a constant attribute name. The value is derived based on the cell type definition.

items

<cell type="expr" data-format="integer" alignment="right" style="header_1" suppress-formatting="true">DBGET("DailyOpsQuery","prepCostTotal")</cell>

This attribute must directly follow the “seriesName” declaration. This is the chart data points/items values. The “suppress-formatting” property must be set to true. The value is derived based on the cell type definition.

type

<cell type="chart_text" data-format="text" alignment="left" chart-attr-name="chartType">line</cell>

“chartType” is a constant attribute name. The cell type must be set to “chart_text”. Valid values are line, bar, or area.

color

<cell type="chart_text" data-format="text" alignment="left" chart-attr-name="chartColor">dvtCategory5Color</cell>

“chartColor” is a constant attribute name. The cell type must be set to “chart_text”. Valid values are listed in this table.

markerDisplayed

<cell type="chart_text" data-format="text" alignment="left" chart-attr-name="markerDisplayed">on</cell>

“markerDisplayed” is a constant attribute name. The cell type must be set to “chart_text”. Valid values are on or off.

groupData

<cell type="column" data-format="text" alignment="left" chart-attr-name="groupData">Group A</cell>

“groupData” is a constant attribute name. The value is derived based on the cell type definition.

stackValue

<cell type="chart_text" data-format="text" alignment="left" chart-attr-name="stackValue">on</cell>

“stackValue” is a constant attribute name. The cell type must be set to “chart_text”. Valid values areon or off.

dualY

<cell type="chart_text" data-format="text" alignment="left" chart-attr-name="dualY">on</cell>

“dualY” is a constant attribute name. The cell type must be set to “chart_text”. Valid values are on or off.

xAxisTitle

<cell type="text" data-format="text" alignment="left" chart-attr-name="xAxisTitle">Y Axis Title</cell>

“xAxisTitle” is a constant attribute name. The value is derived based on the cell type definition.

xAxisRefObjValue

<cell type="text" data-format="text" alignment="left" chart-attr-name="xAxisRefObjValue">Group A</cell>

“xAxisRefObjValue” is a constant attribute name. The value is derived based on the cell type definition.

xAxisRefObjLegendText

<cell type="text" data-format="text" alignment="left" chart-attr-name="xAxisRefObjLegendText">X Axis Object Reference Text</cell>

“xAxisRefObjLegendText” is a constant attribute name. The value is derived based on the cell type definition.

xAxisRefObjHoverDescValue

<cell type="text" data-format="text" alignment="left" chart-attr-name="xAxisRefObjHoverDescValue">X Axis Sample Reference Line</cell>

“xAxisRefObjHoverDescValue” is a constant attribute name. The value is derived based on the cell type definition.

yAxisTitle

<cell type="text" data-format="text" alignment="left" chart-attr-name="yAxisTitle">Y Axis Title</cell>

“yAxisTitle” is a constant attribute name. The value is derived based on the cell type definition.

yAxisRefObjValue

<cell type="text" data-format="text" alignment="left" chart-attr-name="yAxisRefObjValue">25000</cell>

“yAxisRefObjValue” is a constant attribute name. The value is derived based on the cell type definition.

yAxisRefObjLegendText

<cell type="text" data-format="text" alignment="left" chart-attr-name="yAxisRefObjLegendText">Y Axis Object Reference Text</cell>

“yAxisRefObjLegendText” is a constant attribute name. The value is derived based on the cell type definition.

yAxisRefObjHoverDescValue

<cell type="text" data-format="text" alignment="left" chart-attr-name="yAxisRefObjHoverDescValue">Y Axis Sample Reference Line</cell>

“yAxisRefObjHoverDescValue” is a constant attribute name. Value is derived based on the cell type definition.

y2AxisTitle

<cell type="text" data-format="text" alignment="left" chart-attr-name="y2AxisTitle">Y2 Axis Title</cell>

“y2AxisTitle” is a constant attribute name. The value is derived based on the cell type definition.

hoverSeriesLabel

<cell type="text" data-format="text" alignment="left" chart-attr-name="hoverSeriesLabel">Test Series</cell>

“hoverSeriesLabel” is a constant attribute name. The value is derived based on the cell type definition.

hoverValueLabel

<cell type="text" data-format="text" alignment="left" chart-attr-name="hoverValueLabel">Test Value</cell>

“hoverValueLabel” is a constant attribute name. The value is derived based on the cell type definition.

hoverGroupLabel

<cell type="text" data-format="text" alignment="left" chart-attr-name="hoverGroupLabel">Test Group</cell>

“hoverGroupLabel” is a constant attribute name. The value is derived based on the cell type definition.

hoverValueY2Label

<cell type="text" data-format="text" alignment="left" chart-attr-name="hoverValueY2Label">Test Value Y2</cell>

“hoverValueY2Label” is a constant attribute name. The value is derived based on the cell type definition.

dataType

<cell type="chart_text" data-format="text" alignment="left" chart-attr-name="dataType">integer</cell>

“dataType” is a constant attribute name. This applies data formatting to “items” values. The cell type must be set to “chart_text”. The valid value is the same as those that can be defined in cell data-format.

decimalPlaces

<cell type="chart_text" data-format="text" alignment="left" chart-attr-name="decimalPlaces">2</cell>

“decimalPlaces” is a constant attribute name. This set number of decimal places to “items” values. The cell type must be set to “chart_text”. The Value is an integer.

dataTypeY2

<cell type="chart_text" data-format="text" alignment="left" chart-attr-name="dataTypeY2">integer</cell>

“dataType” is a constant attribute name. This applies data formatting to “items” values in the Y-2 axis. The cell type must be set to “chart_text”. The valid value is the same as those that can be defined in cell data-format.

decimalPlacesY2

<cell type="chart_text" data-format="text" alignment="left" chart-attr-name=" decimalPlacesY2">2</cell>

“decimalPlacesY2” is a constant attribute name. This set number of decimal places to “items” values in the Y-2 axis. The cell type must be set to “chart_text”. The value is an integer.

dataTypeSeriesFormat

<cell type="chart_text" data-format="text" alignment="left" chart-attr-name="dataTypeSeriesFormat">percent</cell>

“dataTypeSeriesFormat” is a constant attribute name. This applies data formatting to “seriesName” values. The cell type must be set to “chart_text”. The valid value is the same as those that can be defined in cell data-format.

dataTypeGroupFormat

<cell type="chart_text" data-format="text" alignment="left" chart-attr-name="dataTypeGroupFormat">currency</cell>

“dataTypeGroupFormat” is a constant attribute name. This applies data formatting to “groupData” values. The cell type must be set to “chart_text”. The valid value is the same as those that can be defined in cell data-format.

Table 4-1 Valid Color Values

Color Value Sample

dvtCategory1Color

 Sample of dvtCategory1Color

dvtCategory1ColorAlt

 Sample of dvtCategory1ColorAlt

dvtCategory2Color

 Sample of dvtCategory2Color

dvtCategory2ColorAlt

 Sample of dvtCategory2ColorAlt

dvtCategory3Color

 Sample of dvtCategory3Color

dvtCategory3ColorAlt

 Sample of dvtCategory3ColorAlt

dvtCategory4Color

 Sample of dvtCategory4Color

dvtCategory4ColorAlt

 Sample of dvtCategory4ColorAlt

dvtCategory5Color

 Sample of dvtCategory5Color

dvtCategory5ColorAlt

 Sample of dvtCategory5ColorAlt

dvtCategory6Color

 Sample of dvtCategory6Color

dvtCategory6ColorAlt

 Sample of dvtCategory6ColorAlt

dvtCategory7Color

 Sample of dvtCategory7Color

dvtCategory7ColorAlt

 Sample of dvtCategory7ColorAlt

dvtCategory8Color

 Sample of dvtCategory8Color

dvtCategory8ColorAlt

 Sample of dvtCategory8ColorAlt

dvtCategory9Color

 Sample of dvtCategory9Color

dvtCategory9ColorAlt

 Sample of dvtCategory9ColorAlt

dvtCategory10Color

 Sample of dvtCategory10Color

dvtCategory10ColorAlt

 Sample of dvtCategory10ColorAlt

dvtCategory11Color

 Sample of dvtCategory11Color

dvtCategory11ColorAlt

 Sample of dvtCategory11ColorAlt

dvtCategory12Color

 Sample of dvtCategory12Color

dvtCategory12ColorAlt

 Sample of dvtCategory12ColorAlt

Example of XML Report Definition to Generate Combo Chart JSON Data

<report>
        <frame type="table" query-name="MajorGroupsQuery" name="comboFrame">
            <bands>

                <band type="table-body">
                    <cell type="text" data-format="text" alignment="left" print-width="140" indent-level="3" chart-attr-name="seriesName">Series1</cell> 
                    <cell type="column" data-format="currency" alignment="right" suppress-formatting="true" print-width="70">salesTotal</cell>
		<cell type="chart_text" data-format="text" alignment="left" chart-attr-name="chartType">bar</cell> 
					
		<cell type="text" data-format="text" alignment="left" print-width="140" indent-level="3" chart-attr-name="seriesName">Series2</cell> 
                    <cell type="column" data-format="currency" alignment="right" suppress-formatting="true" print-width="70">salesTotal</cell>
		<cell type="chart_text" data-format="text" alignment="left" chart-attr-name="chartType">line</cell> 
		<cell type="chart_text" data-format="text" alignment="left" chart-attr-name="chartColor">dvtCategory5Color</cell> 
		<cell type="chart_text" data-format="text" alignment="left" chart-attr-name="markerDisplayed">on</cell>
					
		<cell type="text" data-format="text" alignment="left" print-width="140" indent-level="3" chart-attr-name="seriesName">Series3</cell>                     
		<cell type="column" data-format="currency" alignment="right" suppress-formatting="true" print-width="70">salesTotal</cell>
		<cell type="chart_text" data-format="text" alignment="left" chart-attr-name="chartType">area</cell> <!-- combo chart type attribute -->
					
		<cell type="text" data-format="text" alignment="left" print-width="140" indent-level="3" chart-attr-name="seriesName">Series4</cell> 
                    <cell type="column" data-format="currency" alignment="right" suppress-formatting="true" print-width="70">salesTotal</cell>
		<cell type="chart_text" data-format="text" alignment="left" chart-attr-name="chartType">bar</cell> 
		<cell type="chart_text" data-format="text" alignment="left" chart-attr-name="chartColor">dvtCategory6Color</cell> 
		<cell type="chart_text" data-format="text" alignment="left" chart-attr-name="assignedToY2">on</cell> 
					
		<cell type="column" data-format="text" alignment="left" chart-attr-name="groupData">majorGroupNameMaster</cell>
                </band>
				
	    <band type="table-column-header">
		<!--  xAxisTitle chart attribute  -->
                    <cell type="text" data-format="text" alignment="left" chart-attr-name="xAxisTitle">X Axis Title</cell>
		<!--  xAxisRefObjValue chart attribute  -->
                    <cell type="text" data-format="text" alignment="left" chart-attr-name="xAxisRefObjValue">Group A</cell>
		<!--  xAxisRefObjLegendText chart attribute  -->
                    <cell type="text" data-format="text" alignment="left" chart-attr-name="xAxisRefObjLegendText">X Axis Object Reference Text</cell>
		<!--  xAxisRefObjHoverDescValue chart attribute  -->
                    <cell type="text" data-format="text" alignment="left" chart-attr-name="xAxisRefObjHoverDescValue">X Axis Sample Reference Line</cell>
		<!--  yAxisTitle chart attribute  -->
                    <cell type="text" data-format="text" alignment="left" chart-attr-name="yAxisTitle">Y Axis Title</cell>
		<!--  yAxisRefObjValue chart attribute  -->
                    <cell type="text" data-format="text" alignment="left" chart-attr-name="yAxisRefObjValue">Group B</cell>
		<!--  yAxisRefObjLegendText chart attribute  -->
                    <cell type="text" data-format="text" alignment="left" chart-attr-name="yAxisRefObjLegendText">Y Axis Object Reference Text</cell>
		<!--  yAxisRefObjHoverDescValue chart attribute  -->
                    <cell type="text" data-format="text" alignment="left" chart-attr-name="yAxisRefObjHoverDescValue">Y Axis Sample Reference Line</cell>
		<!--  y2AxisTitle chart attribute  -->
                    <cell type="text" data-format="text" alignment="left" chart-attr-name="y2AxisTitle">Y2 Axis Title</cell>
		<!-- hover series label attribute  -->
                    <cell type="text" data-format="text" alignment="left" chart-attr-name="hoverSeriesLabel">Test Series</cell>
		<!-- hover value label attribute  -->
                    <cell type="text" data-format="text" alignment="left" chart-attr-name="hoverValueLabel">Test Value</cell>
		<!-- hover group label attribute  -->
                    <cell type="text" data-format="text" alignment="left" chart-attr-name="hoverGroupLabel">Test Group</cell>
		<!-- hover value Y2 label attribute  -->
                    <cell type="text" data-format="text" alignment="left" chart-attr-name="hoverValueY2Label">Test Value Y2</cell>
		<!--  dualY chart attribute  -->
                    <cell type="chart_text" data-format="text" alignment="left" chart-attr-name="dualY">off</cell>
		<!-- stackValue chart attribute  -->
                    <cell type="chart_text" data-format="text" alignment="left" chart-attr-name="stackValue">off</cell>
		<!-- extra cell to match count in table-body -->
		<cell type="chart_text" data-format="text" alignment="left"></cell>
		<cell type="chart_text" data-format="text" alignment="left"></cell>					
        	  </band>

          </bands>
     </frame>
      	
     <layout type="columner">
           <component frame-name="comboFrame" column="1" visual-type="ojCombo" visual-style="oj-sm-12" visual-title=""/>
     </layout>

</report>

Parent topic: Visualizations