How to use Chart.js

In this tutorials..How  to integrate chart Js in Angular 8.Here is Command to use Chart Js in Angular

Install the library

First, you'll need to install the Chart.js library:

npm install chart.js --save

Next, import the module in your Component:

import { Chart } from 'chart.js';

Configuring the chart

app.component.ts

import { Component, OnInit } from '@angular/core';

import {Chart} from 'chart.js';

@Component({

  selector: 'app-root',

  templateUrl: './app.component.html',

  styleUrls: ['./app.component.css']

})

export class AppComponent implements OnInit {

 PieChart=[];

  ngOnInit()

 {

   this.PieChart = new Chart ('pieChart', {

   type:'pie',

   data:{ 

     labels:["Blue", "Green", "Pink"],

     datasets:[{

       label: 'Vote Now',

       data:[101,102,103],

       backgroundColor:[

         'rgba(40,23,244,0.9)',

         'rgba(192,255,0,0.9)',

         'rgba(239,23,240,0.9)',

       ], }] },

   options:{ title:{ Text:"Bar Chart",

     display:true },

     scales:{  yAxes:[{ ticks:{ begainAtZero:true

         }  }]   }  } }); }}

app.component.html

<h1 align="center">Ujjwal Technical Tips</h1>

<div>

  <canvas id="pieChart"></canvas>

</div>

<router-outlet></router-outlet>

Output

Here is Video Links 

Subscribe On YouTube 

🎯 Subscribe for Daily Tutorials → https://bit.ly/2tRrYGX 🔔 Stay updated!