图片绘制在圆中

首页课程实战体系课手记专栏慕课教程

图片绘制在圆中

来源：6-6 编程练习

慕哥1161892

2018-12-20 16:10:37

<!DOCTYPE html>

<html>

<head>

<title>canvas图片</title>

<style>

canvas{background-color:lightblue;}

</style>

</head>

<body>

<canvas id="canvas" width="800px" height="800px">您的浏览器不支持canvas

</canvas>

var canvas=document.getElementById("canvas");

var context=canvas.getContext('2d');

//此处填充代码

var img=new Image();

img.src='http://climg.mukewang.com/59a7df40000165fa06000600.jpg';

img.onload=function(){

context.drawImage(img,220,-20,400,240,330,330,200,120);

}

context.arc(400,400,120,0,2*Math.PI,true);

context.fillStyle='#7d7263';

context.fill();

</script>

</body>

</html>

那个drawImage里面的参数还是设置不出效果图的样子，右边总是有一大块背景区域超出圆

写回答

1回答

慕哥1161892

提问者

2018-12-20

不用回复了，重新看了视频后发现一开始对参数理解错误了

0 学习 · 626 问题

查看课程

相似问题

怎么让图片绘制出来是圆形的

回答 1

老师能给出案例代码吗，实在是不知道怎么弄成圆形

回答 1

canvas图片有什么用呢？

回答 1

这样绘制的方法，为什么绘制到canvas中图像老是藏在下面

回答 1

水印不能显示在图片上？

回答 1

打开慕课网App查看更多内容