<?xml version="1.0" encoding="UTF-8"?>



<window apply="demo.area.AreaMissingComposer">
	<charts id="chart" type="area" title="Born persons, by boys' name" />
</window>

package demo.area;

import java.util.Map;

import org.zkoss.chart.Charts;
import org.zkoss.chart.Legend;
import org.zkoss.chart.Series;
import org.zkoss.chart.Subtitle;
import org.zkoss.zk.ui.select.SelectorComposer;
import org.zkoss.zk.ui.select.annotation.Wire;
import org.zkoss.zul.Window;


public class AreaMissingComposer extends SelectorComposer<Window> {

	@Wire
	Charts chart;
	
	public void doAfterCompose(Window comp) throws Exception {
		super.doAfterCompose(comp);
		
		Subtitle subtitle = chart.getSubtitle();
		subtitle.setText("* Missing data for Yasin in 2019");
		subtitle.setAlign("right");
		subtitle.setVerticalAlign("bottom");
		
		Legend legend = chart.getLegend();
		legend.setLayout("vertical");
		legend.setAlign("left");
		legend.setVerticalAlign("top");
		legend.setX(150);
		legend.setY(60);
		legend.setFloating(true);
		legend.setBorderWidth(1);
		legend.setBackgroundColor("#FFFFFF");
		
		chart.getYAxis().setTitle("Amount");

		chart.getPlotOptions().getSeries().setPointStart(2014);
		chart.getPlotOptions().getArea().setFillOpacity(0.5);
		chart.getCredits().setEnabled(false);

		int seriesIndex = 0;
		for (Map.Entry<String, Integer[]> map: AreaMissingData.getData().entrySet()) {
			Series series = chart.getSeries(seriesIndex++);
			series.setName(map.getKey());
			series.setData(map.getValue());
		}
	}
}

package demo.area;

import java.util.LinkedHashMap;
import java.util.Map;

import org.zkoss.chart.model.CategoryModel;
import org.zkoss.chart.model.DefaultCategoryModel;


public class AreaMissingData {
	private final static Map<String, Integer[]> data;
	static {
		data = new LinkedHashMap<>();
		data.put("Arvid", new Integer[] {10, 9, 11, 11, 8, 13, 12, 14});
		data.put("Yasin", new Integer[] {13, 9, 10, 10, 8, null, 8, 6});
	}

	public static Map<String, Integer[]> getData() {
		return data;
	}
}