PrimeFaces 图像裁剪器无法显示可选择区域。

Question

我只是复制了PrimeFaces展示页面上的示例，但选择图像的区域没有显示出来。在展示页面中，它看起来非常简单。

我的页面：

<ui:composition 
    xmlns="http://www.w3.org/1999/xhtml"
    xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:f="http://java.sun.com/jsf/core"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:p="http://primefaces.org/ui">

<h:form>  

<p:imageCropper value="#{uploadMB.croppedImage}" id="imageCropper" 
image="/images/banner.jpg" />


</h:form>  

</ui:composition>

我的后端Bean：

@ManagedBean
public class UploadMB implements Serializable{

    private static final Logger logger = Logger.getLogger(UploadMB.class.getName());

    private CroppedImage croppedImage;
    private String newImageName;  

    public String crop() {  
        if(croppedImage == null)  
            return null;  

        setNewImageName(getRandomImageName());  
        ServletContext servletContext = (ServletContext) FacesContext.getCurrentInstance().getExternalContext().getContext();  
        String newFileName = servletContext.getRealPath("") + File.separator + "images" + File.separator + "barca" + File.separator + getNewImageName() + ".jpg";  

        FileImageOutputStream imageOutput;  
        try {  
            imageOutput = new FileImageOutputStream(new File(newFileName));  
            imageOutput.write(croppedImage.getBytes(), 0, croppedImage.getBytes().length);  
            imageOutput.close();  
        } catch (FileNotFoundException e) {  
            e.printStackTrace();  
        } catch (IOException e) {  
            e.printStackTrace();  
        }  

        return null;  
    }  

    private String getRandomImageName() {  
        int i = (int) (Math.random() * 100000);  

        return String.valueOf(i);  
    }  

    public String getNewImageName() {  
        return newImageName;  
    }  

    public CroppedImage getCroppedImage() {
        return croppedImage;
    }

    public void setCroppedImage(CroppedImage croppedImage) {
        this.croppedImage = croppedImage;
    }

    public void setNewImageName(String newImageName) {
        this.newImageName = newImageName;
    }  

可能缺少一些库或其他配置选项吗？我刚刚下载了Primefaces 3.5的jar包并将其放入了我的类路径中。

谢谢

- Cateno Viglio

---

我有完全相同的问题。 - pasql

Answer 1

你的图片是否位于%WEBAPP_ROOT%/images/banner.jpg？

你能通过HTTP URL（浏览器）访问你的图片吗？

- zmirc

Answer 2

你是否为裁剪器设置了 initialCoords 属性："x，y，w，h"？ 你还可以设置 aspectRatio 和 minSize。

- user3410640