关于CANVAS画圆的弧度角度问题--转载自Slience
2016-09-20 12:43
246 查看
http://blog.csdn.net/u010513756/article/details/47054763
问题导入
[html] viewplain copy
print?
<body>
<canvas id="myCanvas" width="400" height="400" style="border:1px solid"></canvas>
</body>
<script>
window.onload = function(){
var canvas = document.getElementById("myCanvas");
var context = canvas.getContext("2d");
context.beginPath();
context.arc(100, 100, 100, 90, 270, true);
context.stroke();
context.closePath();
};
</script>
arc方法的参数是这样设置的arc(圆心的横坐标,圆心的纵坐标, 圆的半径,弧的起始角,弧的终止角,true/false(逆时针/顺时针))
这里的起始角是指x轴与弧的起点之间的夹角,终止角是指x轴与弧的终点之间的夹角,这里的夹角单位都是值弧度而不是度
也就是说上面的一个代码显示的不是如下图
而是这样的
造成这样的原因是因为,起始角和终止角的单位都是弧度我们写的90和270浏览器把他当作弧度来计算了,我们把90和270转换成角度可以得出分别是108和357度,正好是上图中下部分的那个起点逆时针距离X轴正方向的角度,终点也是如此。
那么如果我想要起点在90度终点在270度应该怎么做呢,毕竟我们常用的单位是角度而不是弧度
解决办法
很简单,把角度换算成弧度就行,就像这样[javascript] view
plain copy
print?
context.arc(200, 200, 100, Math.PI*90/180, Math.PI*270/180, true);
这里的90和270就是我们常用的角度,乘上π/180就是弧度了
顶
相关文章推荐
- 关于c语言下面求正余弦后面是弧度还是角度的问题
- Unity中关于施加力的角度弧度问题
- 关于cocos2d-x中弧度和角度的转换问题
- 关于LUA中的随机数问题(转载)
- 【转载】.net关于获取客户端CPU,硬盘,MAC序列号的问题
- 关于WebWork2中的中文问题 选择自 chenyun2000 的 Blog (转载)
- 关于一些论坛转载文章的问题!
- 关于XP进程问题(转载)
- 关于文章转载的问题
- 关于C51精确延时问题(转载内容)
- 关于字节对齐的问题(vs.net)(转载)
- 关于ntfs和内核问题(转载)
- 关于“as”和“is”的问题(转载)
- 关于java中的几个问题(转载)
- 关于转载Spring 的MVC I18N-国际化相关配置出现的问题
- 转载:) 关于spring、hibernate、struts的一些错误问题 不断补充中(靠自己了)
- 关于DLL的若干问题 [转载]
- 关于两个对象交换的问题(实践的角度)
- 关于项目管理的七十五个问题的答案之MVM版本(转载)
- 关于赴东京留学的省钱问题(转载)