zoukankan      html  css  js  c++  java
  • 绘制扇形,空心文字,实心文字,颜色线性 放射性渐变

    //绘制扇形
    context.lineWidth=1;
    context.fillStyle="orange";
    context.moveTo(100,100);
    context.arc(100,100,60,Math.PI*7/6,Math.PI*1.5,false);
    context.fill();
    context.beginPath();
    context.moveTo(100,100);
    context.arc(100,100,60,Math.PI*11/6,Math.PI*1.5,true);
    context.fill();

    context.beginPath();
    context.fillStyle="#999";
    context.moveTo(100,100);
    context.arc(100,100,30,Math.PI*7/6,Math.PI*1.5,false);
    context.fill();
    context.beginPath();
    context.moveTo(100,100);
    context.arc(100,100,30,Math.PI*11/6,Math.PI*1.5,true);
    context.fill();


    //绘制空心 实心文

    context.lineWidth=1;
    context.strokeStyle="yellow";
    context.fillStyle="red";
    font="20px 隶书";
    context.strokeText("欢迎来到闹闹猪的博客",50,10);
    context.fillText("欢迎来到闹闹猪的博客",50,30);



    context.strokeText("欢迎来到闹闹猪的博客",50,50);
    context.fillText("欢迎来到闹闹猪的博客",50,50);

    //颜色线性渐变
    g=context.createLinearGradient(50,50,50,100);//从上到下的填充
    g.addColorStop(0,"pink");
    g.addColorStop(0.5,"purple");
    g.addColorStop(1,"white");
    context.fillStyle=g;
    context.fillRect(50,50,100,50);
    context.fill();


    //颜色放射性渐变
    g=context.createRadialGradient(50,50,50,50,50,80);//从上到下的填充
    g.addColorStop(0,"pink");
    g.addColorStop(0.5,"purple");
    g.addColorStop(1,"white");
    context.fillStyle=g;
    context.arc(50,50,80,0,Math.PI*2);
    context.fill();

  • 相关阅读:
    Python学习-字符编码浅析
    python元组,集合类型,及字典补充
    python字符串,列表常用操作
    python流程控制
    Python之线程&进程
    yii框架的中的一些使用介绍
    《最牛B的Linux Shell命令》笔记
    CentOS6.8上安装epel
    mysql 5.7 Group Replication
    mysql5.7 参数记录 (持续更新)
  • 原文地址:https://www.cnblogs.com/Litter-Tulip/p/5265957.html
Copyright © 2011-2022 走看看