<!DOCTYPE HTML>
<head>
<meta charset = "utf-8">
<title>starGirl</title>
<style type="text/css">
#canvas{
border:1px solid #eee ;
display:block;
background-color: #B36666;
margin: 20px auto;
}
</style>
</head>
<body>
<div>
<canvas id = "canvas" width = "800px" height = "600px"></canvas>
</div>
<script type = "text/javascript" >
window.onload=function(){
var context = document.getElementById('canvas').getContext('2d')
//设置高宽，不建议在css里面设置，因为会不准确
canvas.height=800;
canvas.width=800;
arcToText(context,150,100,650,100,400,650,300);
function arcToText(context,x0,y0,x1,y1,x2,y2,R){
context.beginPath();
context.moveTo(x0,y0);
context.arcTo(x1,y1,x2,y2,R);

context.lineWidth=6;
context.strokeStyle='red';
context.stroke();

context.beginPath();
context.moveTo(x0,y0);
context.lineTo(x1,y1);
context.lineTo(x2,y2);

context.lineWidth=3;
context.strokeStyle='yellow';
context.stroke();
}
}
</script>
</body>
</html>

arcTo 画 狐行的更多相关文章

  1. HTML 和 CSS 画三角形和画多边行基本原理及实践

    基本 HTML 标签 <div class = 'test'></div> 基本 CSS 代码 .test { width: 100px; height: 100px; bac ...

  2. DevExpress的GridView设置特定行的样式

    GridView控件绑定事件: gridView_SampleData.CustomDrawCell += gridView_SampleData_CustomDrawCell; 根据自定义逻辑来改变 ...

  3. canvas之arcTo

    arc与arcTo,从名字都能看出来相似.arcTo也是画曲线的方法,而且他画出的曲线也是正圆的一段弧线.但他的参数和arc简直是不共戴天~ ctx.arcTo(x1,y1,x2,y2,radius) ...

  4. 怎么画一条0.5px的边

    编者按:本文由人人网FED发表于掘金,并已授权奇舞周刊转载 什么是像素? 像素是屏幕显示最小的单位,在一个1080p的屏幕上,它的像素数量是1920 1080,即横边有1920个像素,而竖边为1080 ...

  5. HTML5资料

    1 Canvas教程 <canvas>是一个新的用于通过脚本(通常是JavaScript)绘图的HTML元素.例如,他可以用于绘图.制作图片的组合或者简单的动画(当然并不那么简单).It ...

  6. Windows API 函数浏览

    AbortDoc                                          终止一项打印作业                        是         是        ...

  7. canvas基础[一]探究出初中数学知识

    何时用SVG何时用canvas SVG 矢量图,视觉清晰,文件小 <svg viewBox="0 0 100 100"> <circle cx="50& ...

  8. 自定义view---仪表盘--kotlin

    我们知道一个自定义view一般来说需要继承view或者viewGroup并实现onMeasure, onLayout, onDraw方法. 其中onMeasure用于测量计算该控件的宽高, onLay ...

  9. Win 10 UWP开发系列：设置AppBarButton的图标

    在WP8以前,页面最下面的四个小圆按钮是不支持绑定的,WP8.1 RT之后,系统按钮升级成了AppBarButton,并且支持绑定了.在Win10 UWP开发中,按钮的样式发生了变化,外面的圆圈没有了 ...

随机推荐

  1. npm上传自己的项目

    npm安装就不介绍了,自行度娘.本文介绍npm上传 先初始化:npm init 根据提示填完系统介绍信息(package.json): 再登录npmjs: npm login 效果如图: 输入注册的用 ...

  2. ar命令详解

    ar 命令 用途 维护链接编辑器使用的索引库. 语法 ar [  -c ] [  -l ] [  -g | -o ] [  -s ] [  -v ] [  -C ] [  -T ] [  -z ] { ...

  3. Front End Developer Questions 前端开发人员问题（二）CSS 后续

    问题来源:http://markyun.github.io/2015/Front-end-Developer-Questions/ 31.视差滚动效果,如何给每页做不同的动画?(回到顶部,向下滑动要再 ...

  4. WebGIS中一种根据网格索引判断点面关系的方法

    文章版权由作者李晓晖和博客园共有,若转载请于明显处标明出处:http://www.cnblogs.com/naaoveGIS/. 1.背景 判断点面关系的算法有很多,在我之前的博文中有一篇专门对其进行 ...

  5. WebGIS中兴趣点简单查询、基于Lucene分词查询的设计和实现

    文章版权由作者李晓晖和博客园共有,若转载请于明显处标明出处:http://www.cnblogs.com/naaoveGIS/. 1.前言 兴趣点查询是指:输入框中输入地名.人名等查询信息后,地图上可 ...

  6. C#的DataTable操作方法

    1.将泛型集合类转换成DataTable(表中无数据时使用): public static DataTable NullListToDataTable(IList list) { var result ...

  7. canvas刮刮乐和画笔

    这周有点迷茫,不知道干嘛了,一天天就过去了!我在博客右侧公告栏加了qq交流,各位有好的主题,或者有趣的技术,欢迎交流!今天突发奇想,就写了2个h5 canvas的demo玩玩! demo一:刮刮乐 舍 ...

  8. [Java 基础]控制语句

    选择语句 if语句 if语句会判断括号中的条件是否成立,如果成立则执行if语句中的代码块,否则跳过代码块继续执行. 语法 if(布尔表达式) {    //如果布尔表达式为true将执行的语句 } 例 ...

  9. opengl 读取3ds(stl)文件

    没有解决: mark 几个网站: 1 http://blog.csdn.net/icebergkevin/article/details/18974235 能实现二维的 2 http://www.cn ...

  10. jQuery-1.9.1源码分析系列（三） Sizzle选择器引擎——一些有用的Sizzle API

    说一下Sizzle中零碎的API.这些API有的被jQuery接管,直接使用jQuery.xxx就可以使用,有的没有被接管,如果要在jQuery中使用,使用方法是jQuery.find.xxx. 具体 ...