canvas来绘制一个公章的效果代码

代码语言:html

所属分类:其他

代码描述:canvas来绘制一个公章的效果代码

代码标签: 一个 公章 效果

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html>
<head>

    <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/jquery-3.2.1.min.js"></script>



</head>
<body>
    <div>
        <label for="stamp">公司名称</label><input type="text" id="stamp" />
        <br />
        <label for="stamp">下面的小字</label><input type="text" id="small" />
        <br />
        <button id="btn">生成</button>
    </div>
    <canvas id="canvas" width="250" height="250"></canvas>
    <script type="application/javascript">
        //<![CDATA[
        function createSeal(id, company, name) {

            var canvas = document.getElementById(id);
            var context = canvas.getContext('2d');

            // 绘制印章边框
            var width = canvas.width/2;
            var height = canvas.height/2;
            context.lineWidth = 7;
            context.strokeStyle = "#f00";
            context.beginPath();
            context.arc(width, height, 110, 0, Math.PI*2);
            context.stroke();

            //画五角星
            create5star(context, width, height, 30, "#f00", 0);

            // 绘制印章名称
            context.font = '22px Helvetica';
            context.textBaseline = 'middle'; .........完整代码请登录后点击上方下载按钮下载查看

网友评论0