Hiding and Customizing Axis Titles in Charts
HTML Chart Control
Hiding and Customizing Axis Titles in Charts
You may wish to control the axis titles in HTML charts.
Hiding Axis Titles
By default, charts display both grouping and data axis titles:
- The grouping axis title is displayed along the grouping axis.
- The first data axis title is displayed along the data axis.
Add-in managers may opt to turn off grouping axis and data axis titles. In some cases these may be obvious from the information already given on the chart, as in, for example, the Building Area by City chart, for which it is clear that the grouping axis is City names.
Setting Custom Data Axis Titles
By default, the chart displays the first data axis title. Add-in managers may customize the data axis title. One use case would be for a chart which displays multiple data axes. In this case the default title may be altered to reflect the multiple data axes.
Add the
<dataAxisTitle>
element as a child of the chart
<panel>
element:
<dataAxisTitle>Book and Market Values</dataAxisTitle>
Examples
Below is the AVXW file showing a custom data axis title.
view version="2.0"> <title translatable="true">Custom Data Axis Title</title> <dataSource id="chartCol_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 type="htmlChart" controlType="columnChart" dataSource="chartCol_ds" showOnLoad="true" showLabels="false" id="panel_row1col1"> <title translatable="true">Book and Market Values by Property</title> <!-- This title is displayed along the data axis. Without this title element, the chart would display the first data axis title. --> <dataAxisTitle translatable="true">Book and Market Values</dataAxisTitle> <groupingAxis table="property" field="pr_id" showLabel="false" showTitle="false" labelRotation="45"> <title translatable="true">Property</title> </groupingAxis> <dataAxis table="property" field="value_book" showLabel="true" showTitle="true"> <title translatable="true">Book Value</title> </dataAxis> <dataAxis table="property" field="value_market" showLabel="true" showTitle="false"> <title translatable="true">Market Value</title> </dataAxis> </panel> </view>
The resulting view appears as so:
Example view: http://localhost:8080/archibus/schema/ab-products/solutions/parts/htmlchart/ab-chart-improve-setaxistitle.axvw