Example of a Time-Series Spline Chart
Time-series charts illustrate data points at successive time intervals and let you follow events over time. This example shows how to create a time-series spline chart.
![note-icon-ns.png.2218ffeca35c8455a86151944efd191d.png](https://community.jaspersoft.com/applications/core/interface/js/spacer.png) | The following chart types use a similar interface: TimeSeriesLine, TimeSeriesSpline, TimeSeriesArea, TimeSeriesAreaSpline. |
To create the report for the chart:
| 1. | Create a new, blank report using the Sample DB data adapter and the query: select * from orders. |
| 3. | Click ![jss-icon-select-all-fields.png.2f6b92a5bfd6935106c8e07d515ca925.png](https://community.jaspersoft.com/applications/core/interface/js/spacer.png) |
| 4. | Delete all bands except for Title and Summary. |
| 5. | Enlarge the Summary band to 500 pixels by changing the Height entry in the Band Properties view. |
To create the chart:
| 1. | Click ![jss-icon-html5-chart.png.424d11f96b2ed533c4f68cbb1bccedd3.png](https://community.jaspersoft.com/applications/core/interface/js/spacer.png) |
The HTML5 Chart Edit Dialog is displayed.
| 2. | Select TimeSeriesSpline for your chart type. |
| 3. | Click the Data Configuration tab. |
![jss-html5-charts-time-series-spline-simple.png.0fe1187b9e27ba24cdce31d7dfc18af9.png](https://community.jaspersoft.com/applications/core/interface/js/spacer.png) |
Simple data configuration view for time-series charts |
| 4. | Enter an expression for the date in the Date Expression field. You can click ![jss-icon-expression-editor.png.7b33f33dd0e331ed2c8b2d29771e7ae7.png](https://community.jaspersoft.com/applications/core/interface/js/spacer.png) |
| 5. | To use multiple series, select Define your series manually. |
| 6. | Define your first series. For this example, use the following data: |
| • | Series – Series 1. The name of the series is automatically generated. You can't change it in the simple configuration. |
| • | Value Expression – $F{FREIGHT}. |
| • | Aggregation Function – Highest |
| • | Tooltip Expression – "max freight" |
| 7. | To define an additional series, click ![jss-icon-html5-add-measure.png.f9503b49aaf8f0c17c5942d6aa57f65e.png](https://community.jaspersoft.com/applications/core/interface/js/spacer.png) |
| • | Value Expression – $F{FREIGHT}.multiply(new BigDecimal(0.5)) |
| • | Aggregation Function – Sum |
| • | Tooltip Expression – "total freight/2" |
| 8. | Click OK to close the HTML5 Chart Edit dialog. |
![jss-html5-charts-time-series-result.png.d2b4b77cbd2892032bb687a7f6087e73.png](https://community.jaspersoft.com/applications/core/interface/js/spacer.png) |
Time series spline chart |
Recommended Comments
There are no comments to display.