Charting Editor
Use the Charting Editor tile of Syntelate Studio to design charts that you can display in desktops in Syntelate XA.
Types of Chart
The Charting Editor tile supports two main types of chart: serial and pie/donut.
Serial (Column/Bar/Line)
A serial chart has axes and presents data in columns, bars, or lines (or a hybrid of these). The following four serial charts all show the same data in different ways.
Tip: Try hovering over a chart and also clicking the legend.
Pie/Donut
A pie/donut chart presents data as “slices” of a circle or donut. The following pie and donut charts show the same data as the serial charts.
Tip: Try hovering over a chart and also clicking a slice.
Charts vs Graphs
There is an important distinction between charts and graphs in the Charting Editor.
- A chart refers to an entire diagram, including elements such as a title and legend.
- A graph refers specifically to a set of data that you show on a chart.
A pie/donut chart always has a single graph. A serial chart, however, can show multiple graphs.
For example, the Serial (Column/Bar/Line) all show two graphs: one for Business Travel and one for Personal Travel. In the case of the column/line hybrid chart, these two graphs are of a different type.
Features
The Charting Editor offers lots of customization options for your charts. The following are some of the key features.
Data Sources
You can show data from the following sources:
- Campaign (your Interaction table)
- Custom stored procedure
- Table or view
Rotation
You can rotate a serial chart. A column chart then becomes a bar chart.
Look at the Serial (Column/Bar/Line) and compare the column chart and the bar chart. The bar chart is really just a column chart with the Rotate property set.
Clustering vs Stacking
For a serial chart with multiple graphs of the same type (for example, two column graphs), you can select how these graphs should be stacked.
| Stack type | Description |
|---|---|
| None (i.e. clustered) | The graphs sit beside one another. |
| Regular (i.e. stacked) | The graphs are stacked on top of one another |
| 100% | The graphs are stacked on top of one another and values are shown as percentages. |
| 3D | The graphs sit behind one another. |
Legend
You can show a legend on a serial chart or pie/donut chart.
The Serial (Column/Bar/Line) all include a legend.
Multiple Axes
A serial chart can include multiple value axes For a column chart, the value axis is the vertical axis. For a bar chart, it is the horizontal axis.. You can then define on which axis each graph should be shown. For example, the following chart includes two vertical axes (one for number of calls and one for number of web chats):
Guides
You can add guides to a value axis of a serial chart. For example, the following chart shows a guide between 500 and 600 calls.
Dropdowns
You can add one or more dropdowns to your chart. When a user selects an option in a dropdown, the chart dynamically updates.
Show data only for agent:
Colors
You can set the colors used by the graphs of your serial chart or the slices of your pie/donut chart.
3D
You can add a 3D effect to a column/bar chart or pie/donut chart. To do so, you simply set a Depth and an Angle.
Note: Don’t confuse this with applying a 3D stack type to a serial chart. You can apply a 3D effect to any column or bar chart, regardless of its stack type.
Animation
You can animate the appearance of data on your chart, or you can disable this.
Other Features
The Charting Editor features a bunch of other customization options. For example, the following chart includes:
- A chat cursor that highlights an area of the chart on hover (try hovering over the chart)
- A scrollbar that lets you zoom (try dragging the
icons up and down)