<!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. iOS开发之多线程技术（NSThread、OperationQueue、GCD）

    在前面的博客中如果用到了异步请求的话,也是用到的第三方的东西,没有正儿八经的用过iOS中多线程的东西.其实多线程的东西还是蛮重要的,如果对于之前学过操作系统的小伙伴来说,理解多线程的东西还是比较容易的 ...

  2. java 线程 Thread 使用介绍，包含wait(),notifyAll() 等函数使用介绍

    (原创,转载请说明出处!谢谢--http://www.cnblogs.com/linguanh/) 此文目的为了帮助大家较全面.通俗地了解线程 Thread 相关基础知识! 目录: --线程的创建: ...

  3. 让自己也能使用Canvas

    <canvas> 是 HTML5 新增的元素,可使用JavaScript脚本来绘制图形.例如:画图,合成照片,创建动画甚至实时视频处理与渲染. 兼容性方面,除了一些骨灰级浏览器IE6.IE ...

  4. PHP中MySQL操作

    本次使用的demo是MySQL的示例数据库employees,点击下载地址,注意在导入的时候,在employees.sql文件中,将source改成你当前的目录. PHP中的demo代码可以在ideo ...

  5. 第一章 Linux內核簡介

    1. Linux是類Unix系統,但他不是Unix. 儘管Linux借鑑了Unix的許多設計並且實現了Unix的API(由Posix標準和其他Single Unix Specification定義的) ...

  6. 测试驱动开发与Python

    最近在看一本书<Test-Driven Development with Python>,里面非常详细的介绍了如何一步一步通过测试驱动开发(TDD)的方式开发Web项目.刚好这本书中使用了 ...

  7. 重温JSP学习笔记--与日期数字格式化有关的jstl标签库

    上一篇笔记写的主要是JSTL的core标签库,如果想对一些数字或者日期做一些操作或者在网页上显示指定格式的数字或日期,jstl还提供了另一个fmt标签库,这里简单介绍一下: 第一步,导入标签库: &l ...

  8. 【LeetCode】Verify Preorder Serialization of a Binary Tree（331）

    1. Description One way to serialize a binary tree is to use pre-order traversal. When we encounter a ...

  9. 使用Github进行合作开发

    首先需要注册自己的github账号,然后 在本地生成ssh-key: 安装git,在本地任何文件夹上,右键,选择git bash here: 然后: git config --global user. ...

  10. effective java 读后感

    think in java  , effective java  这两本书一直都在java的生态圈中经久不衰.本来想着先翻过 think in java 这本大山,但是读到一半就放弃了.过长的篇幅,让 ...