SVG中风宽度在html 5画布上很混乱

我想将SVG绑定到画布上。 SVG具有笔触宽度设置，它似乎比绑定到画布时所需要的要厚。什么可能导致这种情况，以及如何解决这个问题？SVG中风宽度在html 5画布上很混乱

，我使用绑定SVG到HTML5画布该库是canvg

下JS小提琴同时显示了SVG和画布上结合的SVG。

var image = new Image(); 
var canvas = document.createElement('canvas'); 
canvas.width =1090; 
canvas.height = 1875; 
var context = canvas.getContext('2d'); 
context.drawSvg(xml, 0, 0); 
image.src = canvas.toDataURL();

来源

2016-09-08 Abishek R Srikaanth

据的链接：http://jsfiddle.net/fYAAf/111/

在您正在嵌入SVG的特性在一个类型标记（图像）的JavaScript代码。其结果是这样的：

<img src="data:image/png;basQAACAnWQXByGjnghZGYT8......characteristic_of_SVG">

所以，你应该尝试把一个SVG标签内的所有XML属性，因为它是写在HTML文档中的jsfiddle的例子的顶部。

在JavaScript中的东西快速将：

var xml = "<svg> (Write here xml properties) <g><text (Write here text properties)><tspan dy="35" x="0">Test</tspan></text></g></svg>"; 
 

 
document.getElementById('container').innerHTML = xml;

<div id="container"></div>

我不知道是什么的这种行为中的img标签的原因。

来源

2016-09-08 01:09:04

SVG中风宽度在html 5画布上很混乱

回答

相关问题