我见过将文本转换为图像的几种情况，但没有人提到，如果文本太长，即超过1000个字，我该如何使用15px的字体在图像中显示它们我的HTML代码
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<head>
</head>
<body>
<div id="the_text"></div>
<button id="show_img_btn">Convert to Image</button>
<div id="show_img_here"></div>
</body>
我的脚本代码
window.onload=function(){
$("#show_img_btn").on("click", function () {
var canvas = document.createElement("canvas");
canvas.width = 620;
canvas.height = 80;
var ctx = canvas.getContext('2d');
ctx.font = "30px Arial";
var text = $("#the_text").text();
ctx.fillText(text,10,50);
var img = document.createElement("img");
img.src=canvas.toDataURL();
$("#show_img_here").append(img);
//$("body").append(canvas);
});
};
我的问题是，如果我将这张图像转换成一行，将帮助我将整个文本转换成图像并设置高度和宽度。
创建一个虚拟元素并应用相同样式的道具，附加到dom并获取它的with。基于此，您可以拆分文本。下面提供了有用的摘要。