图片生成系统

使用教程:

测试代码：使用浏览器打开生成的URL->浏览器右键菜单->点击检查->控制台输入JS代码执行->查看结果

TM2AS系统中使用：步骤选择->浏览器操作->执行JS->填写图片生成JS代码->添加步骤

JS函数执行代码说明:

ClearScreen(width,height);//清除屏幕，重新设置宽度和高度

CreateBackText("TM2AS");//创建背景文本水印

AddBackImage("Image URL",2,style);//添加背景图片参数说明：图片地址、显示顺序（数字越大，显示越靠前）、CSS样式

MutiText("This is text",0,0,100,100,"");//添加一行或多行文本，并用\r\n分隔多行文本参数说明：文本、左边距、上边距、宽度、高度和自定义CSS代码（参数的上边距填写“-1”，表示上次绘制的文本底部为本次绘制的高度距离）

CreateFinish();//创建完成

添加一行或多行文本，并用\r\n分隔多行文本参数说明：文本、左边距、上边距、宽度、高度和自定义CSS代码（参数的上边距填写“-1”，表示上次绘制的文本底部为本次绘制的高度距离）

通过图片素材的网址可以获取背景图片的地址，通过“文字定位功能”可以获取文字所显示图片的定位区域。点击文本位置->鼠标框选择区域->将下方的位置信息复制到图片素材网中相应图片下的MutiText()函数中。

每张图片的创建代码结构如下：将其复制到生成的URL中，执行JS即可查看效果。AddBackImage()和MutiText()函数可以多次添加：

ClearScreen(800,800);

CreateBackText("TM2AS");

AddBackImage("https://aires.yocyod.com/1819250797/tmtai/asset/eshopimg/20240128/39d8dbd443137b4a.png",2);

MutiText("This is Text",30,30,730,100,"background:#000;color:#fff;padding:20px 0px;border-radius:10px;");

CreateFinish();

常用的文本自定义CSS代码，可以多个任意组合：

border:1px solid red;

border-radius:10px;

color:#ffffff; //文本颜色

background:#000000; //背景颜色

padding:10px 5px; //文本在边框上下各10个像素，左右各5个像素

font-weight: 600; //文本粗细

text-shadow: 2px 2px 1px rgba(0, 0, 0, 0.5); //文本阴影