如何获取 svg 的坐标?

发布于 2024-11-28 04:55:47 字数 128 浏览 1 评论 0原文

如何找到 svg 的坐标?我有一个包含地图的 Adob​​e Illustrator 文件,该文件已绘制并分为美国各州,我如何找到每个州的坐标?

我仅使用美国地图作为示例,我可能会将这种技术用于其他几张地图(更加本地化!!)。

How can I find out the coordinates of an svg? I have an Adobe Illustrator file that contains a map, this has been drawn and separated into US states, how can I find the coordinates of each state?

I'm just using the US map as an example, I'm going to potentially use this technique for several other maps (much more local!!).

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

西瑶 2024-12-05 04:55:47

Inkscape 的表现非常出色。它有一个命令界面,如 http://tavmjong.free.fr/ 中所述INKSCAPE/MANUAL/html/CommandLine.html 。 (该链接是 作者 Tavmjong Bah 网站上的手册副本。请注意,警告说该手册尚未针对最新版本的 Inkscape 进行更新。但是,当我尝试使用该命令时,该命令运行良好。)

该命令

inkscape -S some_file.svg

将输出包含元素 id、左上角的 x 和 y 坐标的行,和元素的宽度和高度。 SVG 的每个元素都有一行。下面是一个示例:

svg2293,26.447175,24,97.105652,92.450851
layer1,26.447175,24,97.105652,92.450851
MyStar,26.447175,24,97.105652,92.450851

此示例来自 http://tavmjong.free。 fr/INKSCAPE/MANUAL/html/CommandLine-Query.html 。它从包含星形的 SVG 中提取信息,如我的第一个链接所示。

在我的 Windows 10 系统上,Inkscape 位于 c:\Program Files\Inkscape\ 中,可执行文件位于该目录的 bin\ 子目录中。如果我 cd 到该子目录,Windows 将识别 inkscape 命令;同样,如果我使用其他地方的可执行文件的完整路径,例如

"c:\Program Files\Inkscape"\bin\inkscape -S some_file.svg

将其放在我的 PATH 上大概也可以工作。

Inkscape 还有许多其他命令,其中包括用于提取有关对象位置和大小信息的其他命令。后者称为“查询命令”。可以提取有关指定对象的信息,例如,

inkscape --query-id=zoom-in -X /usr/share/inkscape/icons/icons.svg

这是在Linux系统上的默认图标文件中查找放大图标的x位置的示例。

要将输出保存到文件,请使用 > 。例如

"c:\Program Files\Inkscape"\bin\inkscape -S some_file.svg > coords.txt

,由于看到实际示例令人放心,这里有两个该工作的屏幕截图。

屏幕截图DOS 中的 Inkscape -S 命令

DOS 下 Inkscape -S 命令的屏幕截图

一旦文件中包含数据,您就可以将其读入程序中。下面是我在 R 编程语言中使用 read_csv 函数执行此操作的屏幕截图 (https://readr.tidyverse.org/reference/read_delim.html )。这会将数据放入表格中,然后将其显示出来。

![ R 的 read_csv 函数读取此数据的屏幕截图

Inkscape does that beautifully. It has a command interface, described in http://tavmjong.free.fr/INKSCAPE/MANUAL/html/CommandLine.html . (The link is to a copy of the manual on the website of its author, Tavmjong Bah. Note that it warns that the manual hasn't been updated for the latest version of Inkscape. However, the command worked fine when I tried it.)

This command

inkscape -S some_file.svg

will output lines containing an element id, the x and y coordinates of the top-left corner, and the element's width and height. There is one line for each element of the SVG. Here's an example:

svg2293,26.447175,24,97.105652,92.450851
layer1,26.447175,24,97.105652,92.450851
MyStar,26.447175,24,97.105652,92.450851

This example comes from http://tavmjong.free.fr/INKSCAPE/MANUAL/html/CommandLine-Query.html . It extracts information from an SVG which includes a star shape, shown on my first link.

On my Windows 10 system, Inkscape lives in c:\Program Files\Inkscape\ , and the executables are in the bin\ subdirectory of that. If I cd to that subdirectory, Windows will recognise the inkscape command; likewise if I use the full path to the executable from somewhere else, e.g.

"c:\Program Files\Inkscape"\bin\inkscape -S some_file.svg

Putting it on my PATH would presumably also work.

Inkscape has a lot of other commands, which include others for extracting information about object positions and sizes. The latter are called "query commands". One can extract information about a specified object, e.g.

inkscape --query-id=zoom-in -X /usr/share/inkscape/icons/icons.svg

This is an example of finding the x position of the zoom-in icon in the default icon file on a Linux system.

To save the output to a file, use > . E.g.

"c:\Program Files\Inkscape"\bin\inkscape -S some_file.svg > coords.txt

As it's reassuring to see actual examples, here are two screenshots of this working.

Screenshot of Inkscape -S command from DOS

Screenshot of Inkscape -S command from DOS

Once you have the data in a file, you can read it into programs. Below is a screenshot of me doing this in the R programming language, using the read_csv function ( https://readr.tidyverse.org/reference/read_delim.html ). This puts the data into a table, which I then displayed.

![Screenshot of R's read_csv function reading this data

小鸟爱天空丶 2024-12-05 04:55:47

SVG 具有 XML 结构。状态将位于 标记中,希望在某处将状态名称作为属性。路径的坐标由 d 属性定义,但它们可能会变得相当复杂,因为它们可以是相对的或绝对的,并且具有各种类型的曲线。对于曲线,最简单的方法可能是只考虑最后两个值,即曲线的终点。

有关完整详细信息,请参阅:http://www.w3.org/TR/SVG /paths.html#PathDataGeneralInformation

如果对路径应用进一步的转换,情况可能会更加复杂。祝你好运!

SVG have an XML structure. The states will be in <path> tags, hopefully with the name of the state somewhere as an attribute. The coordinates of a path are defined by the d attribute, but they can get quite complex as they can be relative or absolute and have various types of curves. With curves, it's probably simplest to consider just the final two values, which is where the curve ends.

For full details, see: http://www.w3.org/TR/SVG/paths.html#PathDataGeneralInformation

The situation may be more complex if further transforms are applied to the paths. Good luck!

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文