画圆及填充文字

<!DOCTYPE html>

<html>

    <head>

        <meta charset="utf-8">

        <title></title>

        <style media="screen">

            canvas{

                background: #ccc;

            }

        </style>

    </head>

    <body>

        <canvas id="canvas" width="600" height="600"></canvas>

    </body>

    <script type="text/javascript">

    var canvas=document.getElementById('canvas');

    var ctx=canvas.getContext('2d');

    ctx.strokeStyle='#fff';

    ctx.beginPath();

     ctx.arc(300,300,50,0,2*Math.PI);

    //  ctx.closePath();

    //  ctx.fillStyle='grey';

    //  ctx.fill();

     ctx.stroke();

     //

     ctx.beginPath();

     ctx.strokeStyle='green';

     ctx.arc(300,300,50,0.5*Math.PI,1.5*Math.PI);

     ctx.stroke();

    //   ctx.closePath();

    ctx.font='bold 19px arial'

    ctx.fillStyle='red';

    ctx.fillText('50%',285,310)

    </script>

</html>

　　

canvas---HTML5新特性的更多相关文章

  1. html5新特性

    这一篇博文不会告诉你怎么去使用html5的新特性,只会给你总结一下新特性------对于好学的人可以把这篇文章当做一个目录 对于初接触的人来说是一个导向 对于已经接触过的人来说是一个检测你掌握程度的检 ...

  2. HTML5新特性之CSS+HTML5实例

    1.新的DOCTYPE和字符集 HTML5的一项准则就是化繁为简,Web页面的DOCTYPE被极大的简化. <!DOCTYPE html> 同时字符集声明也被简化了: <meta c ...

  3. web全栈架构师[笔记] — 03 html5新特性

    HTML5新特性 一.geolocation PC端 精度比较低 通过IP库定位 移动端 通过GPS window.navigator.geolocation 单次 getCurrentPositio ...

  4. html5新特性与用法大全了解一下

    有好多小伙伴私聊我问我html5新特性 和用法,下面我给大家具体介绍一下html5都新加了哪些新特性,下面我给大家总结一下. 1)新的语义标签 footer header 等等2)增强型表单 表单2. ...

  5. 第二季第八天 HTML5新特性

    在函数内部window.a =  a  在全局中就可以拿到这个变量 变量命名.作为函数的参数的时候要详细.调用的时候可以简单点 做全局变量的两个方案 1.绑在标签上data 2.闭包 视频一般都是二进 ...

  6. 前端进阶系列(三):HTML5新特性

    HTML5 是对 HTML 标准的第五次修订.其主要的目标是将互联网语义化,以便更好地被人类和机器阅读,并同时提供更好地支持各种媒体的嵌入.HTML5 的语法是向后兼容的.现在国内普遍说的 H5 是包 ...

  7. HTML5新特性--svg-echarts(重点)-拖动API-WebWorker

    一.html5新特性--svg--(折线/渐变特效对象/滤镜) #折线:多个坐标点组件一条折线 <polyline points="50,50 70,55 60,66 " s ...

  8. HTML5新特性-- -定时器

    一.定时器:一次性定时器/周期性定时器 #requestAnimationFrame 智能定时器 #此定时器主要使用范围:动画和游戏中 特点: setTimeout(fn,500); setInter ...

  9. 转: HTML5新特性之Mutation Observer

    转: HTML5新特性之Mutation Observer Mutation Observer是什么 Mutation Observer(变动观察器)是监视DOM变动的接口.当DOM对象树发生任何变动 ...

  10. HTML5新特性：FileReader 和 FormData

    连接在这里: HTML5新特性:FileReader 和 FormData

随机推荐

  1. iOS 开发之字典写入文件

    在最近的开发中阿,遇到一个问题,是我开始没有注意到的问题,某个羡慕后期维护的过程中发现一个bug,这个bug就是关于字典写入文件的.缘由是这样的,我用字典写入文件的方法 BOOL result = [ ...

  2. 解决ios不支持按钮:active伪类的方法

    mozilla开发社区上有 :active 不起作用的答案: [1] By default, Safari Mobile does not use the :active state unless t ...

  3. Navicat远程连接阿里云服务器的mysql

    问题描述: 本机为win10,mysql安装在阿里云(Ubuntu系统)上,本机使用Navicat远程连接mysql,遇到一些坑,求助于阿里云,最终解决,特此记录一下! 安装mysql sudo ap ...

  4. 利用PowerDesigner15在win7系统下对MySQL 进行反向工程（三）

    利用PowerDesigner15在win7系统下对MySQL 进行反向工程 1.选择"数据库-->Generate Database...",查看数据库表的SQL语句 2. ...

  5. Struts2(五)常量的配置

    Struts2 常量大多在 默认的配置文件中已经配置好,但根据用户的需求不同,开发的要求不同,需要修改这些常量值,修改的方法就是在配置的文件对常量进行重新配置 在struts.xml 文件中使用< ...

  6. javaWeb之eclipse创建Servlet模板快捷键设置

    没有模板创建Servlet 出现的是除了doPOST 和doGet方法 还有许多方法和一些注释,页面不够清晰 创建模板的步骤是: 1.点击window下的preference 选项 2在 表单框里填写 ...

  7. 电脑中安装多个jdk，eclipse的选择！

    以前自己写java程序的时候,没有用到什么高级的东西,所以没咋关注eclipse中jdk的版本问题: 但是随着学习的深入,难免会用到别人的项目,那么在导入别人的项目过程中就会发现时长有问题,而很多情况 ...

  8. Java冒泡排序法升级版

    /*  * 冒泡排序之升级版,可比较整型数组.小数型数组  *   * */ public static <T extends Comparable<T>> void Bubb ...

  9. [USACO07NOV]Cow Relays

    map+floyed+矩阵乘法(倍增floyed) # include <stdio.h> # include <stdlib.h> # include <iostrea ...

  10. [POI2010]CHO-Hamsters

    KMP暴力求出next数组后 实际上是一个最短路问题,floyed搞一搞 然而会TLE 矩阵优化一下即可(倍增floyed) KMP在弱数据下可以AC..正解请看其他人博客 # include < ...