我有一个可以从SVG表生成HTML图像的代码。 JSFiddle link.
生成image时出现问题：每个元素都模糊不清，就像放大图像一样。
我尝试更改字体大小，使用pt，em或px ...尝试更改表格的宽度和高度...相同的结果。
我想在HTML中看到我的table SVG 1：1。这有什么问题？
答案 0 :(得分：1)
此代码中存在两个问题。
首先，您需要根据需要动态缩放画布。缩放画布时，您也在缩放画布的2dcontext区域中的像素，并且它们不像html或svg那样缩放;它们像像素一样成像。这是模糊的原因。
第二个问题被第一个问题掩盖了;您正在创建的svg文档并不知道如何自动调整大小，因此将svg元素的宽度和高度设置为100％不会产生任何影响。所以，我的建议：
在jQuery中动态创建canvas标签，并使用设置为表边框宽度的width和height属性创建它。在您之前调整canvas元素大小的代码中的位置执行此操作。最简单的方法是用div替换canvas元素：
<div id="canvasy"></div>
然后，将canvas元素动态地附加到它：
$('#canvasy').append('<canvas id="canvas" width="'+($(id).width()+5)+'" height="'+($(id).height()+5)+'"></canvas>');
构建svg时，请在svg元素中使用相同的宽度/高度值。