🟨 Unovis is a modular data visualization framework for React, Angular, Svelte, and vanilla TypeScript or JavaScript.
@unovis/angular provides Angular modules to @unovis/ts, which makes Unovis integration into an Angular
app much easier.
Learn more about Unovis on our website unovis.dev
npm install -P @unovis/ts @unovis/angular<vis-xy-container [height]="500">
<vis-line [data]="data" [x]="x" [y]="y"></vis-line>
<vis-axis type="x"></vis-axis>
<vis-axis type="y"></vis-axis>
</vis-xy-container>import { Component } from '@angular/core'
type DataRecord = { x: number; y: number }
@Component({
selector: 'basic-line-chart',
templateUrl: './basic-line-chart.component.html'
})
export class BasicLineChartComponent {
x = (d: DataRecord): number => d.x
y = (d: DataRecord): number => d.y
data: DataRecord[] = [
{ x: 0, y: 0 },
{ x: 1, y: 2 },
{ x: 2, y: 1 },
]
}import { NgModule } from '@angular/core'
import { VisXYContainerModule, VisLineModule, VisAxisModule } from '@unovis/angular'
import { BasicLineChartComponent } from './basic-line-chart.component'
@NgModule({
imports: [VisXYContainerModule, VisLineModule, VisAxisModule],
declarations: [BasicLineChartComponent],
exports: [BasicLineChartComponent],
})
export class BasicLineChartModule { }Apache-2.0
