Using Advanced templates

More complex templates are provided with SAV Charts. They can display upto to 9 items in the same charts.

Colors are defined in a specific template DefaultColors.xml which were chosen to provide constrast between items.

Let us illustrate the use of advanced templates with, for example, the template LineChartAdvanced.xml.

In the template section enter the following code, save and go in the frontend.

<template id="1">
   typo3conf/ext/sav_charts/Resources/Private/Templates/ChartsExamples/LineChartAdvanced.xml
</template>
../../_images/LineChartAdvancedInFrontend.png

The chart has 9 superposed curves with the same data, predefined colors, predefined labels and a predefined title.

In the data section enter the following code, save and go in the frontend.

<data id="data">
   <item key="0" values="10, 6, 7, 2, 1, 5, 3" />
</data>
../../_images/LineChartAdvancedWithOneCurveInFrontend.png

Modify the data section as follows:

<data id="data">
   <item key="0" values="10, 6, 7, 2, 1, 5, 3" />
   <item key="1" values="5, 3, 8, 1, 6, 9, 2" />
</data>

<data id="labels">
   1, 2, 3, 4, 5, 6, 7
</data>

In the marker section, enter the following code, save and go in the frontend.

<marker id="title">A line chart with two curves</marker>
<marker id="labelSet0">Curve 1</marker>
<marker id="labelSet1">Curve 2</marker>
../../_images/LineChartAdvancedWithTwoCurvesInFrontend.png