你如何使SVG互动？
你如何使SVG互动？ 有谁知道在哪里可以找到教程？ 我真的想得到一份很好的最新资源列表，以帮助每个人使用SVG学习动态和交互式图形。
我正在寻找的“交互性”的一个例子是给出一个SVG事件处理程序，让用户通过图形（AJAX）提交或接收新数据。
所有关于SVG的书都是从2008年或更早开始的，所以没有使用现代技术（jQuery或AJAX）。 Stackoverflow上脚本化SVG的所有post都是从2010年开始的，大多数也是从2008年开始的。
SVG的当前资源：
拉斐尔
拉斐尔似乎是广泛接受的SVG工作库。 它似乎提供了良好的高级function。
拉斐尔教程
关于SVG书籍的老SOpost，所有评论都来自2008年
w3schools SVG教程。 非常基本的。
我肯定会看一下RaphaelJS ，它允许操作SVG比使用javascript从头开始操作更容易。 有一些关于如何使用事件实现它的示例。 但是，您可以使用javascript操作它，无论是否有任何流行的JavaScript框架的帮助。 SVG的用处是它使用被视为DOM一部分的元素。 因此，图像将是容器的元素。 这很有用，因为您可以将click事件放在这些子元素上。
看看http://snapsvg.io/
从他们的网站：
Snap完全是由Raphaël（Dmitry Baranovskiy）的作者从零开始编写的，专为现代浏览器（IE9及更高版本，Safari，Chrome，Firefox和Opera）而设计。 针对更现代的浏览器意味着Snap可以支持屏蔽，剪裁，模式，完整渐变，组等function。
D3是一个用于操作SVG的JavaScript库：
http://mbostock.github.com/d3/
它还包括一些辅助方法，用于异步加载数据（例如，d3.json，d3.csv，d3.xml）。 与Raphaël不同，使用D3，您可以直接使用SVG元素（或HTML，CSS）。
以下只是Zack Grossbart最近在线文章的一小部分，我认为这一点很有意义 。 阅读整篇文章，特别是看一下OVERVIEW部分……
在浏览器中绘制任何内容之前，先问自己三个问题：
-
您需要支持旧浏览器吗？ 如果答案是肯定的，那么您唯一的选择就是Raphaël。 它一直处理浏览器到IE 7和Firefox3.Raphaël甚至对IE 6有一些支持，尽管它的某些底层技术无法在那里实现。
-
你需要支持Android吗？ Android不支持SVG，因此您必须使用Paper.js或Processing.js。 一些传闻称Android 4将处理SVG，但多数Android设备多年来都不会支持它。
-
你的绘画是互动的吗？ Raphaël和Paper.js专注于通过点击，拖动和触摸与绘制元素的交互。 Processing.js不支持任何对象级事件，因此响应用户手势非常困难。 Processing.js可以在您的主页上绘制一个很酷的动画，但其他工具更适合交互式应用程序。
几乎所有.svg文件的操作都是使用JavaScript完成的。 AJAX只是你用Javascript做的事情，所以如果你需要使用它（用于动态加载新内容或存储交互），你必须分别学习并应用它。
我将从学习如何绘制内容以及如何处理“mouseOver”和“onClick”等事件开始。
这是另一个教程： http ： //www.carto.net/papers/svg/manipulating_svg_with_dom_ecmascript/
这是关于AJAX的一个： http ： //www.w3schools.com/ajax/ajax_example.asp
综合互动示例集：
http://www.irunmywebsite.com/raphael/additionalhelp.php?v=2
为您提供最新版本的function列表。
与当前function交互工作，同时参考当前文档。
@mitch我会推荐你纯SVG …我知道它很难被使用，但它为你提供了大量的JS操作选项。 对我来说，像Raphael库这样的其他选项对于简单的工作来说非常好，但是如果你需要进一步调整你的代码，那就像SVG一样。 否则你可能会发现自己陷入困境并无法继续前进。
对于Javascript / Ajax，你有特定的库，如果应用程序必须复杂，可以缩短你的编码…我能说什么！？
请查看： http ： //www.kevlindev.com/tutorials/index.htm