<html>
<head><meta charset="utf-8" /></head>
<body>
<br/>上半边内容:<input type="text" id="upStr" value="中华人民共和国" />
<br/>下半边内容:<input type="text" id="downStr" value="201312654954" />
<br/>中间的内容:<input type="text" id="middleStr" value="财务专用章" />
<br/>印章的半径:<input type="text" id="radii" value="150" />
<br/><input type="button" value="生成" onclick="test();" />
<br/><canvas id="test" width="400" height="400"></canvas>
<script>
var THISPI = Math.PI / 180;
function DrawSeal(canvasID,upStr,downStr,middleStr,radii)
{
    var canvas = ElementById(canvasID);
    canvas.width = radii * 2;
    canvas.height = canvas.width;
   
    var Context('2d');
    context.save();
   
    FillPentacle("#FF0000",context,radii, radii, radii * 0.3);
    var edge = radii * 0.04;//外圈宽度
    varh5平台源码下载 diametre = radii * 2 - edge * 2;//外圈的直径
   
    //开始绘外圆
    store();
    context.save();
    context.beginPath();
    context.arc(radii,radii,radii - edge,0,Math.PI*2,false);
    context.closePath();
    context.lineWidth = edge;
    context.strokeStyle = 'red';
    context.stroke();
    //开始绘上半部份文字
    var _startAngle = 135, _endAngle = 45;
    if (upStr != "")
    {
        if (downStr != "")
        {
            _startAngle = 155;//如果有底部文字则缩紧点
            _endAngle = 25;
        }
        if (middleStr != "")
        {
            _startAngle = 170;//如果有中间文字则缩紧点
            _endAngle = 10;
        }
        var fontSize = radii * 0.38;
        store();
        context.save();
        var font="bold " + fontSize + "px 宋体";
        var fillStyle="#FF0000"
        DrawRotatedText(context, upStr, font, fillStyle, _startAngle, _endAngle
            , radii, radii, radii * 0.66, 90, true);
    }
    //开始绘下半边文字
    if (downStr != "")
    {
        var font="bold " + (radii * 0.08) + "px 宋体";
        var fillStyle="#FF0000"
       
        //计算出平均角度
        var upAvgAngle = 0;
        if (_startAngle <= _endAngle)//如果开始角度大于结束角度则需要考虑超出360度的问题
        {
            upAvgAngle = (_endAngle - _startAngle) / (upStr.length - 1);
        }
        else
        {
            upAvgAngle = (_endAngle + 360 - _startAngle) / (upStr.length - 1);
        }
        _endAngle += upAvgAngle;//底部文字与顶部文字增加间距
        _startAngle -= upAvgAngle;
        if (middleStr != "")
        {
            _startAngle = 130;//如果有中间文字,再次综紧一点文字间距
            _endAngle = 50;
        }
        DrawRotatedText(context, downStr, font, fillStyle, _endAngle, _startAngle
            , radii, radii, radii * 0.85, 270,false);
    }
    //开始绘制中间文件
    if (middleStr != "")
    {
        store();
        context.save();
        context.font="bold " + (radii * 0.23) + "px 宋体"
        context.fillStyle="#FF0000"
       
        var tempX = 0, tempY = 0;
        var thisRadii = (radii - edge * 2);
        var downMaxWidth = (thisRadii - (thisRadii + thisRadii * s(135 * THISPI))) * 2;//中间总宽度
       
        tempY = radii + radii * Math.sin(30 * THISPI);//中间文件的Y坐标
       
        var tempSizeF = asureText(middleStr);
        tempY = radii + radii * Math.sin(30 * THISPI);
        if (downMaxWidth >= tempSizeF.width)//如果当前文字没超过总宽度,则文本居中
        {
            tempX = radii - tempSizeF.width / 2;
        }
        else
        {
            var fontWidth = downMaxWidth / middleStr.length;
            tempX = thisRadii + thisRadii * s(135 * THISPI) + edge * 2;
        }
        context.fillText(middleStr,tempX,tempY,downMaxWidth);
    }
}
// 绘制环绕中心点的文字 参数说明:
// context : H5canvas
// Content : 文本内容
// font : 字体样式 (bold 20px 宋体)
// fillStyle : 字体颜
// _startAngle : 开始角度
// _endAngle : 结束角度
// X : 圆心X坐标
// Y : 圆心Y坐标
// r : 圆的半径
// fontDirection : 旋转角度
// strDirection : 文字排列方向 (true 顺时钟,false 逆时钟)
function DrawRotatedText(context, Content, font, fillStyle, _startAngle, _endAngle, X, Y, r, fontDirection, strDirection){
    if (Content == null || Content == "") return;
   
    //计算出平均角度
    var avgAngle = 0;
    if (_startAngle <= _endAngle)//如果开始角度大于结束角度则需要考虑超出360度的问题
    {
        avgAngle = (_endAngle - _startAngle) / (Content.length - 1);
    }
    else
    {
        avgAngle = (_endAngle + 360 - _startAngle) / (Content.length - 1);
    }
   
    var tempX = _startAngle, tempY = _endAngle;

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。