0

我有一个 SVG 文件,我正在 illustrator 中进行编辑。我已经使用这个文件中的路径信息来创建一个 Raphael 对象。我现在要做的是在绘图的某些部分添加文本。问题是 Raphael 只接受 X 和 Y 坐标,而 SVG 文件中的文本是一个矩阵。

基本上我需要转这个:

<text transform="matrix(1 0 0 1 583 562)" font-size="12">Argentina</text>

变成这样的东西:

var t = paper.text(x, y, "Argentina");

那可能吗?我也尝试将文本变成轮廓,但结果路径很复杂,我更喜欢更轻的东西。

4

2 回答 2

3

在您的特定情况下,矩阵仅转换为x: 583and y: 562,但如果您的元素被缩放或旋转,那么这些值将具有误导性。

您可以直接在 Raphael 中应用变换矩阵,您只需...

transformation = Raphael
     .matrix(1, 0, 0, 1, 583, 562)
     .toTransformString();

text = paper
    .text(0, 0, "Argentina")
    .attr("font-size", 12)
    .transform(transformation)​

现在,如果不喜欢在您的元素上应用转换,您可以通过执行将矩阵转换转换为更易于阅读的格式console.log(transformation),这将为您提供一个字符串,例如Raphael 的文档t100,100r30,100,100s2,2,100,100中很好解释的字符串

于 2012-07-06T16:49:50.450 回答
1

我听到你的问题。当我编写一个 SVG 到 Raphael 转换器(第一个)时,我研究了这些问题。转换器将所有变换移出路径并将所有坐标从相对坐标更改为绝对坐标。在 svg Text 中,有很多东西可以让您了解。我写的coverter 提供了一些对文本转换的支持。我想您可以尝试将您的 SVG 通过转换器并查看它参考文本丢弃的 javascript。转换器至少会输出几种格式,但您可能会尝试的 2 种是默认输出。转到转换器页面

仅使用默认值上传您的 SVG。当您单击“收集 Raphael”时,将带您进入生成的交互式 javascript。这仅处理路径以查看使用文本完成的工作单击“或页面”链接...

如果您需要帮助,我会回来查看...

于 2012-07-06T15:30:30.987 回答