2

我想用 JSF(primefaces)绘制图像并在图像上绘制一些叠加层(矩形)。图像应该可调整大小,但必须保持图像比例,并且叠加层也应该缩放。

我试过了:

<pe:layout id="fullPage" options="#{myManagedBean.layoutOptions}" fullPage="true" widgetVar="fpLayoutWidget">

        <pe:layoutPane position="west" resizeWhileDragging="true" closable="false" resizable="true"
            styleContent="overflow: auto;">

            <!-- canvas id="imagecanvasid" style="border: red solid; width: 100%; height: auto; overflow: hidden; margin: 0 !important; padding: 0 !important;" /-->
            <div id="imageContainer" style="max-height: 100%;">
                <p:graphicImage id="imageid" value="#{myManagedBean.image}" style="max-height: 100%; max-width: 100%; position: absolute;" />
            </div>

            <pe:imageAreaSelect id="areaSelect" for="imageid" handles="false" show="false" hide="true"  
                autoHide="true" movable="false" persistent="false" resizable="false">  
                <p:ajax event="selectEnd" listener="#{myManagedBean.selectCoords}" />  
            </pe:imageAreaSelect>  

    </pe:layoutPane>

当 div 工作时,我无法获得叠加层的缩放。我尝试在图像大小更改并调整 div 大小时注册一个侦听器,但是当 div 更新时存在延迟。欢迎任何想法。

4

0 回答 0