[英]Zooming an image on GWT on a certain spot
有沒有一種方法可以在特定位置放大GWT圖像。 就像在Google地圖上一樣。 如果在鼠標指針所在的部分上滾動,圖像將在該位置放大。 非常感謝你!
這可以解決問題。 基於此JS響應 。 完整的源代碼在這里 。
EventType.bind(document, wheel, new EventCallbackFn<WheelEvent>() {
double[] pos = {0, 0};
double scale = 1;
@Override
public void onEvent(WheelEvent ev) {
ev.preventDefault();
// cap the delta to [-1,1] for cross browser consistency
double delta = Math.max(-1, Math.min(1, ev.deltaY / 200.));
// determine the point on where the img is zoomed in
double[] zoomTarget = {(ev.pageX - pos[0]) / scale, (ev.pageY - pos[1]) / scale};
// calculate zoom and x and y based on it
scale = Math.max(.1, Math.min(10, scale + delta * scale));
pos[0] = -zoomTarget[0] * scale + ev.pageX;
pos[1] = -zoomTarget[1] * scale + ev.pageY;
target.style.transform = "translate(" + pos[0] + "px ," + pos[1] + "px) scale(" + scale + ")";
}
});
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.