[英]html2canvas text-shadow bug
i have this code http://jsfiddle.net/nuu7B/2/ 我有这个代码http://jsfiddle.net/nuu7B/2/
html2canvas($('#preview'), {
onrendered: function (canvas) {
var canvasImg = canvas.toDataURL("image/jpg");
$('#canvasImg').html('<img src="'+canvasImg+'" alt="">');
}
});
and i'm using html2canvas to export image. 我正在使用html2canvas导出图像。 But as you can see, the text-shadow it's not working as it should.
但是正如您所看到的,文本阴影不能正常工作。
text-shadow: -2px 0 #000, 0 2px #000, 2px 0 #000, 0 -2px #000;
i know canvas support text-shadow but the html2canvas is the problem here.. 我知道画布支持文本阴影,但是html2canvas是这里的问题。
How can I fix that? 我该如何解决? thanks
谢谢
html2canvas has only basic text-shadow support: html2canvas仅具有基本的文本阴影支持:
// Not supported: text-shadow: -2px 0 #000, 0 2px #000, 2px 0 #000, 0 -2px #000;
// Just the basic X-offset, Y-offset, blur, color
text-shadow: 1px 2px 3px #555;
Some options: 一些选项:
Submit a pull request here: https://github.com/niklasvh/html2canvas/pulls 在此处提交拉取请求: https : //github.com/niklasvh/html2canvas/pulls
Position a CSS shadow styled html element over the canvas where you need it 在需要的画布上放置CSS阴影样式的html元素
Experiment drawing multiple abutting shadows on html canvas to see if you can create what you need. 请尝试在html画布上绘制多个相邻的阴影,以查看是否可以创建所需的内容。
//This function will select each and every svg text and will apply the css //此函数将选择每个svg文本,并将应用css
function styleToSVGText () {
var SVGTextArr = $('svg text');
SVGTextArr.each(function (i, item) {
$(item).css({
'text-rendering': 'optimizeLegibility',
'font-family': 'sans-serif',
'text-shadow': 'transparent'
})
});
};
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.