CreateJS 绘制图形2

最新推荐文章于 2021-12-29 09:27:49 发布

冰灵

最新推荐文章于 2021-12-29 09:27:49 发布

阅读量3.6k

点赞数

分类专栏： HTML5 JS 文章标签： JavaScript HTML5 Canvas JavaScript引擎

本文链接：https://blog.csdn.net/bud_icelf/article/details/8921806

版权

本文详细介绍了使用EaselJS库进行图形绘制，包括绘制椭圆、星形、复杂圆角矩形、创建渐变效果以及用图片填充图形等实例，适合JavaScript和HTML5 Canvas开发者参考。

摘要由CSDN通过智能技术生成

个人原创,欢迎转载,转载请注明出处http://blog.csdn.net/bud_icelf QQ:909648986

EaselJS 绘制图形2

本节将介绍使用Shape对象,绘制椭圆,绘制星形,绘制复杂的带圆角矩形,创造渐变效果,用图片填充绘图.

例子1 绘制椭圆

<!DOCTYPE html>
<html>
<head>
	<meta charset="gbk">
	<script type="text/javascript" src="easeljs-0.6.0.min.js"></script>
</head>
<body>
	<canvas id="myCanvas" width="200" height="200">
		你的浏览器不支持canvas标签
	</canvas>
	<script>
		var myCanvas=document.getElementById("myCanvas");
		var stage=new createjs.Stage(myCanvas);
		var shape=new createjs.Shape();
		var graphics=shape.graphics;
		graphics.beginFill("red");
		graphics.drawEllipse(5, 5, 60, 120);
		stage.addChild(shape);
		stage.update();
	</script>
</body>
</html>

效果显示