Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

imgType为"jpeg"时,输出的base64是全黑的图片 #23

Open
zwj9297 opened this issue Oct 27, 2020 · 8 comments
Open

imgType为"jpeg"时,输出的base64是全黑的图片 #23

zwj9297 opened this issue Oct 27, 2020 · 8 comments

Comments

@zwj9297
Copy link

zwj9297 commented Oct 27, 2020

配置如下:
options: { lastWriteSpeed: 1, //书写速度 [Number] 可选 lastWriteWidth: 2, //下笔的宽度 [Number] 可选 lineCap: 'round', //线条的边缘类型 [butt]平直的边缘 [round]圆形线帽 [square] 正方形线帽 lineJoin: 'round', //线条交汇时边角的类型 [bevel]创建斜角 [round]创建圆角 [miter]创建尖角。 canvasWidth: 640, //canvas宽高 [Number] 可选 canvasHeight: 240, //高度 [Number] 可选 isShowBorder: true, //是否显示边框 [可选] bgColor: '#FFF', //背景色 [String] 可选 注:这背景色仅仅只是canvas背景,保存的图片仍然是透明的 borderWidth: 1, // 网格线宽度 [Number] 可选 borderColor: theme['border-color-base'], //网格颜色 [String] 可选 writeWidth: 5, //基础轨迹宽度 [Number] 可选 maxWriteWidth: 30, // 写字模式最大线宽 [Number] 可选 minWriteWidth: 5, // 写字模式最小线宽 [Number] 可选 writeColor: theme['text-color'], // 轨迹颜色 [String] 可选 isSign: true, //签名模式 [Boolean] 默认为非签名模式,有线框, 当设置为true的时候没有任何线框 imgType:'png' //下载的图片格式 [String] 可选为 jpeg canvas本是透明背景的 }
请问是什么原因?

@langyuxiansheng
Copy link
Owner

看到了,因为canvas的画板属性未设置颜色,jpeg的情况下可能会出现刚刚那种情况显示的黑色的,但是下载的图片并非黑色。

@zwj9297
Copy link
Author

zwj9297 commented Nov 19, 2020

看到了,因为canvas的画板属性未设置颜色,jpeg的情况下可能会出现刚刚那种情况显示的黑色的,但是下载的图片并非黑色。

请问能否支持设置背景色呢,我不需要下载的,只是要base64的不透明底的图片

@langyuxiansheng
Copy link
Owner

看到了,因为canvas的画板属性未设置颜色,jpeg的情况下可能会出现刚刚那种情况显示的黑色的,但是下载的图片并非黑色。

请问能否支持设置背景色呢,我不需要下载的,只是要base64的不透明底的图片

这个如果要从插件这边解决的话,需要更改画布的底色,但是目前的需求来看,大部分的底色基本上都是透明的,其实有个解决方案,就是将设置的背景色一起保存到服务端,在回显的时候将背景渲染到对应的dom容器,即可实现背景 + 画笔轨迹.如果颜色是固定值,直接写死到对应的容器背景即可

@nullhan
Copy link

nullhan commented Feb 24, 2021

这个情况我遇到过,你把body的背景色去掉

@ginkosen
Copy link

ginkosen commented Apr 9, 2021

@langyuxiansheng 能否在组件上加一个选项,控制bgcolor的值是否要被渲染到canvas上。
1、false(默认),逻辑依旧按照原始的通过style设置背景色
2、true,颜色会被渲染到canvas上。

这样做的原因,背景色可能在后续的业务配置中发生变更。

1、如果存储数据中一起把底色存起来,也可以,但是增加了逻辑
2、如果不存储使用实时的颜色配置展示签名图片,可能会出现以前设置是红色笔迹,某天修改背景色为红色。这没法看了。

@langyuxiansheng
Copy link
Owner

@langyuxiansheng 能否在组件上加一个选项,控制bgcolor的值是否要被渲染到canvas上。
1、false(默认),逻辑依旧按照原始的通过style设置背景色
2、true,颜色会被渲染到canvas上。

这样做的原因,背景色可能在后续的业务配置中发生变更。

1、如果存储数据中一起把底色存起来,也可以,但是增加了逻辑
2、如果不存储使用实时的颜色配置展示签名图片,可能会出现以前设置是红色笔迹,某天修改背景色为红色。这没法看了。

感谢反馈.之前是考虑过这个的.若如此做的话,就无法输出透明背景的图片了. 但是这个功能呢可以考虑后面加入,后面空了的时候再做了

@ginkosen
Copy link

ginkosen commented Apr 9, 2021

@langyuxiansheng 能否在组件上加一个选项,控制bgcolor的值是否要被渲染到canvas上。

1、false(默认),逻辑依旧按照原始的通过style设置背景色

2、true,颜色会被渲染到canvas上。

这样做的原因,背景色可能在后续的业务配置中发生变更。

1、如果存储数据中一起把底色存起来,也可以,但是增加了逻辑

2、如果不存储使用实时的颜色配置展示签名图片,可能会出现以前设置是红色笔迹,某天修改背景色为红色。这没法看了。

感谢反馈.之前是考虑过这个的.若如此做的话,就无法输出透明背景的图片了. 但是这个功能呢可以考虑后面加入,后面空了的时候再做了

感谢回复,我给的方案允许使用者自己选择。毕竟有些场景下签名背景肯定是要保留。

@langyuxiansheng
Copy link
Owner

@langyuxiansheng 能否在组件上加一个选项,控制bgcolor的值是否要被渲染到canvas上。

1、false(默认),逻辑依旧按照原始的通过style设置背景色

2、true,颜色会被渲染到canvas上。

这样做的原因,背景色可能在后续的业务配置中发生变更。

1、如果存储数据中一起把底色存起来,也可以,但是增加了逻辑

2、如果不存储使用实时的颜色配置展示签名图片,可能会出现以前设置是红色笔迹,某天修改背景色为红色。这没法看了。

感谢反馈.之前是考虑过这个的.若如此做的话,就无法输出透明背景的图片了. 但是这个功能呢可以考虑后面加入,后面空了的时候再做了

感谢回复,我给的方案允许使用者自己选择。毕竟有些场景下签名背景肯定是要保留。

这个功能在后面空了就开发,预计下个版本发布.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants