Line micro chart

Line micro chart displays a compact trend line for small data series. Use it inside KPI cards, table cells, summaries, dense admin panels, reports, or as a simple dashboard chart when a small line chart is enough.

Use full ECharts charts for complex analytics, detailed axes, legends, drilldown, zooming, or advanced chart interactions.

Key Features:

✅ Customizable Curves: Choose from various curve types like linear, catmull-rom, and bump.
✅ Area Fill: Easily add a filled area under the line with support for gradients.
✅ Interactive Markers: Display markers on data points and interactive tooltips.
✅ Responsive Design: Automatically adjusts to fit the container size.

The NgStarter Angular Line Chart component lets you show compact trends inside cards, rows, dashboards, and KPI summaries. It supports custom curves, area fills, markers, tooltips, responsive sizing, and small time-series visualizations.

Basic line micro chart

Use a basic line micro chart for a compact trend inside a card, row, summary, or simple dashboard chart.

Line chart with custom curve

Use a custom curve when the trend should read as linear, smooth, bumped, or stepped.

Line chart with area

Use area fill when the small trend needs stronger visual weight.

Line chart compact

Use compact mode when the chart should focus on local variation instead of starting from zero.

Line chart with line and markers

Use markers when individual data points matter in the small chart.

Line micro chart with tooltip

Use a tooltip when users need the exact label or value on hover.

Line responsive micro chart

Use responsive mode when the container size can change after render.

Using this component in production?

Source code, templates, and commercial support

NgStarter includes source code, admin dashboard templates, and commercial support.

View pricing →Explore admin templates