The great @BalusC posted a solution for this, but not specific to PrimeFaces. I will transcribe the relevant part below ...
The best way to do this is to put hidden fields with their coordinates, linked to their managed bean properties, and update those values via Javascript / jQuery.
Example:
<h:form>
<h:graphicImage id="image" name="image1.png">
<f:ajax event="click" execute="x y" listener="#{bean.listener}" />
</h:graphicImage>
<h:inputHidden id="x" value="#{bean.x}" />
<h:inputHidden id="y" value="#{bean.y}" />
</h:form>
<h:outputScript>
jQuery("img[id$=':image']").on("mousedown", function(event) {
var $form = jQuery(this).closest("form");
$form.find("input[id$=':x']").val(event.pageX);
$form.find("input[id$=':y']").val(event.pageY);
});
</h:outputScript>
Note: You need jQuery at least in version 1.7 to use jQuery.on() . In previous versions, use jQuery.bind() .
And Managed Bean would look like this:
@ManagedBean
@RequestScoped
public class Bean {
private Integer x;
private Integer y;
public void listener() {
System.out.println(x + ", " + y);
}
// ...
}
However, in its place I would not use JSF components for this task.
Create a REST Web Service or a simple Servlet that receives the appropriate parameters and returns the image.
Then you can put a normal HTML image ( <img/> ), use jQuery to capture the click and then, at each event, go changing the URL of the image tag, because the Servlet will be called and will return the image updated.
