【问题标题】:How to change the size of image with given new height and width using java?java - 如何使用给定的新高度和宽度更改图像的大小?
【发布时间】:2014-06-18 12:06:46
【问题描述】:

这是我的 demo.jsp 页面,我有两个字段来提供新的高度和宽度,以使用新的更改上传的图像大小。有人可以告诉我该怎么做吗?

<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>ImageSizeModification</title>
    <script>
        function ImageResizer() {
            console.log('called');
            var srcImg = document.getElementById("imgID").value;
            var newImg = new Image();
            newImg.src = srcImg;
            var height = newImg.height;
            var width = newImg.width;
            var newWidth = document.getElementById("widthID").value;
            var newHeight = document.getElementById("HeightID").value;
            console.log(newImg, srcImg, newWidth, newHeight, height, width);
        }
    </script>
</head>
<body>
    <%
        out.println("<table>");
        out.println("<tr><td><input type='file' id='imgID'></td></tr>");
        out.println("<tr><td>Enter new Width:</td><td><input type='text' id='widthID'></td></tr>");
        out.println("<tr><td>Enter new Height:</td><td><input type='text' id='HeightID'></td></tr>");
        out.println("<tr><td><input type='button' value='Submit' onclick='ImageResizer()'></td></tr>");
        out.println("</table>");
    %>
</body>

【问题讨论】:

    标签: java javascript jsp image-uploading image-resizing


    【解决方案1】:
    document.getElementById("imgID").style.height =  parseInt(newWidth) ;
    document.getElementById("imgID").style.width =  parseInt(newHeight) ;
    

    在控制台日志前添加以上两行。

    或使用 Jquery

    $('#imgID').width(700); 
    $('#imgID').height(700);
    

    【讨论】:

      【解决方案2】:

      如果我理解正确,您要做的是在浏览器中调整图像的大小,以便将较小的文件上传到您的服务器。如果是这样,这不是 Java/JSP 问题,而是 Javascript 问题。

      This post 讨论了如何使用 javascript 库来做到这一点,我认为可能会解决您的问题。

      【讨论】:

        【解决方案3】:

        你不能单独使用 jsp 来做,你需要创建一个 servlet 通过 Inputstream 获取图像通过任何图像处理 api 操作它并将其写入响应。 Imgscalr 是一个易于使用的 api。您可以参考这个link 示例和说明

        【讨论】:

          猜你喜欢
          • 1970-01-01
          • 2021-12-24
          • 2017-11-27
          • 1970-01-01
          • 2014-05-18
          • 1970-01-01
          • 2021-05-06
          相关资源
          最近更新 更多