Skip to content

yanghanwen / wanda-vr

Go to a project
Commit 577e305b by 白宇
Options

html2 canvas text

parent 237a9597
Showing with 18 additions and 11 deletions
route.html
...@@ -592,7 +592,7 @@ ...@@ -592,7 +592,7 @@
<img class="poster-content__qrcode" :src="userInfo.qrcode"></img> <img class="poster-content__qrcode" :src="userInfo.qrcode"></img>
<div class="poster-content__userinfo"> <div class="poster-content__userinfo">
<img class="headimg" :src="userInfo.head" /> <img class="headimg" :src="userInfo.head" />
<div class="tip">快跟着{{userInfo.nickname}}<br/>一起分享丹寨</div> <div class="tip">快跟着我<br/>一起分享丹寨</div>
</div> </div>
</div> </div>
</div> </div>
...@@ -775,8 +775,9 @@ var vueInstance = new Vue({ ...@@ -775,8 +775,9 @@ var vueInstance = new Vue({
var userInfo = await getUserInfo(); var userInfo = await getUserInfo();
// console.log(userInfo); // console.log(userInfo);
var shareName = `快跟着${userInfo.nickname.length > 4 ? userInfo.nickname.substr(0, 4) : userInfo.nickname} 一起分享丹寨` // var shareName = `快跟着${userInfo.nickname.length > 4 ? userInfo.nickname.substr(0, 4) : userInfo.nickname} 一起分享丹寨`
var shareUserName = `一起分享丹寨`
var shareUserName1 = `快跟着我`
var canvas = document.getElementById("canvasEle"); var canvas = document.getElementById("canvasEle");
var ctx = canvas.getContext("2d"); var ctx = canvas.getContext("2d");
...@@ -800,7 +801,8 @@ var vueInstance = new Vue({ ...@@ -800,7 +801,8 @@ var vueInstance = new Vue({
// console.log(head_image) // console.log(head_image)
ctx.drawImage(head_image, dpr * 395, dpr * 980, dpr * 55, dpr * 55); ctx.drawImage(head_image, dpr * 395, dpr * 980, dpr * 55, dpr * 55);
canvasTextAutoLine(shareName, ctx, dpr * 170, dpr * 465, dpr * 1005, 32, 24, dpr) canvasTextAutoLine(shareUserName, ctx, dpr*170, dpr * 465, dpr * 1035,32,24,dpr)
canvasTextAutoLine(shareUserName1, ctx, dpr*170, dpr * 465, dpr * 1005,32,24,dpr)
canvasTextAutoLine(currentInfo.content, ctx, dpr * 410, dpr * 45, dpr * 220, 45, 30, dpr, true) canvasTextAutoLine(currentInfo.content, ctx, dpr * 410, dpr * 45, dpr * 220, 45, 30, dpr, true)
......
show.html
...@@ -394,7 +394,7 @@ ...@@ -394,7 +394,7 @@
<img class="poster-content__qrcode" :src="userInfo.qrcode"></img> <img class="poster-content__qrcode" :src="userInfo.qrcode"></img>
<div class="poster-content__userinfo"> <div class="poster-content__userinfo">
<img class="headimg" :src="userInfo.head" /> <img class="headimg" :src="userInfo.head" />
<div class="tip">快跟着{{userInfo.nickname}}<br/>一起分享丹寨</div> <div class="tip">快跟着我<br/>一起分享丹寨</div>
</div> </div>
</div> </div>
</div> </div>
...@@ -540,7 +540,9 @@ var vueInstance = new Vue({ ...@@ -540,7 +540,9 @@ var vueInstance = new Vue({
var userInfo = await getUserInfo(); var userInfo = await getUserInfo();
console.log(userInfo); console.log(userInfo);
var shareUserName = `快跟着${userInfo.nickname.length > 4 ? userInfo.nickname.substr(0, 4) : userInfo.nickname} 一起分享丹寨` // var shareUserName = `快跟着${userInfo.nickname.length > 4 ? userInfo.nickname.substr(0, 4) : userInfo.nickname} 一起分享丹寨`
var shareUserName = `一起分享丹寨`
var shareUserName1 = `快跟着我`
var canvas = document.getElementById("canvasEle"); var canvas = document.getElementById("canvasEle");
...@@ -566,7 +568,8 @@ var vueInstance = new Vue({ ...@@ -566,7 +568,8 @@ var vueInstance = new Vue({
console.log(head_image) console.log(head_image)
ctx.drawImage(head_image, dpr * 395, dpr * 980, dpr * 55, dpr * 55); ctx.drawImage(head_image, dpr * 395, dpr * 980, dpr * 55, dpr * 55);
canvasTextAutoLine(shareUserName, ctx, dpr*170, dpr * 465, dpr * 1005,32,24,dpr) canvasTextAutoLine(shareUserName, ctx, dpr*170, dpr * 465, dpr * 1035,32,24,dpr)
canvasTextAutoLine(shareUserName1, ctx, dpr*170, dpr * 465, dpr * 1005,32,24,dpr)
canvasTextAutoLine(this.shareDesc, ctx, dpr*410, dpr * 45, dpr * 290,45,30,dpr,true) canvasTextAutoLine(this.shareDesc, ctx, dpr*410, dpr * 45, dpr * 290,45,30,dpr,true)
......
travel.html
...@@ -430,7 +430,7 @@ ...@@ -430,7 +430,7 @@
<img class="poster-content__qrcode" :src="userInfo.qrcode"></img> <img class="poster-content__qrcode" :src="userInfo.qrcode"></img>
<div class="poster-content__userinfo"> <div class="poster-content__userinfo">
<img class="headimg" :src="userInfo.head" /> <img class="headimg" :src="userInfo.head" />
<div class="tip">快跟着{{userInfo.nickname}}<br/>一起分享丹寨</div> <div class="tip">快跟着我<br/>一起分享丹寨</div>
</div> </div>
</div> </div>
</div> </div>
...@@ -597,8 +597,9 @@ var vueInstance = new Vue({ ...@@ -597,8 +597,9 @@ var vueInstance = new Vue({
var userInfo = await getUserInfo(); var userInfo = await getUserInfo();
// console.log(userInfo); // console.log(userInfo);
var shareName = `快跟着${userInfo.nickname.length > 4 ? userInfo.nickname.substr(0, 4) : userInfo.nickname} 一起分享丹寨` // var shareName = `快跟着${userInfo.nickname.length > 4 ? userInfo.nickname.substr(0, 4) : userInfo.nickname} 一起分享丹寨`
var shareUserName = `一起分享丹寨`
var shareUserName1 = `快跟着我`
var canvas = document.getElementById("canvasEle"); var canvas = document.getElementById("canvasEle");
var ctx = canvas.getContext("2d"); var ctx = canvas.getContext("2d");
...@@ -622,7 +623,8 @@ var vueInstance = new Vue({ ...@@ -622,7 +623,8 @@ var vueInstance = new Vue({
// console.log(head_image) // console.log(head_image)
ctx.drawImage(head_image, dpr * 395, dpr * 980, dpr * 55, dpr * 55); ctx.drawImage(head_image, dpr * 395, dpr * 980, dpr * 55, dpr * 55);
canvasTextAutoLine(shareName, ctx, dpr*170, dpr * 465, dpr * 1005,32,24,dpr) canvasTextAutoLine(shareUserName, ctx, dpr*170, dpr * 465, dpr * 1035,32,24,dpr)
canvasTextAutoLine(shareUserName1, ctx, dpr*170, dpr * 465, dpr * 1005,32,24,dpr)
canvasTextAutoLine(currentInfo.content, ctx, dpr*410, dpr * 45, dpr * 220,45,30,dpr,true) canvasTextAutoLine(currentInfo.content, ctx, dpr*410, dpr * 45, dpr * 220,45,30,dpr,true)
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment