问题描述
- canvas如何原地绕文字中心旋转
-
即实现上图这种效果，我只能做到旋转，但总是不在正确的位置，求大神贴个源码我参照一下(目标对象是文字，不是线条)
解决方案
<!DOCTYPE HTML>
<html>
<head><title>canvas</title><meta charset="utf-8" /></head>
<body>
<canvas id="canvas" width="600"height="400" style="border:1px solid black">
<p>Your browserdoes not support the canvas element!</p>
</canvas>
<script type="text/javascript">
var endX=200;
var endY=100;
var end='11111111111111111111';
var canvas =document.getElementById("canvas");
var ctx =canvas.getContext("2d");
ctx.beginPath();
ctx.fillStyle = "#000000";
ctx.font = "52pt 楷体";
ctx.textAlign = "center";
ctx.fillText(this.end, endX, endY);
ctx.save();
ctx.translate(endX, endY);
ctx.rotate(Math.PI/6);
ctx.fillText("文字2", 0, 0);
ctx.restore();
</script>
</body>
</html>
解决方案二：
-
- > ## XXXX**XXXXX_XXXXX_**X
-
时间： 2024-08-17 14:55:57