Line Series
Line series visualize data as a collection of points connected by a line. This line can be broken, smooth, or step-like, which corresponds to the Line, Spline, and Step Line series types.
Line series also include stacked series types: Stacked Line and Stacked Spline. In such series, the value of each next point is counted off from the previous point with the same argument. As a result, series are put in a stack. Very similar to stacked series are full-stacked series - Full-Stacked Line and Full-Stacked Spline. In these series, the sum of all point values by a given argument is considered 100%, and each individual point value is recalculated to be a share of these 100%.
To specify one or another series type, assign its name to the series[].type option. You can configure:
- Each series individually using the series array;
- All series in the Chart using the commonSeriesSettings object;
- All series of a specific type using objects nested in commonSeriesSettings: line, spline, stepline, etc.
jQuery
$(function () { $("#chartContainer").dxChart({ series: [{ type: "spline" }, { // ... }], commonSeriesSettings: { line: { ... }, spline: { ... }, stepline: { ... }, stackedline: { ... }, stackedspline: { ... }, fullstackedline: { ... }, fullstackedspline: { ... } } }); });
Angular
<dx-chart ... > <dxi-series type="spline"></dxi-series> <dxi-series ... ></dxi-series> ... <dxo-common-series-settings> <dxo-line ... ></dxo-line> <dxo-spline ... ></dxo-spline> <dxo-stepline ... ></dxo-stepline> <dxo-stackedline ... ></dxo-stackedline> <dxo-stackedspline ... ></dxo-stackedspline> <dxo-fullstackedline ... ></dxo-fullstackedline> <dxo-fullstackedspline ... ></dxo-fullstackedspline> </dxo-common-series-settings> </dx-chart>
import { DxChartModule } from "devextreme-angular"; // ... export class AppComponent { // ... } @NgModule({ imports: [ // ... DxChartModule ], // ... })
Refer to the Series Types section of the API Reference for a full list of options available to a specific series type.
See Also
If you have technical questions, please create a support ticket in the DevExpress Support Center.
We appreciate your feedback.