-
FEATURED COMPONENTS
First time here? Check out the FAQ!
Hello everyone,
I'm working on a ZK project for a manufacturing Dashboar
what I need to do is visualising machine state with a chart like this one :
www.mediafire.com/view/apadt0ljw534jlw/barcode_charte.png
I have no idea how to do it using ZK charts do you have any suggestion pls ? thx
Hello elmetni,
The barcode chart could be implemented by line chart. Just need to do the following additional instructions:
Then the chart will show as below.
Here is the sample code:
sample.zul
<window apply="MachineStateComposer">
<charts id="chart" title="Machine State for Order 8210 & 8309"
height="300" width="600"/>
</window>
MachineStateComposer.java
import java.util.List;
import org.zkoss.chart.*;
import org.zkoss.chart.plotOptions.LinePlotOptions;
import org.zkoss.zk.ui.select.SelectorComposer;
import org.zkoss.zk.ui.select.annotation.Wire;
import org.zkoss.zul.Window;
public class MachineStateComposer extends SelectorComposer<Window> {
@Wire
Charts chart;
public void doAfterCompose(Window comp) throws Exception {
super.doAfterCompose(comp);
chart.getXAxis().setType("datetime");
YAxis yAxis = chart.getYAxis();
yAxis.setTitle("");
yAxis.setGridLineColor("#FFFFFF");
yAxis.setCategories(MachineStateData.getCategories());
LinePlotOptions plotOptions = chart.getPlotOptions().getLine();
// 1. widen the line's width
plotOptions.setLineWidth(50);
plotOptions.getMarker().setEnabled(false);
// 2. change line style to square
plotOptions.setDashStyle("solid");
initSeries();
hideSomething();
}
private void initSeries() {
List<MachineState> states = MachineStateData.getMachineStates();
for (int i = 0, length = states.size(); i < length; i++) {
Series series = chart.getSeries(i);
MachineState state = states.get(length - i - 1);
series.setColor(state.getColor());
series.setName(state.getName());
for (Interval interval: state.getInvervals()) {
series.addPoint(new Point(interval.getFrom(), i));
series.addPoint(new Point(interval.getTo(), i));
// 3. insert null point to break the line
series.addPoint(new Point(interval.getTo() + 100, null));
}
}
}
private void hideSomething() {
chart.getLegend().setEnabled(false);
chart.getTooltip().setEnabled(false);
chart.getExporting().setEnabled(false);
}
}
MachineStateData.java
import java.util.LinkedList;
import java.util.List;
public class MachineStateData {
private static List<MachineState> machineStates;
static {
machineStates = new LinkedList<MachineState>();
MachineState setup = new MachineState("Machine Setup", "#1ABC9C");
setup.addInverval("15:50, 10-11-2013", "16:00, 10-11-2013");
setup.addInverval("05:00, 10-13-2013", "05:30, 10-13-2013");
machineStates.add(setup);
MachineState running = new MachineState("Running", "#27AE60");
running.addInverval("16:00, 10-11-2013", "17:40, 10-11-2013");
running.addInverval("18:00, 10-11-2013", "18:30, 10-11-2013");
running.addInverval("18:40, 10-11-2013", "19:20, 10-11-2013");
running.addInverval("19:30, 10-11-2013", "20:50, 10-11-2013");
running.addInverval("21:00, 10-11-2013", "21:10, 10-11-2013");
running.addInverval("21:30, 10-11-2013", "23:00, 10-11-2013");
running.addInverval("23:40, 10-11-2013", "23:50, 10-11-2013");
running.addInverval("05:30, 10-13-2013", "06:00, 10-13-2013");
running.addInverval("06:10, 10-13-2013", "08:50, 10-13-2013");
running.addInverval("09:00, 10-13-2013", "09:10, 10-13-2013");
running.addInverval("09:10, 10-13-2013", "09:30, 10-13-2013");
running.addInverval("09:50, 10-13-2013", "11:20, 10-13-2013");
running.addInverval("11:30, 10-13-2013", "12:30, 10-13-2013");
running.addInverval("12:40, 10-13-2013", "15:00, 10-13-2013");
machineStates.add(running);
MachineState idle = new MachineState("Idle", "#C0392B");
idle.addInverval("17:30, 10-11-2013", "17:40, 10-11-2013");
idle.addInverval("18:00, 10-11-2013", "18:10, 10-11-2013");
idle.addInverval("18:20, 10-11-2013", "18:30, 10-11-2013");
idle.addInverval("18:30, 10-11-2013", "18:50, 10-11-2013");
idle.addInverval("19:30, 10-11-2013", "19:50, 10-11-2013");
idle.addInverval("20:00, 10-11-2013", "20:10, 10-11-2013");
idle.addInverval("20:30, 10-11-2013", "20:40, 10-11-2013");
idle.addInverval("21:00, 10-11-2013", "21:20, 10-11-2013");
idle.addInverval("21:40, 10-11-2013", "21:50, 10-11-2013");
idle.addInverval("22:00, 10-11-2013", "22:20, 10-11-2013");
idle.addInverval("22:50, 10-11-2013", "23:00, 10-11-2013");
idle.addInverval("23:10, 10-11-2013", "23:40, 10-11-2013");
idle.addInverval("23:50, 10-11-2013", "00:20, 10-12-2013");
idle.addInverval("06:00, 10-13-2013", "06:10, 10-13-2013");
idle.addInverval("06:30, 10-13-2013", "06:40, 10-13-2013");
idle.addInverval("07:00, 10-13-2013", "07:10, 10-13-2013");
idle.addInverval("07:30, 10-13-2013", "07:40, 10-13-2013");
idle.addInverval("07:50, 10-13-2013", "08:00, 10-13-2013");
idle.addInverval("08:20, 10-13-2013", "08:30, 10-13-2013");
idle.addInverval("08:50, 10-13-2013", "09:20, 10-13-2013");
idle.addInverval("09:50, 10-13-2013", "10:00, 10-13-2013");
idle.addInverval("11:20, 10-13-2013", "11:30, 10-13-2013");
idle.addInverval("12:20, 10-13-2013", "12:40, 10-13-2013");
idle.addInverval("14:10, 10-13-2013", "14:20, 10-13-2013");
idle.addInverval("15:00, 10-13-2013", "15:10, 10-13-2013");
machineStates.add(idle);
MachineState off = new MachineState("Machine Off", "#BDC3C7");
off.addInverval("18:30, 10-11-2013", "18:40, 10-11-2013");
off.addInverval("18:50, 10-11-2013", "19:00, 10-11-2013");
machineStates.add(off);
}
public static List<MachineState> getMachineStates() {
return machineStates;
}
public static List<String> getCategories() {
List<String> categories = new LinkedList<String>();
for (int i = machineStates.size() - 1; i >= 0; i--) {
categories.add(machineStates.get(i).getName());
}
return categories;
}
}
MachineState.java
import java.util.LinkedList;
import java.util.List;
public class MachineState {
private final String name, color;
private List<Interval> invervals;
public MachineState(String name, String color) {
this.name = name;
this.color = color;
invervals = new LinkedList<Interval>();
}
public String getName() {
return name;
}
public String getColor() {
return color;
}
public void addInverval(String from, String to) {
invervals.add(new Interval(from, to));
}
public List<Interval> getInvervals() {
return invervals;
}
}
Interval.java
import java.text.ParseException;
import java.text.SimpleDateFormat;
import java.util.Calendar;
import java.util.TimeZone;
public class Interval {
private long from, to;
private static final Calendar calendar = Calendar.getInstance();
private static final SimpleDateFormat format = new SimpleDateFormat("kk:mm, MM-dd-yyyy");
public Interval(String from, String to) {
this.from = parse(from);
this.to = parse(to);
}
public long getFrom() {
return from;
}
public long getTo() {
return to;
}
private static long parse(String date) {
try {
format.setTimeZone(TimeZone.getTimeZone("GMT"));
calendar.setTime(format.parse(date));
} catch (ParseException e) {
e.printStackTrace();
}
return calendar.getTimeInMillis();
}
}
Asked: 2014-04-02 11:46:39 +0800
Seen: 21 times
Last updated: Apr 03 '14