CN111428683A - 一种基于tensorflow的web前端图像合成方法 - Google Patents
一种基于tensorflow的web前端图像合成方法 Download PDFInfo
- Publication number
- CN111428683A CN111428683A CN202010283314.2A CN202010283314A CN111428683A CN 111428683 A CN111428683 A CN 111428683A CN 202010283314 A CN202010283314 A CN 202010283314A CN 111428683 A CN111428683 A CN 111428683A
- Authority
- CN
- China
- Prior art keywords
- face
- acquiring
- canvas
- coordinates
- point
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Pending
Links
- 238000001308 synthesis method Methods 0.000 title claims abstract description 8
- 238000000034 method Methods 0.000 claims abstract description 23
- 230000015572 biosynthetic process Effects 0.000 claims abstract description 18
- 238000001514 detection method Methods 0.000 claims abstract description 18
- 238000003786 synthesis reaction Methods 0.000 claims abstract description 18
- 210000004709 eyebrow Anatomy 0.000 claims description 25
- 210000003128 head Anatomy 0.000 claims description 20
- 238000005034 decoration Methods 0.000 claims description 5
- 230000001815 facial effect Effects 0.000 claims description 5
- 238000004458 analytical method Methods 0.000 claims description 4
- 238000010422 painting Methods 0.000 claims description 3
- 238000006243 chemical reaction Methods 0.000 claims description 2
- 238000005516 engineering process Methods 0.000 abstract description 7
- 238000013527 convolutional neural network Methods 0.000 abstract description 6
- 238000004364 calculation method Methods 0.000 abstract description 5
- 238000013473 artificial intelligence Methods 0.000 description 3
- 230000006870 function Effects 0.000 description 3
- 210000004373 mandible Anatomy 0.000 description 3
- 238000007620 mathematical function Methods 0.000 description 2
- 238000012986 modification Methods 0.000 description 2
- 230000004048 modification Effects 0.000 description 2
- 238000004422 calculation algorithm Methods 0.000 description 1
- 239000002131 composite material Substances 0.000 description 1
- 238000013135 deep learning Methods 0.000 description 1
- 238000010586 diagram Methods 0.000 description 1
- 230000000694 effects Effects 0.000 description 1
- 238000011156 evaluation Methods 0.000 description 1
- 210000001847 jaw Anatomy 0.000 description 1
- 230000002194 synthesizing effect Effects 0.000 description 1
Images
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06V—IMAGE OR VIDEO RECOGNITION OR UNDERSTANDING
- G06V40/00—Recognition of biometric, human-related or animal-related patterns in image or video data
- G06V40/10—Human or animal bodies, e.g. vehicle occupants or pedestrians; Body parts, e.g. hands
- G06V40/16—Human faces, e.g. facial parts, sketches or expressions
- G06V40/161—Detection; Localisation; Normalisation
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06T—IMAGE DATA PROCESSING OR GENERATION, IN GENERAL
- G06T11/00—2D [Two Dimensional] image generation
- G06T11/60—Editing figures and text; Combining figures or text
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06V—IMAGE OR VIDEO RECOGNITION OR UNDERSTANDING
- G06V40/00—Recognition of biometric, human-related or animal-related patterns in image or video data
- G06V40/10—Human or animal bodies, e.g. vehicle occupants or pedestrians; Body parts, e.g. hands
- G06V40/16—Human faces, e.g. facial parts, sketches or expressions
- G06V40/168—Feature extraction; Face representation
- G06V40/171—Local features and components; Facial parts ; Occluding parts, e.g. glasses; Geometrical relationships
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06V—IMAGE OR VIDEO RECOGNITION OR UNDERSTANDING
- G06V40/00—Recognition of biometric, human-related or animal-related patterns in image or video data
- G06V40/10—Human or animal bodies, e.g. vehicle occupants or pedestrians; Body parts, e.g. hands
- G06V40/16—Human faces, e.g. facial parts, sketches or expressions
- G06V40/172—Classification, e.g. identification
Landscapes
- Engineering & Computer Science (AREA)
- Health & Medical Sciences (AREA)
- Oral & Maxillofacial Surgery (AREA)
- General Health & Medical Sciences (AREA)
- Physics & Mathematics (AREA)
- General Physics & Mathematics (AREA)
- Theoretical Computer Science (AREA)
- Human Computer Interaction (AREA)
- Multimedia (AREA)
- Computer Vision & Pattern Recognition (AREA)
- Image Processing (AREA)
Abstract
本发明涉及一种基于tensorflow的web前端图像合成方法，属于信息安全技术领域。本发明提供一种基于人脸识别技术实现的可以直接在浏览器运行的，它主要运用一个构建在tensorflow.js core上的javascript模块‑‑face‑api.js，在web前端实现了一种在浏览器中通过人脸检测、人脸识别和人脸特征检测三种CNNs技术进行图像合成的方案。本方案通过特征点识别、计算等进行图像合成的实现方案，能够简化开发流程、降低延迟及保护隐私等。
Description
技术领域
本发明属于Web前端和人工智能技术领域，具体涉及一种基于tensorflow的web前端图像合成方法。
背景技术
随着深度学习方法的应用，浏览器调用人脸识别技术也得到了更广泛的应用与提升。在实际应用过程中具有其特有的优势，不仅不需要安装任何库或驱动程序，没有任何外部依赖关系，而且所有数据都保留在客户端上，可以实现低延迟及隐私保护程序，还可以在GPU可用时加速代码。
发明内容
(一)要解决的技术问题
本发明要解决的技术问题是：如何提供一种web前端图像合成方法，用以简化开发流程、降低延迟及保护隐私。
(二)技术方案
为了解决上述技术问题，本发明提供了一种基于tensorflow的web前端图像合成方法，包括以下步骤：
一、初始化
1)加载构建在tensorflow.js core上的javascript模块，即face-api.js；
2)基于步骤1)加载人脸检测模型；
3)基于步骤1)加载脸部特征点模型；
二、基于步骤一加载的人脸检测模型、脸部特征点模型进行人脸识别，进行全脸识别操作后，得到一个数据集，把当前的数据进行一个转换，让它的数据匹配特定的大小；
三、基于步骤二处理后的图像获取脸部信息数据；
四、基于步骤三中步骤8中步骤3)进行图片合成。
优选地，步骤三具体是：从API直接获取或通过计算得到脸部有用信息点的坐标，将图像抽取到坐标系进行分析处理：
(1)、获取组成左眉毛的点；
(2)、获取组成右眉毛的点；
(3)、获取组成脸轮廓的点；
(4)、基于步骤(1)、步骤(2)获取眉心的点：
1)基于步骤(1)获取左眉毛中间的点；
2)基于步骤(2)获取右眉毛中间的点；
3)基于步骤三中步骤1)、2)获取眉心的点；根据两点之间距离公式，由左眉毛中间的点和右眉毛中间的点计算眉心的点坐标；
(5)、基于步骤(3)获取下颌的点；
(6)、基于步骤(4)中步骤3)获取脸的倾斜弧度由脸中线和y轴的夹角计算脸的倾角度；
(7)、基于步骤(4)中步骤3)以及步骤(5)获取头顶的坐标：
1)获取线斜率，根据斜率公式，基于步骤(4)中步骤3)以及步骤(5)由眉心的点坐标和下颚点坐标计算斜率；
2)获取眉心到下颌的距离，根据点到直线的距离公式，基于步骤(4)中步骤3)以及步骤(5)由眉心的点坐标和下颚点坐标计算两点间的距离；
3)基于步骤(7)中步骤1)、步骤(7)中步骤2)获取头顶的坐标；
(8)、获取脸大小信息：
1)基于步骤(3)获取脸宽；
2)基于步骤(4)中步骤3)、步骤(5)获取脸长；
3)基于步骤(3)中步骤4)、步骤(5)、步骤(6)、步骤(7)中步骤3)、步骤(8)中步骤1)、步骤(8)中步骤2)得到脸部信息数据集。
优选地，由步骤三得到的脸部信息数据集确定了配饰物的佩戴位置，及配饰物的宽度和倾斜度，配饰物是要与人脸合成的目标图片物；
步骤四具体为基于步骤三中步骤(8)中步骤3)的头顶坐标确定配饰物中心点位置，基于步骤三中步骤(8)中步骤3)的脸宽确定配饰物的宽度，基于步骤三中步骤(8)中步骤3)的脸的倾斜角度确定配饰物的偏转角度，然后采用画布进行图片合成，即首先把头像绘制到画布上，然后将配饰物绘制在同一张画布上的指定位置。
优选地，步骤四的具体实现方式如下：
(1)、创建一个画布；
(2)、基于步骤三中步骤(8)中步骤3)中得到的脸部信息数据集初始化画布信息；
(3)、基于步骤二匹配的数据进行人脸识别描边；
(4)、基于经步骤四中步骤(2)初始化后得到的画布创建画笔；
(5)、基于步骤四中步骤(1)创建的画布指定合成图片显示位置：在创建的画布上清空一个矩形框用来画图；
(6)、基于步骤四中步骤(2)绘制人脸图片；
(7)、基于步骤三中步骤(8)中步骤3)绘制配饰物并优化。
优选地，步骤四中步骤(7)具体是基于步骤三中步骤(8)中步骤3)的头顶坐标确定配饰物中心点位置，基于步骤三中步骤(8)中步骤3)的脸宽确定配饰物的宽度，基于步骤三中步骤(8)中步骤3)的脸的倾斜角度确定配饰物的偏转角度。
优选地，步骤四中步骤(7)的具体实现方式图片加载完成后立即执行以下操作：
1)保存当前画布状态：
2)基于步骤三中步骤(8)中步骤3)的头顶坐标确定配饰物中心点位置，将画布原点移动到头顶的位置；
3)基于步骤三中步骤(8)中步骤3)的脸的倾斜角度旋转画布确定配饰物的偏转角度；
4)基于步骤四的步骤(2)偏移图片，使配饰物中心刚好在原点；
5)画配饰物：
6)图片合成完成，还原画布；
到此为止实现了在目标人脸图片上合成配饰物。
优选地，步骤一中加载的人脸检测模型和脸部特征点模型为SSD模型。
优选地，所述配饰物为帽子。
优选地，所述配饰物为皇冠。
优选地，所述配饰物为花环。
(三)有益效果
本发明提供一种基于人脸识别技术实现的可以直接在浏览器运行的，它主要运用一个构建在tensorflow.js core上的javascript模块--face-api.js，在web前端实现了一种在浏览器中通过人脸检测、人脸识别和人脸特征检测三种CNNs(卷积神经网络)技术进行图像合成的方案。本方案通过特征点识别、计算等进行图像合成的实现方案，能够简化开发流程、降低延迟及保护隐私等。
附图说明
图1为本发明中获取脸部信息数据及图片合成过程示意图。
具体实施方式
为使本发明的目的、内容、和优点更加清楚，下面结合附图和实施例，对本发明的具体实施方式作进一步详细描述。
本发明提供的一种基于tensorflow的web前端图像合成方法包括以下步骤：
二、初始化
face-api.js针对人脸检测工作实现了一个SSD(Single Shot MultiboxDetector)算法，它本质上是一个基于MobileNetV1的卷积神经网络(CNN)，旨在获得高精度检测边界框。这个模型主要计算每张脸在图像中的位置，并返回边界框以及每个脸的检测概率。本发明将借助这个简单的卷积神经网络获取图片中的人脸特征点。
4)加载face-api.js
<script src＝’face-api.js’></script>
5)基于步骤1)加载人脸检测模型
await faceapi.nets.ssdMobilenetv1；
6)基于步骤1)加载脸部特征点模型
await faceapi.loadFaceLandmarkModel('/')；
三、基于步骤一加载的人脸检测模型、脸部特征点模型进行人脸识别
const results＝awaitfaceapi.detectSingleFace(inputImg).withFaceLandmarks()
其中：detectSingleFace用来获取单个人脸盒子信息，withFaceLandmarks用来获取脸部各种特征点。，然后借助步骤一中加载的人脸检测模型和脸部特征点模型(SSD模型)进行全脸识别操作后，得到一个数据集[{detection:{...}，landmarks：{...}]，
其中：detection提供了一个人脸部的盒子信息(如宽高)，landmarks提供了获取脸部各种特征点(如眉毛，鼻子，脸轮廓等)的方法。由于得到的数据是根据图片的真实数据来处理的，但是在网页展示的图片通常不会是1:1的实际图片，需将图片进行缩放或扩大处理。
把当前的数据进行一个转换，让它的数据匹配特定的大小：const resizedResult＝faceapi.resizeResults(results,inputImg)；
四、基于步骤二处理后的图像获取脸部信息数据
从API直接获取或通过计算得到脸部有用信息点的坐标，将图像抽取到坐标系进行分析处理：
1.获取组成左眉毛的点(leftEyeBrowPoints)：
const leftEyeBrowPoints＝landmarks.getLeftEyeBrow()；
2.获取组成右眉毛的点(rightEyeBrowPoints)：
const rightEyeBrowPoints＝landmarks.getRightEyeBrow()；
3.获取组成脸轮廓的点(outlinePoints)：
const outlinePoints＝landmarks.getJawOutline()；
4.基于步骤1、步骤2获取眉心的点：
1)基于步骤1获取左眉毛中间的点(leftEyeBrowMidPoint):如图1(①)
const leftEyeBrowMidPoint＝leftEyeBrowPoints[Math.floor(leftEyeBrowPoints.length/2)]
其中：Math.floor是一个浮点数向下取整的数学函数，返回一个小于或等于给定数字的最大值。
2)基于步骤2获取右眉毛中间的点(rightEyeBrowMidPoint):如图1(②)
const rightEyeBrowMidPoint＝rightEyeBrowPoints[Math.floor(rightEyeBrowPoints.length/2)]
3)基于步骤1)、2)获取眉心的点(midPointOfEyebrows):如图1(③)
根据两点之间距离公式，由左眉毛中间的点和右眉毛中间的点计算眉心的点坐标如下：
const midPointOfEyebrows＝{x：(leftEyeBrowMidPoint.x+rightEyeBrowMidPoint.x)/2,y:(leftEyeBrowMidPoint.y+rightEyeBrowMidPoint.y)/2}
5.基于步骤3获取下颌的点(jawPos):如图1(④)
const jawPos＝outlinePoints[Math.floor(outlinePoints.length/2)]，
6.基于步骤4中步骤3)获取脸的倾斜弧度(angle)如图1(⑤)由脸中线(眉心到下颌)和y轴的夹角计算脸的倾角度，是一个斜弧度值。
const angle＝Math.PI-Math.atan2(jawPos.x-midPointOfEyebrows.x,jawPos.y-midPointOfEyebrows.y)；
其中：Math.atan2是一个利用斜率算角度的数学函数，返回一个-PI到PI的弧度值，是一个逆时针角度。
7.基于步骤4中步骤3)以及步骤5获取头顶的坐标
本发明依据一个很重要的概念叫三庭五眼，即正常人的发际线到眉骨的距离是眉骨到下颌距离的一半，由此通过获取眉毛的坐标和下颌的坐标来计算出头顶的位置。
1)获取线斜率(k)：如图1(⑥)
根据斜率公式，基于步骤4中步骤3)以及步骤5由眉心的点坐标和下颚点坐标计算斜率如下：
注：由于Canvas默认坐标系的结构和数学中的不完全一致，将它逆时针旋转90度可以发现它的x,y轴跟数学坐标系是相反的，因此为了方便，在代入公式计算的时候把x，y进行调换。
const k＝(midPointOfEyebrows.x-jawPos.x)/(midPointOfEyebrows.y-jawPos.y)
2)获取眉心到下颌的距离(distanceOfEye2Jaw)：如图1(⑦)根据点到直线的距离公式，基于步骤4中步骤3)以及步骤5由眉心的点坐标和下颚点坐标计算两点间的距离如下：
const distanceOfEye2Jaw＝Math.sqrt(Math.pow(midPointOfEyebrows.x-jawPos.x,2)+Math.pow(midPointOfEyebrows.y-jawPos.y,2))
3)基于步骤7中步骤1)、步骤7中步骤2)获取头顶的坐标(headPos)如图1(⑧)
发际线到眉心的距离：d＝distanceOfEye2Jaw/2；
y＝-Math.sqrt((d*d)/(1+k*k))+midPointOfEyebrows.y；
x＝k*(y-midPointOfEyebrows.y)+midPointOfEyebrows.x；
const headPos＝{x,y}
8.获取脸大小信息
1)基于步骤3获取脸宽(faceWidth)：如图1(⑨)
a＝outlinePoints[0]
b＝outlinePoints[outlinePoints.length-1]
const faceWidth＝Math.sqrt(Math.pow(a.x-b.x,2)+Math.pow(a.y-b.y,2))
其中：Math.sqrt为平方根函数，Math.pow为幂函数。
2)基于步骤4中步骤3)、步骤5获取脸长(faceLength)(注：按照三停五眼)：如图1(⑩)；
const faceLength＝(5*Math.sqrt(Math.pow(jawPos.x-midPointOfEyebrows.x,2)+Math.pow(jawPos.y-midPointOfEyebrows.y,2)))/3
3)基于步骤3中步骤4)、步骤5、步骤6、步骤7中步骤3)、步骤8中步骤1)、步骤8中步骤2)得到脸部信息数据集(info)
const info＝{
midPointOfEyebrows(眉心点坐标)，
jawPos(下颚点坐标)，
angle(脸的倾斜角度)，
headPos(头顶坐标)，
faceWidth(脸宽)，
faceLength(脸长)
}
五、基于步骤三中步骤8中步骤3)进行图片合成
由步骤三得到的脸部信息数据集确定了“配饰物”(“配饰物”即要与人脸合成的目标图片物，如帽子、皇冠、花环等，如图1
)的佩戴位置，及“配饰物”的宽度和倾斜度。具体为基于步骤三中步骤8中步骤3)的头顶坐标确定“配饰物”中心点位置，基于步骤三中步骤8中步骤3)的脸宽确定“配饰物”的宽度，基于步骤三中步骤8中步骤3)的脸的倾斜角度确定“配饰物”的偏转角度。然后采用Canvas进行图片合成，即首先把头像绘制到Canvas画布上，然后将“配饰物”绘制在同一张画布上的指定位置即可，具体实现如下：
1.创建一个画布(canvas)：
<canvas id＝"overlay"></canvas>
const canvas＝document.getElementById('overlay')；
2.基于步骤三中步骤8中步骤3)中得到的脸部信息数据集初始化画布信息：
const options＝{
info,
width＝200,
height＝200,
imgSrc＝″
}
其中，info为脸部数据集，width为画布宽度，height为画布高度，imgSrc为待合成的目标人脸图片地址。
3.基于步骤二匹配的数据进行人脸识别描边：
faceapi.draw.drawFaceLandmarks(canvas,resizedResult)
4.基于经步骤四中步骤2初始化后得到的画布创建画笔(ctx)：
const ctx＝canvas.getContext('2d')；
5.基于步骤四中步骤1创建的画布指定合成图片显示位置：
在创建的canvas画布上清空一个矩形框用来画图。
ctx.clearRect(0,0,width,height)；
6.基于步骤四中步骤2绘制人脸图片：
const img＝new Image()；
img.src＝targetSrc；
img.onload＝()＝>ctx.drawImage(img,0,0,width,height))；
其中，targetSrc为待合成的目标人脸图片地址，img.onload事件表示在图片加载完成后立即执行。
7.基于步骤三中步骤8中步骤3)绘制“配饰物”并优化
由于Canvas中没办法直接旋转图片，只能旋转画布。先让Canvas把原点平移到“配饰物”的位置，然后再通过“配饰物”的内部偏移使得“配饰物”中心刚好在原点，此时再旋转画布把“配饰物”画上。
基于步骤三中步骤8中步骤3)的头顶坐标确定“配饰物”中心点位置，基于步骤三中步骤8中步骤3)的脸宽确定“配饰物”的宽度，基于步骤三中步骤8中步骤3)的脸的倾斜角度确定“配饰物”的偏转角度
const{headPos,angle,faceWidth}＝config；
const img＝new Image()；
img.src＝'../public/images/hat.png'；
img.onload＝()＝>{}
图片加载完成后立即执行以下操作：
1)保存当前画布状态：
ctx.save()；
2)基于步骤三中步骤8中步骤3)的头顶坐标确定“配饰物”中心点位置，将画布原点移动到头顶的位置：
ctx.translate(headPos.x,headPos.y)；
3)基于步骤三中步骤8中步骤3)的脸的倾斜角度旋转画布确定“配饰物”的偏转角度：
ctx.rotate(angle)；
4)基于步骤2偏移图片，使“配饰物”中心刚好在原点：
因为绘制图片的时候是按图片的左上角为原点绘制的，因此我们在实际绘制帽子的时候需要对坐标进行一个偏移。根据我当前的“配饰物”元素进行一些偏移(图片大小是200*130)，“配饰物”可佩戴部分的中心坐标是(62,60)，这里需要微调，使得图片可佩戴部分是0.6倍图片宽度。
const{x,y,width,height}＝{
width:faceWidth/0.6,
height:(faceWidth*0.65)/0.6
x:-(62*picSize.width)/200,
y:-(60*picSize.height)/130,
}
5)画“配饰物”：
ctx.drawImage(img,x,y,width,height)；
6)图片合成完成，还原画布：
ctx.restore()；
到此为止实现了在目标人脸图片上合成“配饰物”。
可以看出，本发明提供的一种基于tensorflow人脸识别的web前端图像合成方案，是直接在浏览器运行的，不需要安装任何库或驱动程序，没有任何外部依赖关系。包括人脸信息数据获取、人脸倾角计算、“配饰物”位置计算、图片合成等。
下面结合一个具体使用场景，对本发明的具体应用作进一步描述。场景如下：在系统中录入公司员工头像照片，阶段性基于系统的行为分析功能，为员工进行考核排名，系统自动给前三名员头像佩戴“皇冠”进行大屏公示，一方面使信息公开化，更重要的是以这种方法激励员工，积极关注个人在组织中的相对价值和贡献程度；在此场景中，结合最前沿技术用较简单的方式实现了员工头像与“配饰物”的合成，紧跟人工智能时代大背景，使用人工智能技术助力业务新突破。
以上所述仅是本发明的优选实施方式，应当指出，对于本技术领域的普通技术人员来说，在不脱离本发明技术原理的前提下，还可以做出若干改进和变形，这些改进和变形也应视为本发明的保护范围。
Claims (10)
1.一种基于tensorflow的web前端图像合成方法，其特征在于，包括以下步骤：
一、初始化
1)加载构建在tensorflow.js core上的javascript模块，即face-api.js；
2)基于步骤1)加载人脸检测模型；
3)基于步骤1)加载脸部特征点模型；
二、基于步骤一加载的人脸检测模型、脸部特征点模型进行人脸识别，进行全脸识别操作后，得到一个数据集，把当前的数据进行一个转换，让它的数据匹配特定的大小；
三、基于步骤二处理后的图像获取脸部信息数据；
四、基于步骤三中步骤8中步骤3)进行图片合成。
2.如权利要求1所述的方法，其特征在于，步骤三具体是：从API直接获取或通过计算得到脸部有用信息点的坐标，将图像抽取到坐标系进行分析处理：
(1)、获取组成左眉毛的点；
(2)、获取组成右眉毛的点；
(3)、获取组成脸轮廓的点；
(4)、基于步骤(1)、步骤(2)获取眉心的点：
1)基于步骤(1)获取左眉毛中间的点；
2)基于步骤(2)获取右眉毛中间的点；
3)基于步骤三中步骤1)、2)获取眉心的点；根据两点之间距离公式，由左眉毛中间的点和右眉毛中间的点计算眉心的点坐标；
(5)、基于步骤(3)获取下颌的点；
(6)、基于步骤(4)中步骤3)获取脸的倾斜弧度由脸中线和y轴的夹角计算脸的倾角度；
(7)、基于步骤(4)中步骤3)以及步骤(5)获取头顶的坐标：
1)获取线斜率，根据斜率公式，基于步骤(4)中步骤3)以及步骤(5)由眉心的点坐标和下颚点坐标计算斜率；
2)获取眉心到下颌的距离，根据点到直线的距离公式，基于步骤(4)中步骤3)以及步骤(5)由眉心的点坐标和下颚点坐标计算两点间的距离；
3)基于步骤(7)中步骤1)、步骤(7)中步骤2)获取头顶的坐标；
(8)、获取脸大小信息：
1)基于步骤(3)获取脸宽；
2)基于步骤(4)中步骤3)、步骤(5)获取脸长；
3)基于步骤(3)中步骤4)、步骤(5)、步骤(6)、步骤(7)中步骤3)、步骤(8)中步骤1)、步骤(8)中步骤2)得到脸部信息数据集。
3.如权利要求2所述的方法，其特征在于，由步骤三得到的脸部信息数据集确定了配饰物的佩戴位置，及配饰物的宽度和倾斜度，配饰物是要与人脸合成的目标图片物；
步骤四具体为基于步骤三中步骤(8)中步骤3)的头顶坐标确定配饰物中心点位置，基于步骤三中步骤(8)中步骤3)的脸宽确定配饰物的宽度，基于步骤三中步骤(8)中步骤3)的脸的倾斜角度确定配饰物的偏转角度，然后采用画布进行图片合成，即首先把头像绘制到画布上，然后将配饰物绘制在同一张画布上的指定位置。
4.如权利要求3所述的方法，其特征在于，步骤四的具体实现方式如下：
(1)、创建一个画布；
(2)、基于步骤三中步骤(8)中步骤3)中得到的脸部信息数据集初始化画布信息；
(3)、基于步骤二匹配的数据进行人脸识别描边；
(4)、基于经步骤四中步骤(2)初始化后得到的画布创建画笔；
(5)、基于步骤四中步骤(1)创建的画布指定合成图片显示位置：在创建的画布上清空一个矩形框用来画图；
(6)、基于步骤四中步骤(2)绘制人脸图片；
(7)、基于步骤三中步骤(8)中步骤3)绘制配饰物并优化。
5.如权利要求4所述的方法，其特征在于，步骤四中步骤(7)具体是基于步骤三中步骤(8)中步骤3)的头顶坐标确定配饰物中心点位置，基于步骤三中步骤(8)中步骤3)的脸宽确定配饰物的宽度，基于步骤三中步骤(8)中步骤3)的脸的倾斜角度确定配饰物的偏转角度。
6.如权利要求5所述的方法，其特征在于，步骤四中步骤(7)的具体实现方式图片加载完成后立即执行以下操作：
1)保存当前画布状态：
2)基于步骤三中步骤(8)中步骤3)的头顶坐标确定配饰物中心点位置，将画布原点移动到头顶的位置；
3)基于步骤三中步骤(8)中步骤3)的脸的倾斜角度旋转画布确定配饰物的偏转角度；
4)基于步骤四的步骤(2)偏移图片，使配饰物中心刚好在原点；
5)画配饰物：
6)图片合成完成，还原画布；
到此为止实现了在目标人脸图片上合成配饰物。
7.如权利要求1所述的方法，其特征在于，步骤一中加载的人脸检测模型和脸部特征点模型为SSD模型。
8.如权利要求3所述的方法，其特征在于，所述配饰物为帽子。
9.如权利要求3所述的方法，其特征在于，所述配饰物为皇冠。
10.如权利要求3所述的方法，其特征在于，所述配饰物为花环。
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202010283314.2A CN111428683A (zh) | 2020-04-13 | 2020-04-13 | 一种基于tensorflow的web前端图像合成方法 |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202010283314.2A CN111428683A (zh) | 2020-04-13 | 2020-04-13 | 一种基于tensorflow的web前端图像合成方法 |
Publications (1)
| Publication Number | Publication Date |
|---|---|
| CN111428683A true CN111428683A (zh) | 2020-07-17 |
Family
ID=71553905
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN202010283314.2A Pending CN111428683A (zh) | 2020-04-13 | 2020-04-13 | 一种基于tensorflow的web前端图像合成方法 |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN111428683A (zh) |
Cited By (1)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN113327249A (zh) * | 2021-05-27 | 2021-08-31 | 南京邮电大学 | 一种基于图像分割的毕业照云合拍系统及其方法 |
Citations (3)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN107392182A (zh) * | 2017-08-17 | 2017-11-24 | 宁波甬慧智能科技有限公司 | 一种基于深度学习的人脸采集识别方法及装置 |
| CN108345454A (zh) * | 2018-04-16 | 2018-07-31 | 珠海横琴盛达兆业科技投资有限公司 | 基于clmtrackr的药店管理系统调用html5视频实时自动采集人脸图像数据的方法 |
| US20200059605A1 (en) * | 2018-08-17 | 2020-02-20 | Guangdong Oppo Mobile Telecommunications Corp., Ltd. | Method and apparatus for image processing, and mobile terminal |
-
2020
- 2020-04-13 CN CN202010283314.2A patent/CN111428683A/zh active Pending
Patent Citations (3)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN107392182A (zh) * | 2017-08-17 | 2017-11-24 | 宁波甬慧智能科技有限公司 | 一种基于深度学习的人脸采集识别方法及装置 |
| CN108345454A (zh) * | 2018-04-16 | 2018-07-31 | 珠海横琴盛达兆业科技投资有限公司 | 基于clmtrackr的药店管理系统调用html5视频实时自动采集人脸图像数据的方法 |
| US20200059605A1 (en) * | 2018-08-17 | 2020-02-20 | Guangdong Oppo Mobile Telecommunications Corp., Ltd. | Method and apparatus for image processing, and mobile terminal |
Cited By (1)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN113327249A (zh) * | 2021-05-27 | 2021-08-31 | 南京邮电大学 | 一种基于图像分割的毕业照云合拍系统及其方法 |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| AU2018214005B2 (en) | Systems and methods for generating a 3-D model of a virtual try-on product | |
| US9552668B2 (en) | Generation of a three-dimensional representation of a user | |
| CN110517355B (zh) | 用于照明混合现实对象的环境合成 | |
| JP2603445B2 (ja) | 髪画像適合方法及びコンピュータ・システム | |
| JP4932951B2 (ja) | 顔画像処理方法およびシステム | |
| Goesele et al. | Ambient point clouds for view interpolation | |
| JP2002123837A (ja) | 顔の特徴をアニメーション化する方法およびシステムならびに表情変換のための方法およびシステム | |
| CN107484428B (zh) | 用于显示对象的方法 | |
| CN112150638A (zh) | 虚拟对象形象合成方法、装置、电子设备和存储介质 | |
| US20090153569A1 (en) | Method for tracking head motion for 3D facial model animation from video stream | |
| CN107452049B (zh) | 一种三维头部建模方法及装置 | |
| WO2021063271A1 (zh) | 人体模型重建方法、重建系统及存储介质 | |
| JP2011039869A (ja) | 顔画像処理装置およびコンピュータプログラム | |
| WO2023066120A1 (zh) | 图像处理方法、装置、电子设备及存储介质 | |
| Chen et al. | Monogaussianavatar: Monocular gaussian point-based head avatar | |
| Pighin et al. | Realistic facial animation using image-based 3D morphing | |
| JP2938739B2 (ja) | 動画像処理装置 | |
| Jung et al. | Learning free-form deformation for 3D face reconstruction from in-the-wild images | |
| CN103914873B (zh) | 一种根据人体动作驱动的雕塑三维模型生成方法 | |
| JPH09305798A (ja) | 画像表示装置 | |
| CN111428683A (zh) | 一种基于tensorflow的web前端图像合成方法 | |
| CA2457839C (en) | Automatic 3d modeling system and method | |
| CN112862981B (zh) | 用于呈现虚拟表示的方法和装置、计算机设备和存储介质 | |
| JP2017122993A (ja) | 画像処理装置、画像処理方法及びプログラム | |
| JP3276949B2 (ja) | ３次元有向体の定位方法及び画像処理装置 |
Legal Events
| Date | Code | Title | Description |
|---|---|---|---|
| PB01 | Publication | ||
| PB01 | Publication | ||
| SE01 | Entry into force of request for substantive examination | ||
| SE01 | Entry into force of request for substantive examination | ||
| RJ01 | Rejection of invention patent application after publication |
Application publication date: 20200717 |
|
| RJ01 | Rejection of invention patent application after publication |