使用javascript编辑嵌入式SVG文件的内容 [英] Edit contents of embedded SVG file using javascript

问题描述

我有一个具有一些数学方程的SVG文件。让我说我把这个文件包含在我的html文件中。现在我想做的是使用html文档中的javascript对svg的内容进行一些简单的修改。

一个具体的例子

我的svg文件包含这个方程式的格式很好的版本：

x ^ 2 + 2x + 1 = 0

，我想进行以下更改：

1. 颜色x ^ 2红色


2. 从公式中删除2x

谢谢。

解决方案

您需要做的是将自己附加到SVG图像的加载事件上。有一个很好的 SVG jQuery插件为您做的（还有一些）：

您还应查看的好资源来自David Dailey的JavaScript动画SVG 。

I have an SVG file with some math equations. Lets say I include this file into my html document. Now what I'd like to do is to make some simple modifications to the contents of the svg using javascript in the html document.

A specific example
My svg file contains a nicely formatted version of this equation:

x^2 + 2x + 1 = 0

and I'd like to make the following changes:

1. Color the x^2 red
2. Remove 2x from the equation

Thanks.

解决方案

What you need to do is to attach yourself onto the load event of the SVG image. There is a nice SVG jQuery Plugin to do just that for you (and some more):

You should also check out the good resource on Javascript animating SVGs from David Dailey.

这篇关于使用javascript编辑嵌入式SVG文件的内容的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！