当前位置:网站首页>用aardio写一个旋转验证码标注小工具
用aardio写一个旋转验证码标注小工具
2022-07-06 13:36:00 【Qwertyuiop2016】
需求
最近想训练旋转验证码识别的模型。标注数据是个无意义且费时间的活,而且针对旋转验证码还没有找到一个顺手的标注工具。没有那就自己写一个。
在网上看到的文章是生成360个角度的图片,找出其中方向为正的一张。生成360个角度的图片很耗时间,一张图片大概需要个一两分钟,然后再在360个图片中选择一张还挺麻烦的。
开始写代码
旋转效果
我找了很久也没看到aardio有什么可以旋转图片的库,正当我打算用aardio调用Python时,突然看到在HTML中旋转图片居然只需要给img标签加一个style="transform: rotate(0deg);"
其中的0就是旋转的角度,支持负数
也就是说旋转图片的功能我只需要用html就能实现,我只需要控制0deg中的数字,就能控制图片旋转的角度。
//截图 远程调试
import win.ui;
import web.view;
/*DSG{
{*/
var mainForm = win.form(text="旋转验证码标注";right=468;bottom=605;acceptfiles=1;bgcolor=16777215;border="thin")
mainForm.add()
/*}}*/
var wb = web.view(mainForm,,0);
wb.go('/res/1.html')
mainForm.show();
return win.loopMessage();
1.html的代码
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<style type="text/css"> .vcode-spin-faceboder {
position: relative; overflow: hidden; width: 350px; height: 350px; margin: 28px auto 24px; border: 0; -webkit-background-size: 100% 100%; background-size: 100% 100% } .vcode-spin-img {
position: relative; z-index: 999; width: 100%; height: 100%; pointer-events: none; -webkit-border-radius: 50%; border-radius: 50% } .next {
width: 50px; height: 15px; background-color: rgb(250,0,255) } </style>
<script type="text/javascript"> </script>
</head>
<body style="margin:50px">
<div class="vcode-spin-faceboder">
<img class="vcode-spin-img" src="1.jpg" style="transform: rotate(0deg);">
<button id="next" class="next"></button>
</div>
</body>
</html>
效果:
修改html标签属性
// 180就是旋转的角度
var js = string.format(`this.setAttribute("style", "transform: rotate(%ddeg);");`, 180);
// 100为timeout时间,单位毫秒, 前面是css选择器
wb.waitEle(".vcode-spin-img", js, 100);
如果改成js的写法:
var inp = document.getElementsByClassName("vcode-spin-img");
inp.setAttribute("type", "transform: rotate(180deg);");
加个滑动条
我想通过滑动滑动条的位置来控制图片旋转的角度。首先界面控件里选择跟踪条,刻度的话0-359, 后面我改成了(-179-180)。不过库代码里说不能用负数,我试了负数也没问题,就不理他了
// 指定滑动条最大刻度
mainForm.trackbar.max=359;
// 指定滑动条最小刻度
mainForm.trackbar.min=0;
// 指定滑动条当前刻度
mainForm.trackbar.pos=0;
加入滑动条逻辑
效果:
mainForm.trackbar.onnotify = function(id,code,ptr){
if(code==0xFFFFFFF4){
var js = string.format(`this.setAttribute("style", "transform: rotate(%ddeg);");`, mainForm.trackbar.pos);
wb.waitEle(".vcode-spin-img", js, 100);
}
}
保存
旋转正了,要将旋转后的图片保存。目前想到了两种方法,第一种直接截图当前软件的界面,会把按钮什么的也截进去。后面再做一下处理就行。因为界面的大小是不变的,只需要剪切指定部分的图
var picture = gdip.snap(mainForm.hwnd);
// filename是文件路径,100是文件质量(0-100),仅针对jpg格式
picture.save(filename,100);
第二种则是网页截图,因为界面是基于浏览器的。所以也可以支持devtools protocol协议
第一步:打开远程控制端口
var ws = wb.openRemoteDebugging()
ws.Runtime.enable();
第二步:获取图片控件在网页的位置(x, y和width, height)。用js的方法就可以,然后执行js获取返回值。不截img标签,而是截外层的div。因为外层的div是固定大小的。截img的话大小会变化
// 在aardio中引号是可以换行的
js = '(function(){
var a = document.querySelector(".vcode-spin-faceboder").getBoundingClientRect();
return a.toJSON();
})()'
执行js
ws.Runtime.evaluate(expression=js, awaitPromise=true,returnByValue=true).end = function(result, err){
console.dump(result);
var clip = {
scale=1;x=result.left+pageX;y=result.top+pageY;width=result.width;height=result.height};
}
pageX和pageY获取(为什么要加这个我也不清楚,我看的pyppeteer源码加了这个),实际获取的值也是0,0所以加不加无所谓
var pageX,pageY;
ws.Page.getLayoutMetrics().end = function(result, err){
pageX = result[["layoutViewport"]].pageX
pageY = result[["layoutViewport"]].pageY
}
针对控件截图,实际也就是全屏截图,然后给个x,y加宽高剪切一下
ws.Page.captureScreenshot(clip=clip).end = function(result,err){
if(result[["data"]]){
var bin = crypt.decodeBin(result[["data"]]);
string.save("\1.PNG", bin )
}
}
增加一些按钮
最终效果:
使用说明
滑动条右边的0表示,旋转的角度(滑动条的当前刻度)。这个控件是编辑框,可以修改这个角度,然后点击旋转就可以旋转指定的角度
下面的1表示当前指定文件夹的第几张图片,需要先按选择按钮选择有旋转图片的文件夹,向前和向后则是选择文件夹的上一张图片和下一张图片(会循环)
保存按钮则是保存已经标注好的图片到文件夹下(无法指定文件夹,是在当前文件夹创建了一个result,文件名为1.jpg,1表示第几张图片)
其中一直想用aardio写一些工具,后面说一些怎么用aardio打包Python。
完整代码和软件
https://github.com/kanadeblisst/rotate_qrcode_label
边栏推荐
- document. Usage of write () - write text - modify style and position control
- Redistemplate common collection instructions opsforset (V)
- Digital transformation takes the lead to resume production and work, and online and offline full integration rebuilds business logic
- Sparkshuffle process and Mr shuffle process
- 中国白酒的5场大战
- [go][reprint]vscode run a HelloWorld example after configuring go
- [in depth learning] pytorch 1.12 was released, officially supporting Apple M1 chip GPU acceleration and repairing many bugs
- ACdreamoj1110(多重背包)
- Technology sharing | packet capturing analysis TCP protocol
- JS according to the Chinese Alphabet (province) or according to the English alphabet - Za sort &az sort
猜你喜欢
C how to set two columns comboboxcolumn in DataGridView to bind a secondary linkage effect of cascading events
3D face reconstruction: from basic knowledge to recognition / reconstruction methods!
Why does MySQL index fail? When do I use indexes?
C# 如何在dataGridView里设置两个列comboboxcolumn绑定级联事件的一个二级联动效果
Quick news: the flybook players' conference is held online; Wechat payment launched "education and training service toolbox"
Summary of cross partition scheme
Tiktok will push the independent grass planting app "praiseworthy". Can't bytes forget the little red book?
[sliding window] group B of the 9th Landbridge cup provincial tournament: log statistics
Internet News: Geely officially acquired Meizu; Intensive insulin purchase was fully implemented in 31 provinces
50 commonly used numpy function explanations, parameters and usage examples
随机推荐
Divide candy
华为在多个行业同时出击,吓人的技术让欧美企业瑟瑟发抖
Yuan Xiaolin: safety is not only a standard, but also Volvo's unchanging belief and pursuit
PostgreSQL 安装gis插件 CREATE EXTENSION postgis_topology
El table table - get the row and column you click & the sort of El table and sort change, El table column and sort method & clear sort clearsort
1292_ Implementation analysis of vtask resume() and xtask resume fromisr() in freeros
红杉中国,刚刚募资90亿美元
Replace Internet TV set-top box application through digital TV and broadband network
R语言做文本挖掘 Part4文本分类
Reinforcement learning - learning notes 5 | alphago
Happy sound 2[sing.2]
JS learning notes OO create suspicious objects
MySQL - transaction details
14 years Bachelor degree, transferred to software testing, salary 13.5k
ROS error: could not find a package configuration file provided by "move_base“
guava:创建immutableXxx对象的3种方式
JS method to stop foreach
Quick news: the flybook players' conference is held online; Wechat payment launched "education and training service toolbox"
SDL2来源分析7:演出(SDL_RenderPresent())
FZU 1686 龙之谜 重复覆盖