> Markdown version of [Line & Spline](https://vaadin.com/docs/next/components/charts/charttypes/line-and-spline). Section index: [llms.txt](https://vaadin.com/docs/next/components/llms.txt)

# <a id="charts.charttypes.line"></a>Line & Spline Charts

Line charts connect a series of data points with lines. In basic line charts, the lines are straight, whereas in spline charts the lines are smooth polynomial interpolations between the data points.

Table 1. Line Chart Subtypes

| ChartType | Plot Options Class  |
| --------- | ------------------- |
| `LINE`    | `PlotOptionsLine`   |
| `SPLINE`  | `PlotOptionsSpline` |

## <a id="line-example"></a>Line Example

**Flow** — `ChartTypeLine.java`

```java
Chart chart = new Chart(ChartType.LINE);

Configuration configuration = chart.getConfiguration();

configuration.setTitle("Solar Employment Growth by Sector, 2010-2016");
configuration.setSubTitle("Source: thesolarfoundation.com");

YAxis yAxis = configuration.getyAxis();
yAxis.setTitle("Number of Employees");

Legend legend = configuration.getLegend();
legend.setLayout(LayoutDirection.VERTICAL);
legend.setVerticalAlign(VerticalAlign.MIDDLE);
legend.setAlign(HorizontalAlign.RIGHT);

PlotOptionsSeries plotOptionsSeries = new PlotOptionsSeries();
plotOptionsSeries.setPointStart(2010);
configuration.setPlotOptions(plotOptionsSeries);

configuration.addSeries(new ListSeries("Installation", 43934, 52503,
        57177, 69658, 97031, 119931, 137133, 154175));
configuration.addSeries(new ListSeries("Manufacturing", 24916, 24064,
        29742, 29851, 32490, 30282, 38121, 40434));
configuration.addSeries(new ListSeries("Sales & Distribution", 11744,
        17722, 16005, 19771, 20185, 24377, 32147, 39387));
configuration.addSeries(new ListSeries("Project Development", null,
        null, 7988, 12169, 15112, 22452, 34400, 34227));
configuration.addSeries(new ListSeries("Other", 12908, 5948, 8105,
        11248, 8989, 11816, 18274, 18111));
```

## <a id="spline-example"></a>Spline Example

**Flow** — `ChartTypeSpline.java`

```java
Chart chart = new Chart(ChartType.SPLINE);

final Configuration configuration = chart.getConfiguration();
configuration.getTitle().setText("Random data");

XAxis xAxis = configuration.getxAxis();
xAxis.setType(AxisType.DATETIME);
xAxis.setTickPixelInterval(150);

YAxis yAxis = configuration.getyAxis();
yAxis.setTitle(new AxisTitle("Value"));

configuration.getTooltip().setEnabled(false);
configuration.getLegend().setEnabled(false);

final DataSeries series = new DataSeries();
series.setPlotOptions(new PlotOptionsSpline());
series.setName("Random data");
for (int i = -19; i <= 0; i++) {
    series.add(new DataSeriesItem(System.currentTimeMillis() + i * 1000,
            random.nextDouble()));
}

configuration.setSeries(series);
```