canvas如何动态指定字体字号啊，求大神指点

yestoyes 2016-06-05 05:19:48

如题，canvas指定字体时，用类似

ctx.font="40px 宋体";

这样的语句是有效的，但如果是用
cfont="40px 宋体";
ctx.font=cfont;
这样指定就无效，那如何处理别处传递过来的字体信息啊？求大神指教！

...全文

475 4 打赏收藏转发到动态举报

写回复

4 条回复

切换为时间正序

请发表友善的回复…

发表回复

yestoyes 2016-06-05

打赏
举报

回复

谢谢老大！问题解决了，是我粗心了，在拼接字符时拼接出错了。

天际的海浪 2016-06-05

打赏
举报

回复

没问题哦


<!doctype html>
<html lang="en">
<head>
	<meta charset="UTF-8" />
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
	<title> 页面名称 </title>
</head>
<body>
<canvas id="canvasId" width="400" height="350"></canvas>
<script type="text/javascript">
var canvas = document.getElementById("canvasId");
var ctx = canvas.getContext("2d");
var cfont="40px 黑体";
ctx.font=cfont;
ctx.fillText("文字",20,50);
</script>
</body>
</html>

yestoyes 2016-06-05

打赏
举报

回复

楼上的老大，我直接用上面的代码测试了，不行啊

天际的海浪 2016-06-05

打赏
举报

回复

应该不会有问题，检查传递过来字符串的格式是否正确

代码为博客实例代码http://blog.csdn.net/lmj623565791/article/details/34089553 有问题博客中留言

在做项目的时候，我使用了text-strok这个css属性实现了字体描边的效果，但是当用html2canvas将DOM元素转成为canvas的时候却发现字体描边是没有出现的，当然，canvas2html这个插件并不是截图。只是利用了canvas 的方法，读取了DOM元素里面的属性然后转换成为canvas，既然这个字体描边没有出现，那么就说明，在canvas中不支持字体描边，在经过一系列的搜索之后发现，其实canvas是支持字体描边的，但是不支持设置字体描边的宽度，你无法达成像PS中一样的效果，无法还原像te

vue2，vue3，uniapp，html2canvas截图后引入的字体样式丢失，html2canvas艺术字截图不显示，使用外部字体无效，html2canvas无法识别网络字体文件怎么办，ttf文件，网页使用在线字体链接利用html2canvas无法截取，字体样式没有了，font-family第三方字体，@font-face引入本地字体文件后无法被html2canvas识别怎么办，html2canvas文字消失，vue页面正常显示艺术字体但截屏后没有，html2canvas截图存在特殊字体时截图不全，默认

之前的版本使用现在直接使用CanvasContext.font即可例如 this.ctx2.font = 'normal bold 40px sans-serif';

开发工具：微信开发者工具 Stable 1.05.21020210 注意：目前canvas 2d 开发工具看不到效果，需要真机预览才可以看到效果效果图：下面是动态加载网络字体的api: 写的是一个全局加载的 // app.js App({ onLaunch() { //加载全局字体 for(let i =0;i<this.globalData.array.length;i++){ console.log(i) let obj = this

87,996

社区成员

224,708

社区内容

发帖

与我相关

我的任务

社区管理员

加入社区

近7日
近30日
至今

加载中

查看更多榜单

社区公告

暂无公告

试试用AI创作助手写篇文章吧

+ 用AI写文章