小编Aus*_*inC的帖子

canvg生成的画布在视网膜屏幕上模糊

我正在使用Raphael绘制一个对象,然后使用canvg将其转移到HTML canvas元素,以便我可以使用toDataURL将其保存为PNG.但是当我使用canvg时,生成的图像会模糊不清.例如,下面的代码产生了这个(raphael在顶部,canvg在底部):

在此输入图像描述

<html>
    <head>
        <script src="lib/raphael-min.js"></script>
        <script type="text/javascript" src="http://canvg.googlecode.com/svn/trunk/rgbcolor.js"></script> 
        <script type="text/javascript" src="http://canvg.googlecode.com/svn/trunk/StackBlur.js"></script>
        <script type="text/javascript" src="http://canvg.googlecode.com/svn/trunk/canvg.js"></script> 
        <script src="lib/raphael.export.js"></script>
    </head>
    <body>

    <div id="raph_canvas"></div><br> 
    <canvas id="html_canvas" width="50px" height="50px"></canvas>

    <script language="JavaScript">
    var test=Raphael("raph_canvas",50,50);
    var rect=test.rect(0,0,50,50);
    rect.attr({fill: '#fff000', 'fill-opacity':1, 'stroke-width':1})

    window.onload = function() {
        var canvas_svg = test.toSVG();
        canvg('html_canvas',canvas_svg);
        var canvas_html = document.getElementById("html_canvas");
    }

    </script>
    </body>
</html>

Run Code Online (Sandbox Code Playgroud)

在toDataURL创建的png中也很明显.知道这里发生了什么吗？我不认为这与重新调整大小有关.我尝试过设置ignoreDimensions:True和其他一些东西.

另一个数据点.如果我使用raphael输出一些文本,然后使用canvg,它不仅模糊,而且字体错误!

在此输入图像描述

这是test.rect(0.5,0.5,50,50)建议.仍然模糊:

在此输入图像描述

javascript svg canvas raphael canvg

Aus*_*inC

2015 05-21

10
推荐指数

2
解决办法

5352
查看次数

Kartograph python脚本使用不正确的纬度/长度坐标生成SVG

我修改了这个问题,以反映发现问题的一些进展.我使用以下python代码生成美国大陆的SVG.shapefile是无关紧要的,因为无论我使用什么shapefile,我描述的问题都会发生.脚本非常简单.我基本上只为美国采用shapefile并使用边界框排除夏威夷和阿拉斯加.

from kartograph import Kartograph

K = Kartograph()

blah={
    "layers": [
        {
        "id":"mylayer",
        "src":"/Users/austinc/Documents/shapefiles/states_21basic/states.shp",
        }
    ],
    "bounds":{
        "mode":"bbox",
        "data":[-130,25,-65,50],
    },
    "proj":{
        "id":"mercator"
    }
}

K.generate(blah,outfile='/Users/austinc/Desktop/mymap.svg')

Run Code Online (Sandbox Code Playgroud)

问题是此代码生成的svg具有与之关联的不正确坐标.当我使用javascript尝试在其上映射点时,这些点出现在正确的纬度,但是经过大约100度的经度.

当我使用来自Kartograph的预制SVG时,我没有这个问题(我还没有试过去掉阿拉斯加和夏威夷).所以关于我的python脚本的一些事情导致了这个,但我不明白.

固定:下面的评论让我想到这可能与预测有关.我删除了绘制图形作为mercator投影的python脚本部分,这修复了一切.我不确定我理解为什么,但如果你有类似的问题并找到这个问题:尝试更改你的投影或根本不使用投影.

python kartograph

Aus*_*inC

2013 11-19

6
推荐指数

1
解决办法

730
查看次数