Mix Lines and Columns in a Chart
HTML Chart Control
Mix Lines and Columns in a Chart
Technologies > User Interface Add-Ins > HTML Chart Views > Column Chart Mixed with Line Example
A chart mixing lines and columns can be created using a
controlType
of
columnLineChart
. Notice that the line chart's data axis has been assigned the attribute
type="line"
:
<view version="2.0"> <title translatable="true">Column Chart Mixed with Line Example</title> <dataSource id="chartColLine_ds"> <table name="property" /> <field table="property" name="pr_id" /> <field table="property" name="value_book" /> <field table="property" name="value_market" /> <sortField table="property" name="pr_id" /> </dataSource> <panel id="chartColLine_chart" type="htmlChart" controlType="columnLineChart" dataSource="chartColLine_ds" showLegendAsPopUp="false" showExportButton="true" showLabels="false"> <title translatable="true">Room Area and Employee Headcount By Floor</title> <groupingAxis table="property" field="pr_id" labelRotation="45"> <title translatable="true">Floors</title> </groupingAxis> <dataAxis table="property" field="value_book" displayAxis="true"> <title>Book Value</title> </dataAxis> <!-- type="line" will display dataAxis as a line inside a column chart. At this point, type="line" is the only option --> <dataAxis table="property" type="line" field="value_market"> <title>Market Value</title> </dataAxis> </panel> </view>
The view appears as:
Example view: http://localhost:8080/archibus/schema/ab-products/solutions/parts/htmlchart/ab-ex-htmlchart-columnline.axvw