Skip to content

Line Graph

Sukanya Dasgupta edited this page Jul 22, 2019 · 2 revisions

Line Graph

TypeScript:

lineData = [
    {x: 10, y: 10, info: ''},
    {x: 80, y: 40, info: ''},
    {x: 30, y: 30, info: ''},
    {x: 40, y: 20, info: ''},
    {x: 40, y: 30, info: ''},
    {x: 40, y: 40, info: ''},
    {x: 50, y: 20, info: ''},
    {x: 90, y: 20, info: ''},
    {x: 41, y: 45, info: ''},
    {x: 51, y: 22, info: ''},
    {x: 92, y: 10, info: ''}
  ];

HTML:

<ngx-line-graph
[width]="800" [height]="400"
[minX]="0" [maxX]="100" 
[minY]="0" [maxY]="50" 
[gridPrecisionX]="10" 
[gridPrecisionY]="10"
xAxisTitle="Time"
yAxisTitle="Distance"
[data]="lineData"
color="#ff4444"></ngx-line-graph>