Pie Chart - Learn JBStrap

Overview

A pie chart is a circle diagram displaying one data series. As a circle with data points displayed as slices. The area of each slice is determined by calculating their proportion to the entire circle. Each circle slice is displayed separately on the legend, providing information to the user about the chart’s data categories.

Customization

The color of circle slices is automatically chosen, but you can also specify them. Slices are automatically displayed in percentage (meaning what percentage of the entire circle they represent). You can also modify if the actual data values, a percentage or no labels should be displayed on the slice.

Features

	Lasso	Brush	Zoom	Dot Tooltip	Line Tooltip	Simple Tooltip	Custom Tooltip	Click event
PieChart

Example

  Creating a simple Pie Chart  
        
@Public
public class CreatePieChart extends BasePage {

	@Override
	public void build() {
		// Chart creation
		final ChartCanvas chartCanvas = new ChartCanvas();
		// PieChart creation with dataDescriptor and category columnName
		final PieChart pieChart = new PieChart("firstChart", JBStrap.getDataDescriptor("dummyChartDD"), "category");
		// LineSeries creation with data columnName
		final Series series =  new Series("First Pie Chart", "data");

		// Add series to pieChart
		pieChart.setSeries(series);
		// Add pieChart to chartCanvas
		chartCanvas.addChart(pieChart);


        final Card comment = new Card().addComponent(new Paragraph("Creating a Chart Canvas and a simple Pie Chart on it."));
 
        final Container mapContainer = new Container().setHeight75().addStyleClass("mt-3").addComponent(chartCanvas);
        final Container commentContainer = new Container().setHeight25().addComponent(comment);
 
        addComponents(mapContainer, commentContainer);
	}

}

Overview

Customization

Features

Example

Related pages