Flutter-docs/Flutter/pyramid-chart/chart-title.md

layout	title	description	platform	control	documentation
post	Chart title in Flutter Pyramid Chart widget | Syncfusion	Learn here all about Chart title feature of Syncfusion Flutter Pyramid Chart (SfPyramidChart) widget and more.	flutter	Chart	ug

Chart title in Flutter Pyramid Chart (SfPyramidChart)

You can define and customize the Chart title using title property of SfPyramidChart. The text property of ChartTitle is used to set the text for the title.

Following properties can be used to customize its appearance.

• backgroundColor - used to change the background color.
• borderColor - used to change the border color.
• borderWidth - used to change the border width.
• textStyle - used to change the text color, size, font family, fontStyle, and font weight.
• color - used to change the color of the text.
• fontFamily - used to change the font family for chart title.
• fontStyle - used to change the font style for the chart title.
• fontSize - used to change the font size for the chart title.

Title Alignment

You can align the title text content horizontally to the near, center or far of the chart using the alignment property of the title.

{% highlight dart %}

@override
Widget build(BuildContext context) {
  return Scaffold(
    body: Center(
      child: Container(
        child: SfPyramidChart(
          title: ChartTitle(
            text: 'Half yearly sales analysis',
            backgroundColor: Colors.lightGreen,
            borderColor: Colors.blue,
            borderWidth: 2,
            // Aligns the chart title to left
            alignment: ChartAlignment.near,
            textStyle: TextStyle(
              color: Colors.red,
              fontFamily: 'Roboto',
              fontStyle: FontStyle.italic,
              fontSize: 14,
            )
          ),
          // Initialize category axis
          series: PyramidSeries<SalesData, String>(
              dataSource: [
                // Bind data source
                SalesData('Jan', 35),
                SalesData('Feb', 28),
                SalesData('Mar', 34),
                SalesData('Apr', 32),
                SalesData('May', 40)
              ],
              xValueMapper: (SalesData sales, _) =>   sales.year,
              yValueMapper: (SalesData sales, _) => sales.sales
            )
        )
      )
    )
  );
}

{% endhighlight %}