当前位置：网站首页>使用Canvas 绘制施工进度/影像图，支持滚动、缩放、拖拽、定位、折叠、下载、过渡，支持快捷操作

使用Canvas 绘制施工进度/影像图，支持滚动、缩放、拖拽、定位、折叠、下载、过渡，支持快捷操作

2022-08-06 05:18:00 【rudy_zhou】

分享一个工作中使用canvas制作的一个施工进度/影响记录图，代码较长，就不解释了，有兴趣的小伙伴可以查看演示效果，有问题可以下方留言

在这里插入图片描述

支持操作：

1.比例缩放：鼠标在画布内时支持 Ctrl + 滚轮缩放，Ctrl + alt + 滚轮快速缩放；

2.横向滚动：鼠标在画布内时支持 shift + 滚轮横向滚动，shift + alt + 滚轮快速横向滚动

3.画布拖拽：鼠标在画布内可拖拽画布

4.下载支持：根据当前缩放比例下载，最大支持65000px 宽度画布;

5.宽高自适应：切换宽高自动重新绘制画布内容

如想测试下载功能，进入 http://www.rudyjoy.cn/render

以上信息如有错误或疏漏，欢迎指正

版权声明
本文为[rudy_zhou]所创，转载请带上原文链接，感谢
https://blog.csdn.net/rudy_zhou/article/details/114532103