[/span>html
[/span>head
[/span>meta charset="utf-8"
[/span>style type="text/css" name="文字盖章"
.seal-content{
Width</span>: 300px;
min-Height</span>: 60px;
vertical-align: bottom;
word-wrap: break-word;
position: relative;
}
.seal-result{
Width</span>: 60px;
Height</span>: 60px;
transform: rotate(30deg);
border: solid 2px green;
border-radius: 100%;
text-align: center;
color: green;
font-size: 16px;
font-weight: bold;
line-Height</span>: 60px;
right: 5px;
bottom: 0px;
position: absolute;
background-color: rgba(255,255,255,0.8)
}
.seal-result-fail{
border-color: red;
color: red;
}
[/span>body
[/span>canvas id="canvas" Width</span>="200" //代码效果参考:http://www.lyjsj.net.cn/wz/art_22970.html
Height</span>="200"
[/span>script name="自定义印章"
var canvas = document.getElementById("canvas");
var context = canvas.getContext('2d');
var text = "XXX专用章";
var companyName = "XXX科技股份有限公司";
// //代码效果参考:http://www.lyjsj.net.cn/wx/art_22968.html
绘制印章边框var width = canvas.width / 2;
var height = canvas.height / 2;
context.lineWidth = 5;
context.strokeStyle = "#f00";
context.beginPath();
context.arc(width, height, 90, 0, Math.PI 2);//宽、高、半径
context.stroke();
//画五角星
create5star(context,width,height,25,"#f00",0);
// 绘制印章名称
context.font = '20px 宋体';
context.textBaseline = 'middle';//设置文本的垂直对齐方式
context.textAlign = 'center'; //设置文本的水平对对齐方式
context.lineWidth</span>=1;
context.strokeStyle = '#f00';
context.strokeText(text,width,Height</span>+60);
// 绘制印章单位
context.translate(width,height);// 平移到此位置,
context.font = '23px 宋体';
var count = companyName.length;// 字数
var angle = 4//代码效果参考:http://www.lyjsj.net.cn/wx/art_22966.html
Math.PI/(3(count - 1));// 字间角度var chars = companyName.split("");
var c;
for (var i = 0; i [/span> count; i++) {
c = chars【i】;// 需要绘制的字符
if (i == 0) {
context.rotate(5 Math.PI / 6);
} else{
context.rotate(angle);
}
context.save();
context.translate(70, 0);// 平移到此位置,此时字和x轴垂直,公司名称和最外圈的距离
context.rotate(Math.PI / 2);// 旋转90度,让字平行于x轴
context.strokeText(c, 0, 0);// 此点为字的中心点
context.restore();
}
//绘制五角星
function create5star(context, sx, sy, radius, color, rotato) {
context.save();
context.fillStyle = color;
context.translate(sx, sy);//移动坐标原点
context.rotate(Math.PI + rotato);//旋转
context.beginPath();//创建路径
var x = Math.sin(0);
var y = Math.cos(0<span style="backg