Displaying additional label in JavaFX Pie Chart

Question

I have a pie chart displaying legends(text) and labels(values). I wish to display a pie chart that has values on the outside of the pie and the % on the inside.

Here is a pie chart example.

I have followed this post to change the outer label to display the value instead of the text, but I would like to have another internal label displaying the percentage.

Is there any way I can add those labels? If so, how do I make it? What equation should I use to align those labels nicely?

not supported out off the box - up to you to implement it :) Best do it step by step: start with reading the code of piechart to learn how it's drawn, then add the percentage label anywhere in each pie part and at last do some math (similar to the math that draws the outer text) to locate it as you want. If stuck with a concrete problem, extract it into an minimal reproducible example that demonstrates it. — kleopatra
Hi kleopatra, its precisely because i am unable to figure out the steps to do it which is why i posted the question. In-fact i have even tried getting the coordinates of the label and the center of my pie to try to find a mid point but sadly somehow the coordinates i got for the label seems to be incorrect, the method of using bounds to find screen coordinate doesn't seem to return a correct result either. Right now i have the coordinates of the mid point of the pie and that's it, i am unsure what kind of formula i can use to allow my to place a label in the correct location. — Cherple

Cherple Cherple · Accepted Answer · 2019-09-05T06:38:38

I found the solution, i pretty much just copied nearly the entire "layoutChartChildren()" method. The link to the source code here.

What you need to take note of is mainly just the following 2 lines, which tells you the coordinates to place the label.

double sliceCenterEdgeX = calcX(labelAngles[index], pieRadius, centerX);
double sliceCenterEdgeY = calcY(labelAngles[index], pieRadius, centerY);

pieRadius will be the distance from the center of the circle where the label will be placed. I'll include a short snippet of the extracted code which i copied, the other methods can be copied directly from the source code provided.

double[] labelAngles = new double[getData().size()];
double scale = (total != 0) ? 360 / total : 0;
double start = getStartAngle();

int index = 0;
for (Data d : getData()){
  double size = (isClockwise()) ? (-scale * Math.abs(item.getCurrentPieValue())) : (scale * Math.abs(item.getCurrentPieValue()));
  labelAngles[index] = normalizeAngle(start + (size / 2));
  double sliceX = calcX(labelAngles[index], pieRadius * 0.7, centerX);
  double sliceY = calcY(labelAngles[index], pieRadius * 0.7, centerY);
  //Note: to place it in perfect center:
  //sliceX = sliceX - (text.getBoundsInLocal().getWidth() / 2;
  //sliceY = sliceY - (text.getBoundsInLocal().getHeight() / 2;
  text.relocate(sliceX, sliceY);
}

Displaying additional label in JavaFX Pie Chart

1 Answers