package demo.pie;
import org.zkoss.chart.Chart;
import org.zkoss.chart.Charts;
import org.zkoss.chart.Color;
import org.zkoss.chart.Series;
import org.zkoss.chart.Title;
import org.zkoss.chart.plotOptions.DataLabels;
import org.zkoss.chart.plotOptions.PiePlotOptions;
import org.zkoss.zk.ui.select.SelectorComposer;
import org.zkoss.zk.ui.select.annotation.Wire;
import org.zkoss.zul.Window;
public class PieSemiCircleComposer extends SelectorComposer<Window> {
@Wire
Charts chart;
public void doAfterCompose(Window comp) throws Exception {
super.doAfterCompose(comp);
chart.setPlotBackgroundColor((Color) null);
chart.setPlotBorderWidth(null);
chart.setPlotShadow(false);
chart.getTooltip().setPointFormat("{series.name}: <b>{point.percentage:.1f}%</b>");
chart.getAccessibility().getPoint().setValueSuffix("%");
Title title = chart.getTitle();
title.setText("Browser<br>shares<br>January<br>2022");
title.setAlign("center");
title.setVerticalAlign("middle");
title.setY(60);
PiePlotOptions poltOptions = chart.getPlotOptions().getPie();
DataLabels dataLabels = poltOptions.getDataLabels();
dataLabels.setEnabled(true);
dataLabels.setDistance(-50);
dataLabels.setStyle("fontWeight: 'bold'; color: 'white';");
poltOptions.setStartAngle(-90);
poltOptions.setEndAngle(90);
poltOptions.setCenter("50%", "75%");
poltOptions.setSize("110%");
Series series = chart.getSeries();
series.setName("Browser share");
series.setType("pie");
series.setInnerSize("50%");
chart.setModel(PieSemiCircleData.getPieModel());
series.getData().get(series.getData().size() - 1).getDataLabels().setEnabled(false);
}
}
package demo.pie;
import org.zkoss.chart.model.DefaultPieModel;
import org.zkoss.chart.model.PieModel;
public class PieSemiCircleData {
private static final PieModel model;
static {
model = new DefaultPieModel();
model.setValue("Chrome", 73.86);
model.setValue("Edge", 11.97);
model.setValue("Firefox", 5.52);
model.setValue("Safari", 2.98);
model.setValue("Internet Explorer", 1.90);
model.setValue("Other", 3.77);
}
public static PieModel getPieModel() {
return model;
}
}