Graphique histogramme avec plusieurs séries

Voici un exemple de graphique histogramme avec plusieurs séries.

Nous avons déjà vu les configurations utilisées pour dessiner un graphique dans le chapitre Syntaxe de configuration de Google Charts . Voyons maintenant un exemple de graphique histogramme avec plusieurs séries.

Exemple

app.component.ts

import { Component } from '@angular/core';
@Component({
   selector: 'app-root',
   templateUrl: './app.component.html',
   styleUrls: ['./app.component.css']
})
export class AppComponent {
   title = 'Students height, in cm';
   type = 'Histogram';
   data = [
      ["1", 80, 40],["2", 55, 30],["3", 68, 34],["4", 80, 40],["5", 54, 27],
      ["6", 70, 35],["7", 85, 42],["8", 78, 40],["9", 70, 35],["10", 58, 28],
      ["11", 90, 45],["12", 65, 33],["13", 88, 50],["14", 82, 41],["15", 65, 30],
      ["16", 86, 43],["17", 45, 30],["18", 62, 30],["19", 84, 42],["20", 75, 40], 
      ["21", 82, 41],["22", 75, 40],["23", 58, 30],["24", 70, 35],["25", 85, 40]
   ];
   columnNames = ["Student Roll No", "height", "weight"];
   options = {   
      legend:'none'
   };
   width = 550;
   height = 400;
}

Résultat

Vérifiez le résultat.