2024-05-051、canvas图片绘制跨域问题解决方案Tainted canvases may not be exported。原因就在于使用了跨域的图片或者有两张不同来源的图片比如一张本地一张服务器，所以说是被污染的画布。renderjs是一个运行在视图层的js。但也许有可能服务器不让你跨域请求图片（也不知道为啥），那么用到方案2。大幅降低逻辑层和视图层的通讯损耗，提供高性能视图交互能力。这个报错折腾好久，开始以为是苹果的浏览器不支持这个插件，2、通过把请求的图片转化成base64再进行使用。解决图片跨域就ok了。_uniapp 使用html2canvas

https://www.qianduange.cn//article/6879.html 分类：前端知识

2024-04-30场景：今天同事提了个协助，将HTML5文件中的元素转为图片，并且最终转为base64格式传给后端。感觉还挺有意思就记录下。（试例如下）html部分（这个例子有一个特殊的地方，就是它会显示多个二维码标签。所有我这边使用 DOM来获取下父元素，然后再获取到底下的子元素。遍历下，一个一个转化为图片。代码如下，有不理解的可以留言讨论）">div内容">div内容//1、获取下父元素。_html2canvas 转base64

https://www.qianduange.cn//article/6667.html 分类：前端知识

2024-03-21需求：html页面转换pdf，页面有多个模块，页面中有文本、echarts、表格等模块，一个模块占一页，因为模块高度不够，所以需要垂直居中通过html2canvas和jspdf实现，html2canvas用于将页面元素生成canvas，jspdf用于将页面元素导出pdf效果：以下代码可以直接运行，背景图需要自行加一下注意点：背景图片不支持跨域图片，非要使用跨域图片。可以通过js转成base64，使用base64设置背景图片_html2canvas js.pdf 生成pdf 一页添加一张图片

https://www.qianduange.cn//article/4049.html 分类：前端知识

2024-02-12view class="exportPdfBtn" @click="downKcReport()">导出PDF//如果将水印列数设置为0，或水印列数设置过大，超过页面最大宽度，则重新计算水印列数和水印x轴间隔。watermark_fontsize: '14px', //水印字体大小。watermark_y_space: 102, //水印y轴间隔。watermark_x_space: 80, //水印x轴间隔。watermark_font: '微软雅黑', //水印字体。_前端导出加水印

https://www.qianduange.cn//article/1853.html 分类：前端知识

2024-02-11uniapp vue3 html2canvas canvas2image也可以实现，主要是实现的过程中以为需要这个插件，但最后发现不用也不影响。（2）vue3写法，callMethod定义的方法，无法在主script中触发，不能使用setup语法糖的写法。安卓系统 uniapp实现app端根据dom元素，生成图片，通过uni的系统分享，分享到微信，qq，朋友圈等。（1）uniapp不能直接操作dom元素，需要使用renderjs，在视图层操作dom元素。_vue3 html2canvas

https://www.qianduange.cn//article/1719.html 分类：前端知识

2024-02-03script的module的名称可以随便取，module=(值任意，相当于命名空间，之后会根据这个名字调用其中的方法),但是change:参数名称必须和module保持一致，虽然不会阻断renderjs的运行，但是会报错，也会导致无法捕获数据的变化。对于UNI APP端的开发而言，由于上并没有document，不能进行相关的DOM操作，同时有关DOM渲染的第三方库(echart、openlayer、canvas等)也无法有效的使用，因此官方推出了renderjs方案，来解决上述问题。_uniapp html2canvas

https://www.qianduange.cn//article/1183.html 分类：前端知识

2024-01-26解决 html2canvas 的兼容IOS问题_html2canvas ios兼容

https://www.qianduange.cn//article/432.html 分类：前端知识