首页 文章

使用SVG进行2D渲染和放大

提问于
浏览
7

我的任务是开发一种算法,将不同类型的曲线拟合到二维空间中的给定点序列上 .

为了能够测试我的算法,我选择了SVG来显示结果 . 我有几个问题 .

由于我的算法可能有非常不同的输入和输出,因此我必须能够放大查看生成的SVG文件!

但是SVG中的路径只能以一定的宽度显示 . 如果我放大,那么路径的宽度会变宽 . 我希望宽度在所有缩放级别为例如1像素 . 这有解决方案吗?

另外:SVG可以显示点吗?是的,简单,原始点 . 我发现它不能 .

谢谢

3 回答

  • 1

    许多其他矢量格式(如PostScript和PDF)将允许您为"hairline"笔划使用笔划宽度0 . SVG不是这样 . 但是,如果您使用百分比笔画宽度,我认为您可以达到您想要的效果 . 请参阅the w3c SVG specifications for details,但基本上,您应该可以执行以下操作:

    stroke-width:"1%"
    

    无论缩放级别如何,都应该使用与边界矩形不变的1%的线宽来描绘曲线 .

    至于点,SVG过去没有这样做过(使用PostScript)我总是使用arc with a small redius绘制一个小圆圈(如果你愿意的话,你可以用它来填充一个点) .


    @Zoli:在您发表评论之后,我打算建议您研究一下PostScript,这样当我遇到non-scaling-stroke vector-effect in the SVG specification时你就可以使用细线笔画宽:

    vector-effect="non-scaling-stroke"
    

    根据规范,只需将其添加到曲线中,它应该对缩放不变 . 他们的例子使用 line ,但它也适用于你的曲线 .

  • 0

    目前在SVG中没有<point>元素或类似的元素,但在SVG WG中已经讨论过添加,因此将来可能会包含它 . 随意将您对<point>元素的需求和要求发送到公共svg邮件列表:www-svg@w3.org .

    解决方法是使用例如<line>元素并使它们的长度为零,如果您希望可以使用圆形线条使其显示一个点 . 这一切都取决于你需要什么 . r = 0的圆可能更合适 .

    具有值“非缩放中风”的“矢量效应”属性是您应该用来表示笔划不应缩放的内容 . 如果本地不支持“矢量效果”,那么实现一个确保笔划正确缩放的javascript解决方案并不困难 . Opera 9.5原生支持它 .

  • 8

    谢谢Naaff的帮助 . 我想我将继续使用firefox,并且我将为每个算法指定生成的svg文件中的行宽 . 这对我来说已经足够了 .

相关问题