系统、网站、API站点,简单高效开发

平台介绍 >> js/jsfun/clsImg 图片相关操作

js/jsfun/clsImg 图片相关操作

    //图片工具
    //载入图片资源
    let imgFile = fnJsa_jsCodePath() + "/demoresource/images/a.png"
    let image = fnImage_imageFromFile(imgFile)
    //图片尺寸
    console.log("图片尺寸:", fnImage_imageSize(imgFile))

    //初始化实例,从图片载入
    let imgFile0 = fnJsa_jsCodePath() + "/demoresource/images/a.png"
    let img0 = new clsImage(imgFile0)
    //保存PNG图片
    img0.imgSavePNG(fnJsa_jsCodePath() + "/demoresource/images/a_2.png")


    //初始化实例,新建画板
    let img = new clsImage(700, 1200, "#FF00000")
    //重置画板底色
    img.imgClear("#cccbcb")
    //画图片到画板
    img.imgDrawImage(image, 20, 20)
    //画实心矩形
    img.imgDrawRectangle(50, 50, 100, 50, "#C0C0C0")
    //画空心矩形
    img.imgDrawRectangle(200, 50, 100, 50, "#C0C0C0", 2)
    //画圆角实心矩形
    img.imgDrawRoundedRectangle(350, 50, 100, 50, 5, "#C0C0C0")
    //画圆角空心矩形
    img.imgDrawRoundedRectangle(500, 50, 100, 50, 5, "#C0C0C0", 2)

    //画实心圆
    img.imgDrawCircle(100, 180, 50, "#C0C0C0")
    //画空心圆
    img.imgDrawCircle(220, 180, 50, "#C0C0C0", 2)
    //画实心椭圆
    img.imgDrawEllipse(370, 180, 80, 50, "#c0c0c0")
    //画空心椭圆
    img.imgDrawEllipse(550, 180, 80, 50, "#c0c0c0", 3)
    //画直线
    img.imgDrawLine(50, 50, 500, 200, "#00FF00", 3)
    //画实心多边形
    img.imgDrawRegularPolygon(3, 100, 300, 50, 0, "#C0C0C0", 0)
    img.imgDrawRegularPolygon(6, 220, 300, 50, 0, "#C0C0C0", 0)
    //画空心多边形
    img.imgDrawRegularPolygon(3, 350, 300, 50, 0, "#C0C0C0", 4)
    img.imgDrawRegularPolygon(6, 480, 300, 50, 0, "#C0C0C0", 4)

    //写文字
    img.imgDrawString("ABC,我是中国人,ABC,我是中国人,ABC,我是中国人,ABC,我是中国人,ABC,我是中国人,ABC,我是中国人,ABC,我是中国人,"
        , 50, 400, 0, 0, "#FFFF00", fnJsa_jsCodePath() + "/demoresource/font/simfang.ttf", 30)
    //自动换行
    img.imgDrawStringWrapped("ABC,我是中国人 ,ABC,我是中 国人,ABC ,我是中国 人,,"
        , 50, 500, 0, 0, 500, 1.5, "#FFFF00", 25, fnJsa_jsCodePath() + "/demoresource/font/simfang.ttf")

    //旋转、缩放、倾斜等需要创建两个画板。
    //创建临时画板,得到image资源
    let tmpImgRotate0 = new clsImage(200, 200)
    let tmpImgRotate1 = new clsImage(200, 200)
    // tmpImg.imgDrawRectangle(0,0,80,30,"#FF00FF")
    tmpImgRotate0.imgDrawString("123456789", 30, 30, 0, 0, "#0033ff", fnJsa_jsCodePath() + "/demoresource/font/simfang.ttf", 30)
    let tmpImageRotate = tmpImgRotate0.imgImage()

    //旋转
    tmpImgRotate1.imgRotate(0, tmpImageRotate, 100, 100)
    tmpImgRotate1.imgRotate(0.1, tmpImageRotate, 100, 100)
    tmpImgRotate1.imgRotate(0.2, tmpImageRotate, 100, 100)
    tmpImgRotate1.imgRotate(0.3, tmpImageRotate, 100, 100)
    tmpImgRotate1.imgRotate(0.4, tmpImageRotate, 100, 100)
    tmpImgRotate1.imgRotate(0.5, tmpImageRotate, 100, 100)
    tmpImgRotate1.imgRotate(0.6, tmpImageRotate, 100, 100)
    tmpImgRotate1.imgRotate(0.7, tmpImageRotate, 100, 100)
    tmpImgRotate1.imgRotate(0.8, tmpImageRotate, 100, 100)
    tmpImgRotate1.imgRotate(0.9, tmpImageRotate, 100, 100)
    tmpImgRotate1.imgRotate(1, tmpImageRotate, 100, 100)
    //将旋转的结果画到画板
    img.imgDrawImage(tmpImgRotate1.imgImage(), 200, 600)

    //缩放
    let tmpImgScale0 = new clsImage(400, 50)
    let tmpImgScale1 = new clsImage(400, 200)
    // tmpImg.imgDrawRectangle(0,0,80,30,"#FF00FF")
    tmpImgScale0.imgDrawString("123456789", 30, 30, 0, 0, "#FFFF00", fnJsa_jsCodePath() + "/demoresource/font/simfang.ttf", 30)
    let _scale = tmpImgScale0.imgImage()
    //执行缩放
    tmpImgScale1.imgScale(0.8, 0.8, _scale, 0, 0)
    tmpImgScale1.imgScale(2, 2, _scale, 50, 0)
    img.imgDrawImage(tmpImgScale1.imgImage(), 20, 800)

    //倾斜
    // img.imgShear(20,40,tmpImage,300,800)
    let tmpImgShear0 = new clsImage(50, 20)
    let tmpImgShear1 = new clsImage(800, 600, "#000000")
    // tmpImg.imgDrawRectangle(0,0,80,30,"#FF00FF")
    tmpImgShear0.imgDrawRectangle(0, 0, 50, 20, "#FFFF00")
    let _shear = tmpImgShear0.imgImage()
    //执行倾斜,当倾斜倍数都为1时,会为空
    tmpImgShear1.imgShear(0, 0, _shear, 0, 0)
    tmpImgShear1.imgShear(0, 1, _shear, 100, 0)
    tmpImgShear1.imgShear(1, 0, _shear, 200, 0)
    tmpImgShear1.imgShear(0.8, 0.8, _shear, 300, 0)
    img.imgDrawImage(tmpImgShear1.imgImage(), 20, 900)

    //保存成PNG图片
    img.imgSavePNG(fnJsa_jsCodePath() + "/demoresource/images/b.png")

备案号:闽ICP备20003806号     厦门市湖里区陈朝能网络技术工作室