Using Template Macros in Data Labels

A template is a special string of characters that the chart engine will dynamically replace with chart component information when it renders the chart. A template is made up of macros. Macros are strings enclosed in a double set of curly braces. Each macro is parsed and replaced independently to build a final string. The chart engine includes many pre-defined macros.

When defining custom data text labels, you can use template macros to display chart component information.

For information about predefined macros, see the Creating HTML5 Charts With WebFOCUS Language manual.

Since data text labels are automatically populated with default values, you need to include the following properties to clear out the default formatting and you must place the custom dataLabels in a GRAPH_JS_FINAL block in the StyleSheet.

"dataLabels": {"visible":true,"formatCallback": null, "displayMode": null}

Example: Using a Template Macro in a Data Text Label

The following request generates a pie chart. The series data text labels display the sum of quantity sold as a number formatted with a dollar sign and two decimal places. It uses the HTML string \n to go to a new line and displays the percentage using the series_percent template macro.

GRAPH FILE WF_RETAIL_LITE
SUM QUANTITY_SOLD
BY PRODUCT_CATEGORY
WHERE PRODUCT_CATEGORY NE 'Televisions'
ON GRAPH PCHOLD FORMAT JSCHART
ON GRAPH SET LOOKGRAPH PIE
-*ON GRAPH SET AUTOFIT ON
ON GRAPH SET STYLE *
INCLUDE=IBFS:/FILE/IBI_HTML_DIR/ibi_themes/Warm.sty,$
TYPE=DATA, COLUMN=N1, BUCKET=color, $
TYPE=DATA, COLUMN=N2, BUCKET=measure, $
*GRAPH_JS_FINAL
"dataLabels": {"visible":true,"formatCallback": null, "displayMode": null}, 
"series":[{"series": "reset", 
 "dataLabels":{"content":"{{value | formatNumber('$#,###.00')}}\n({{series_percent}})"}}], 
*END
ENDSTYLE
END

The output is shown in the following image.

WebFOCUS

Feedback