SVG 模式的 VML 替代方案(可能使用 Raphael JS)

发布于 2024-11-05 12:00:21 字数 810 浏览 0 评论 0原文

在 SVG 中,可以定义可用作路径填充的图案。有关我的意思的示例,您可以查看此链接:SVG 模式示例。不幸的是,SVG 在旧版本的 Internet Explorer 中不可用,因此我必须在那里使用 VML。

为了让我的生活更轻松一点,我使用 Raphaël JS(更具体地说,我使用基于 Raphaël 的 ExtJS 4.0 的绘图包),因此我不必担心 SVG 和 VML 之间的差异。

然而,Raphael JS 没有提供定义模式和使用它们的方法,所以我必须手动完成此操作。在 SVG 中这不是什么大问题,但在 VML 中我找不到创建图案并将其用作路径的(重复)背景的方法。

我发现的最接近的是能够使用图像作为路径的背景,如所述MSDN 上。问题是我想用重复的矢量图像填充路径,这样我就可以缩放它并且仍然让它看起来不错。

任何帮助我指出解决这个问题的正确方向的帮助将不胜感激。

编辑:对于访问我的帖子的人:我得出的结论是,我上面描述的内容是不可能的。 VML 中唯一可能的图案是使用 填充元素 平铺图像。由矢量形状组成的图案在 VML 中是不可能的。

In SVG it is possible to define a pattern that can be used as the fill for a path. For an example of what I mean you can check this link: SVG pattern example. Unfortunately SVG is not usable in older versions of Internet Explorer, so I'll have to work with VML there.

To make my life a little more easy I use Raphaël JS (to be more specific, I use the draw package of ExtJS 4.0, which is based on Raphaël), so I don't have to worry about the differences between SVG and VML.

Raphael JS however, does not provide a way to define patterns and use them, so I'll have to do this by hand. In SVG this is not much of a problem, but in VML I cannot find a way to create a pattern and use it as the (repeating) background of a path.

The closest thing I have found is the ability to use an image as the background of a path, as described here on MSDN. The problem is I want to fill the path with a repeating vector image, so I can scale it and still have it look nice.

Any help in pointing me in the right direction for solving this would be greatly appreciated.

Edit: For people visiting my post: I've come to the conclusion that what I describe above is not possible. The only patterning possible in VML is tiling an image, using a fill element. Patterns made of vector shapes are not possible in VML.

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

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

发布评论

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

评论(1

段念尘 2024-11-12 12:00:21

我正在使用这种方法:

1-使用要填充的路径的路径元素(不是矩形)创建一个边界框。
2- 将“z”和要填充的路径的路径字符串附加到边界框路径字符串。这将创建一个剪切矩形。
3-使用 javascript 在剪裁的矩形后面重复图案。

I'm using this method:

1- Create a bounding box with path element (not rect) of the path you want to fill.
2- Append "z" and the path string of the path you want to fill to the bounding box path string. This will create a clipped rect.
3- Use javascript for repeating pattern behind the clipped rect.

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