Getting Started
Overview
Installation
Theme
Forms
Basic Inputs
Select
Custom Inputs
Components
Navigation
Components
68
Micro Charts
Libraries
Kanban Board
Image Designer
Video Player
Visual Builder
Content Editor
Data View
Purchase

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.