canvas绘制圆图输出图片格式
function drawCircleImage(url, callback) {
const canvas = document.createElement('canvas');
const img = new Image();
img.setAttribute("crossOrigin", 'Anonymous');
img.src = url;
img.onload = function() {
canvas.width = img.width;
canvas.height = img.height;
let ctx = canvas.getContext("2d");
//获取图片宽高的最小值
let min = Math.min(img.width, img.height);
let r = min / 2;
ctx.fillStyle = ctx.createPattern(img, 'no-repeat');
ctx.clearRect(0, 0, img.width, img.height);
ctx.arc(img.width / 2, img.height / 2, r, 0, Math.PI * 2);
ctx.fill();
let base64 = canvas.toDataURL("image/jpeg");
callback(base64);
};
}
canvas绘制圆图输出图片格式的更多相关文章
- 解决html5 canvas 绘制字体、图片与图形模糊问题
html5 canvas 绘制字体.图片与图形模糊问题 发生情况 多出现在高dpi设备,这意味着每平方英寸有更多的像素,如手机,平板电脑.当然很多高端台式电脑也有高分辨率高dpi的显示器. canva ...
- 小程序canvas绘制base64数据格式图片
翻了微信小程序官方文档,看了看画板drawImage的用法,官方对所要绘制的图片资源路径并没有很详细,模棱两可,没说支持什么格式的路径.今天我就试一下支不支持base64格式的图片 随便找张图片从网上 ...
- 输出图片格式BARTENDER
try { BarTender.Application btApp = new BarTender.Application(); BarTe ...
- canvas 绘制刮刮卡
思路=> 用div来展示刮奖结果,用canvas绘制刮奖前展示的图片或者文字:将canvas叠在div上方,刮奖是只需要操作canvas配合touch事件即可简单完成. canvas刮奖可以用g ...
- canvas绘制图片
canvas保存为data:image扩展功能的实现 [已知]canvas提供了toDataURL的接口,可以方便的将canvas画布转化成base64编码的image.目前支持的最好的是png格式, ...
- MVC控制下输出图片、javascript与json格式
/// <summary> /// 输出图片 /// </summary> /// <returns></returns> public ActionR ...
- 使用html5 canvas绘制图片
注意:本文属于<html5 Canvas绘制图形入门详解>系列文章中的一部分.如果你是html5初学者,仅仅阅读本文,可能无法较深入的理解canvas,甚至无法顺畅地通读本文.请点击上述链 ...
- Canvas 中drawImage 绘制不出图片
在使用Canvas的drawImage绘制图片时,却发现绘制不出图片,原因是图片是异步加载,图片加载完再绘制. //html <img src="1.png" /> & ...
- C++ 输出PPM格式图片文件
PPM简介 学习图形学时为了直观地观察结果,需要输出图片,而PPM是一种最简单的图片格式,非常适合新手使用. PPM文件的内容大概是这样的: 第一行固定为P3,代表写入的是PPM格式的RGB图像,除此 ...
随机推荐
- Django2.X报错-------ModuleNotFoundError: No module named 'django.core.urlresolvers'
django2.0 把原来的 django.core.urlresolvers 包 更改为了 django.urls包.所以将导入的包修改为django.urls.
- Unexpected error: java.security.InvalidAlgorithmParameterException: the trustAnchors parameter must be non-empty 报错
项目中遇到的获取https的数据接口数据时,Unexpected error: java.security.InvalidAlgorithmParameterException: the trustA ...
- 阿里云ossfs配置
Github:https://github.com/aliyun/ossfs/wiki Root账户卸载:umount /挂载目录非root用户要卸载目录,请用:fusermount -u your_ ...
- [phvia/dkc] Docker Compose 快速构建(LNMP+Node)运行环境
快速构建(LNMP+Node)运行环境. dkc 在此作为 docker-compose 的缩写,你可以理解为 alias dkc=docker-compose 准备 安装 docker 选择1) 从 ...
- Linux NGINX部署
一.Nginx简介 Nginx是一个web服务器也可以用来做负载均衡及反向代理使用,目前使用最多的就是负载均衡,具体简介我就不介绍了百度一下有很多,下面直接进入安装步骤 二.Nginx安装 1.下载N ...
- Unix/Linux系统的发展史
Unix/Linux系统相信是学编程的人都认识这两个系统.我们知道Unix要钱,而Linux免费,而且这两者之间的发展史是什么样的,是不是两者就是同一个东西呢? 我将会以时间的发展过程来一步步的给大家 ...
- ELK日志分析平台搭建
ELK平台介绍 在搜索ELK资料的时候,发现这篇文章比较好,于是摘抄一小段: 以下内容来自:http://baidu.blog.51cto.com/71938/1676798 日志主要包括系统日志.应 ...
- Game Engine Architecture 7
[Game Engine Architecture 7] 1.SRT Transformations When a quaternion is combined with a translation ...
- Linux系统中无iptables文件的解决
在RHEL 7 / CentOS 7中,firewalld被引入来管理iptables,CentOS7开始,默认是没有iptables的,而是使用firewall防火墙.本文将屏蔽掉firewall, ...
- 从裸机到实时操作系统RTOS
最近有点闲,公司新年过后一直没有项目,手头上维护的两个程序也比较稳定. 想起来去年做的商业时钟,做了一半,销售反馈回来说,市场不明朗,不建议往下开展,就搁置了,趁着现在有空,把他捡起来. 原来的代码都 ...