用js控制图片额大小。主要是修改图片的宽度和高度。下面是简单的代码实现：
HTML 代码：
<img src='../1.jgp' id='img' />这个时候img的图片自身是多大，就会显示多大。100px*100px的图。
js代码：
var oImg = document.getElementById('img')oImg.width = '50px' //当给img标签的宽度设置为50px后，高度会自动按比例缩小。
oImg.width = '200px' //当给img标签的宽度设置为200px后，高度会自动按比例扩大。
图片按比例缩放function DrawImage(Img,WIDTH,HEIGHT){
var image=new Image()
image.src=Img.src
width=WIDTH//预先设置的所期望的宽的值
height=HEIGHT//预先设置的所期望的高的值
if(image.width>width||image.height>height){//现有图片只有宽或高超了预设值就进行js控制
w=image.width/width
h=image.height/height
if(w>h){//比值比较大==>宽比高大
//定下宽度为width的宽度
Img.width=width
//以下为计算高度
Img.height=image.height/w
}else{//高比宽大
//定下宽度为height高度
img.height=height
//以下为计算高度
Img.width=image.width/h
}
}
}
<img src="xxxx" onload=javascript:DrawImage(this,290,215)>
手机体验地址： http://114.67.68.76:8080/roc/imgDist/github地址： https://github.com/lijibing01/picture_edit
1、引入dist文件夹下的ped.js
2、new window.PED.imageInfo(url,saveFn)
1、可以双指放大缩小图片
2、可以在图片上进行涂鸦
2、可以输入文字，输入文字后可以单指移动文字在图片上的位置
3、可以撤回涂鸦的内容，不能撤回文字，文字编辑功能还未实现
1、npm install
2、npm run build
欢迎star
