问题标签 [inkscape]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
svg - 如何使文本在 SVG 中自动缩小?
我有一个用 Inkscape 创建的 SVG 元素。然后,我将该 SVG 放入用于转换 XML 数据的 XSL-FO 样式表的一部分,然后通过 IBEX 渲染器创建一个 pdf(通常然后打印)。例如,我在 svg/stylesheet 中有如下所示的元素(由于 Inkscape 导出而产生的额外噪音):
我的问题在于我不知道这个文本区域会有多大。对于这个特定的,我在 SVG 中的文本右侧有一个图像。但是,如果这个字符串是 W 的最大允许数量,那么它就太长了并且会超出图像。我想要的(在一个完美的世界中)是一种告诉它我希望文本块有多少像素宽然后让它自动使文本变小直到它适合该区域的方法。如果我不能这样做,截断文本也可以。作为最后的手段,我将使用固定宽度的字体并在 XML 生成中自己进行字符串截断,尽管这会产生一些不太可用和不太美观的东西。
我浏览了 SVG 文档并查看flowRegions
了一些路径,但似乎都不是我想要的(也许它们是)。如果有帮助,这是 Inkscape 生成的样式字符串:
在此先感谢您的帮助。
android - Android画布位图大小和测量
我有一个在 Inkscape 中编辑的 PNG 图像。它是一个不规则的锯齿状形状,但我需要用它进行碰撞检测。它太大了,无法在它周围制作粗略的矩形(它占用的不仅仅是标准手机屏幕)。所以我一直在 INkscape 中围绕它绘制矩形并记下这些矩形的像素尺寸。
我的意图是使用这些“虚构”矩形的联合进行碰撞检测。然而,我的努力遇到了障碍。手机上图片的默认大小似乎与 Inkscape 中的不同。
我想知道对大型不规则物体进行碰撞检测的最佳方法,和/或如何使画布位图测量值与其像素(或毫米)测量值相同。
python - 使用 python 和 pygame 加载 SVG 文件
可能重复:
PyGame 应用程序中的 SVG 渲染
我可以通过 pygame 将 inkscape 创建的 .svg 文件加载到 python 吗?如果是这样,我该怎么做?
animation - 应用变换矩阵后计算路径中心
我在 Inkscape 中制作了一个徽标。为了学习,我想通过 SVG 中的动画支持使徽标中的轮子形状旋转。
实现旋转很容易,但我很难指定正确的旋转轴。形状是一个齿轮,我希望它围绕它的中心旋转。反复试验得出 xy 坐标 (47.1275, 1004.17) (其分量奇怪地不对称,但我想这与 Inkscape 应用的变换矩阵有关)是一个很好的近似值(参见下面的 animateTransform 标签),但我将如何从第一原则得到?
根据我在规范中读到的内容,我会说应用的转换矩阵是
和
(-9.9178912,-891.57237,0)
它们是否在平移变换后应用于 xyz 坐标?
我想上面的正确分析会让我得到所描述路径的左上角,或者可能是第一个句柄的坐标。在那之后,是否必须解析路径来决定边界框,从而决定路径的中心(因为它涉及一个有点圆形的对象)?
不尝试在自由创建的形状上手动制作动画,这是一个教训吗?
internet-explorer - 在 .NET 中将 VML 转换为 SVG 的问题
我有一个与这篇文章非常相似的问题;我正在使用 RaphaelJS 生成图表,但更具体地说,在我的情况下,我需要打印结果。我使用Inkscape 的命令行实用程序(非常棒)将 Raphael 的 SVG 输出转换为 PNG 文件,用户可以下载和打印。
问题是,它适用于 Firefox 等,但不适用于 Internet Explorer。因为 IE 使用 VML,而不是 SVG,所以当用户来自 IE 时,Inkscape 不会转换它。
我看过 IECapt,它可能已经完成了这项工作,但在我的场景中,文字截图是不够的,因为生成的图表通常跨越屏幕宽度,我需要将它们全部放在一个文件中。此外,用户可以通过单击节点等来修改图表而不更改 URL,因此在我的情况下实际使用 IECapt 需要 URL 参数来复制图表的状态。
我只需要了解 VML 格式的这种转换,我就可以擦掉这个项目的脚!
链接
- 直接从 C# 应用程序使用 Inkscape
- IECapt
map - 写一个等价的
如果您想知道为什么这是必要的,或者想提出更好的方法来解决更大的问题,请随时询问更多上下文。(它涉及在校园地图上布置一堆建筑平面图,并找到这些建筑地图中某些事物的绝对位置;更多细节使问题陷入困境。)
简短的版本是我想获取一个具有 <image xlink:href="something.svg" /> 引用的 SVG 文件并将其合并到一个大文件中,每个引用的 SVG 都嵌入一个 <svg> 和内联 SVG XML内容。
因此,我的顶级源文件(在 Inkscape 中编写)如下所示:
我尝试合并版本以内联所有矢量数据:
因此,基本上我使用脚本将 <image> 替换为 <svg> 并粘贴到“floorplans/bldg1.svg”的根 <svg> 的内容中。(将 <image> 的属性复制到 <svg>,并将 viewBox 属性从原始 <svg> 复制到新的。)
这种技术适用于不旋转的东西,但 Chrome 似乎在说这个特定元素不在视口的顶部。我是 SVG 的新手,但我认为 <svg> 上的转换顺序与 <image> 上的不同。我是否犯了一个我没有发现的愚蠢错误,或者在将 <image xlink:href="something.svg" transform=... /> 转换为具有内联 XML 的 <svg> 时涉及更多内容?
谢谢。
internet-explorer - Inkscape 无法从命令行正确处理 SVG
这是对我之前发布的相关问题的跟进。
我的 .NET 应用程序现在可以使用VectorConverter提供的 XSLT和 .NET XslTransform 类成功地将 VML 文件转换为 SVG 。
对于除 IE 之外的所有浏览器,Inkscape 命令行实用程序都运行良好。我得到了整个 SVG 绘图的漂亮 PNG 图像。但是对于 IE,输出 PNG 只是输入 SVG 的一小部分。有没有其他人有这个问题?
vector - 将 PNG 图像转换为 SVG / 矢量
我们迫切希望转换图像,以便将其用作图像映射。我尝试过的一切,真的不切芥末。我没有在非常高分辨率下工作的经验.. 加上我不知道术语,也没有技能或资源来投资学习如何做到这一点,知道这里和互联网上的许多其他人有更丰富的经验。
我已经下载并玩过 Inkscape,但真的是在兜圈子……
所以想我会在这里问。
我所追求的类似于 Raphael Australia Map 或 David Lynchs,http: //davidlynch.org/js/maphilight/docs/demo_usa.html
没有多余的装饰,没有效果,只需在悬停时更改地图的状态颜色并在单击时保留该事件。
这是我们所拥有的...
我们拥有的是这样的 MAP。
我们丢失了原始文件,它是纯灰色的。我还有这个:(
无论如何,我们希望上面地图上未标明的每个州(包括领土 ACT),用粉色 #ec008c 表示。悬停时
地图必须完美无瑕!!还要求任何图像必须是 png 和透明 bg。
必须保持如上的精确尺寸。必须在 svg 坐标上非常准确,并且可以选择显示 STATE 文本,就像上图中显示的 QLD 一样,但不是完全必要的。
谁能指出我正确的方向。
vector-graphics - Inkscape:如何使用毫米偏移创建平铺克隆,而不是百分比
我正在尝试在 Inkscape 中创建一个三角形网格。我将创建一条斜线,然后沿一个方向克隆它以获得栅栏,然后在 60 度和 120 度处克隆栅栏以获得例如 5 毫米步长的网格。
问题是创建克隆是由以原始对象尺寸百分比表示的偏移指定的。由于原始线是倾斜的,因此它的尺寸以毫米的丑陋分数表示。因此,要指定对应于 5 毫米步长的百分比变化,我必须计算更丑陋的分数。百分比的微小不准确可能导致累积移位误差,这可能导致远处克隆不在常规的 5 毫米网格上。
如何使用毫米而不是百分比来指定克隆的位移?
javascript - HTML+SVG+JavaScript:在运行时更改文本?
我即将将一些基于 Flash 的应用程序迁移到 HTML+JavaScript+SVG(单目标渲染引擎是 Webkit)。
我对 SVG 完全陌生,我想知道是否可以使用 SVG 作为模板图像来填充屏幕并从嵌入在 HTML 页面中的 JavaScript 代码动态更改包含的文本。
我想做的是:在 Inkscape 中绘制页面的基本结构(带有一些图形和文本占位符),然后在 HTML 页面中显示 SVG 并通过 JavaScript 填充文本占位符。
我可以通过在背景中显示静态 SVG 图像并在其顶部放置一些绝对定位的 DIV 来显示文本来获得相同的结果,但我想在 Inkscape 中设计文本标签的位置、大小和样式.
这可以做到吗?如何?
我使用的是原型框架,而不是 JQuery。