Canvas createRadialGradient API
Canvas createRadialGradient API
<!DOCTYPE html>
<html lang="en"> <head>
<meta charset="UTF-8">
<title>createRadialGradient</title>
</head> <body>
<canvas id='myCanvas' width='800' height='600'>
your browser does not support canvas
</canvas>
<script type="text/javascript">
var c = document.getElementById('myCanvas');
var ctx = c.getContext('2d');
var grd = ctx.createRadialGradient(100, 100, 10, 100, 100, 100);
grd.addColorStop(0, '#00ff00');
grd.addColorStop(1, '#ff0000');
ctx.fillStyle = grd;
ctx.fillRect(0, 0, 200, 200);
</script>
</body> </html>
Canvas createRadialGradient API的更多相关文章
- javascript canvas全部API
HTMLCanvasElement//canvas elem对象 属性 height//高 width//宽 方法 getContext()//获取<canvas>相关的可绘制的上下文 t ...
- canvas绘图API详解
canvas绘图API详解 1.context的状态 矩阵变换属性 当前剪辑区域 context的其他状态属性: strokeStyle, fillStyle, globalAlpha, lineWi ...
- Html5 学习系列（五）Canvas绘图API快速入门（2）
Canvas绘图API Demos 上一篇文章中,笔者已经给大家演示了怎么快速用Canvas的API绘制一个矩形出来.接下里我会在本文中给各位介绍Canvas的其他API:绘制线条.绘制椭圆.绘制图片 ...
- Html5 学习系列（五）Canvas绘图API快速入门（1）
引言:Canvas绘图API快速入门 在接触HTML5的初学者包括我都在很多地方见到非常炫的一些页面,甚至好多学习HTML5的开发者都是冲着Web端的页游去的,那么HTML5那么绚丽的页面效果以及游戏 ...
- 引言：Canvas绘图API快速入门
引言:Canvas绘图API快速入门 在接触HTML5的初学者包括我都在很多地方见到非常炫的一些页面,甚至好多学习HTML5的开发者都是冲着Web端的页游去的,那么HTML5那么绚丽的页面效果以及游戏 ...
- HTML5之canvas基本API介绍及应用 1
一.canvas的API: 1.颜色.样式和阴影: 2.线条样式属性和方法: 3.路径方法: 4.转换方法: 5.文本属性和方法: 6.像素操作方法和属性: 7.其他: drawImage:向画布上绘 ...
- Canvas原生API(纯CPU)计算并渲染三维图
Canvas原生API(纯CPU)计算并渲染三维图 前端工程师学图形学:Games101 第三次作业 利用Canvas画三维中的三角形并使用超采样实现抗锯齿 最终完成功能 Canvas 原生API实现 ...
- html5 canvas常用api总结(二)--绘图API
canvas可以绘制出很多奇妙的样式和美丽的效果,通过几个简单的api就可以在画布上呈现出千变万化的效果,还可以制作网页游戏,接下来就总结一下和绘图有关的API. 绘画的时候canvas相当于画布,而 ...
- canvas的api小结
HTML <canvas id="canvas"></canvas> Javascript var canvas=document.getElementBy ...
随机推荐
- WebDriver(Selenium2) 常见异常及处理方法
http://uniquepig.iteye.com/blog/1568197 Exception NoSuchElementException Solutions 1. Check the l ...
- android — JNI注册方法说明
Jni中还可以采用RegisterNatives来注册jni的方法,注册以后的jni函数的命名可以不需要符合类似javah命令生成的函数的规则 RegisterNatives为JNIEnv的成员函数, ...
- jQuery.Autocomplete实现自动完成功能-搜索提示功能
$(function(){ var availableTags=["ads","abc","acc"]; $("#tags&quo ...
- STM32之FreeRTOS
STM32之FreeRTOS http://www.freertos.org/index.html http://www.freertos.org/a00090.html#ST http://www. ...
- spring调用mongodb
1.环境 Jdk:1.6.0_10-rc2 Spring3.1.2 下载 依赖jar文件: 2.相关配置 ①.spring配置文件 <?xml version="1.0" ...
- #Pragma Pack(n)与内存分配
#pragma pack(n) 解释一: 每个特定平台上的编译器都有自己的默认"对齐系数"(也叫对齐模数).程序员可以通过预编译命令#pragma pack(n),n=1,2,4, ...
- Android 编译错误
本人使用的是Android studio1.3版本,前几天调试通过的项目,现在编译出现了错误.错误信息如下 Project app: apk dependencies can only be jars ...
- 使用flexbox来布局web应用
使用 flexbox 可以帮助你设计出引人注目的布局,并且在pc端或移动端能够很好的缩放.告别使用浮动的 <div> 元素.绝对定位 和一些JavaScript hacks, 使用仅仅几行 ...
- WebService 使用wsdl.exe生成代理类
利用wsdl.exe生成webservice代理类: 根据提供的wsdl生成webservice代理类 1.开始->程序->Visual Studio 2005 命令提示 2.输入如下红色 ...
- Thinking in scala (5)----高阶函数*
高阶函数是函数式编程里面一个非常重要的特色,所谓的高阶函数,就是以其它函数作为参数的函数. 下面以一个小例子演示Scala的高阶函数特性,非常有意思,也非常强大. 首先看这么一个程序: code1: ...