
Customized Sankey Chart
Following is an example of a Customized SanKey Chart.
We have already seen the configurations used to draw a chart in Google Charts Configuration Syntax chapter. Now, let us see an example of a Customized SanKey Chart.
Configurations
We've used Sankey options to customize Sankey chart.
options = { sankey: { link:{ color:{ stroke:'black', strokeWidth:1 } } } };
Example
app.component.ts
import { Component } from '@angular/core'; @Component({ selector: 'app-root', templateUrl: './app.component.html', styleUrls: ['./app.component.css'] }) export class AppComponent { title = ''; type = 'Sankey'; data = [ ["Brazil","Portugal",5], ["Brazil","France",1], ["Brazil","Spain",1], ["Brazil","England",1], ["Canada","Portugal",1], ["Canada","France",5], ["Canada","England",1], ["Mexico","Portugal",1], ["Mexico","France",1], ["Mexico","Spain",5], ["Mexico","England",1], ["USA","Portugal",1], ["USA","France",1], ["USA","Spain",1], ["USA","England",5] ]; columnNames = ['From', 'To','Weight']; options = { sankey: { link:{ color:{ stroke:'black', strokeWidth:1 } } } }; width = 550; height = 400; }
Result
Verify the result.

angular_googlecharts_sankey_charts.htm
Advertisements