Zhao,
I believe you only have process instance id.
So you can use the following to get the coordinates of the current node :
public static ArrayList<String> getProcessGraphicalStatus(String processInstanceId) throws Exception
{
String processDefId = JPAProcessInstanceDbLog.findProcessInstance(Long.parseLong(processInstanceId)).getProcessId();
kbase = readKnowledgeBase(); // Method to get the KnowledgeBase object.
Process process = kbase.getProcess(processDefId);
ArrayList<String> coordinates = new ArrayList<String>();
try
{
List<NodeInstanceLog> nodeInstanceLogList;
for (Node node : (Node[])((WorkflowProcessImpl) process).getNodes())
{
nodeInstanceLogList = JPAProcessInstanceDbLog.findNodeInstances(Long.parseLong(processInstanceId), new Long(node.getId()).toString());
if(nodeInstanceLogList.size() == 1)
{
coordinates.add(node.getMetaData().get("x")+"");
coordinates.add(node.getMetaData().get("y")+"");
coordinates.add(node.getMetaData().get("height")+"");
coordinates.add(node.getMetaData().get("width")+"");
}
}
}
catch(Exception e)
{
e.printStackTrace();
}
return coordinates;
}
Once you have the coordinates you can put the following in your view :
<div style="position:relative;width:1024px; height:768px;">
<img src="ProcessImageUrl" style="position:absolute;top:0;left:0" />
<ui:repeat value="CoordinateArrayList" var="item">
<div style="position:absolute;top:YCoordinatepx;left:XCoordinatepx;height:HeightCoordinatepx;width:WidthCoordinatepx;border:3px solid red; z-index:1000;"></div>
</ui:repeat>
</div>
Just reduce the height coordinate and width coordinate values by 6 before you put them in the view part.
Regards.