我正在使用SVG和JavaScript/jQuery开发一个交互式界面,我试图在RaphaeljQuery SVG之间做出 Select .我想知道

  1. 两者之间的取舍是什么
  2. 发展势头似乎在哪里.

我不需要Raphael中的VML/IE支持,也不需要jQuery SVG的绘图功能.我主要感兴趣的是在SVG画布上创建、设置动画和操纵单个项目的最优雅的方式.

推荐答案

我最近使用了拉斐尔和jQuery SVG——以下是我的 idea :

拉斐尔

Pros:一个很好的入门库,很容易用SVG快速完成很多事情.有很好的文字记录.很多例子和演示.非常可扩展的架构.非常适合动画.

Cons:是实际SVG标记上的一层,这使得SVG很难做更复杂的事情,比如分组(它支持集合,但不支持组).对现有元素的编辑效果不佳.

jQuery SVG

Pros:一个jQuery插件,如果您已经在使用jQuery的话.写得很好,记录得很好.有很多例子和演示.支持大多数SVG元素,允许轻松本地访问元素

Cons:建筑不像拉斐尔那样可扩展.有些事情可以更好地记录下来(比如SVG元素的配置).对现有元素的编辑效果不佳.动画依赖SVG语义——这并不是很好.

SnapSVG as a pure SVG version of 拉斐尔

SnapSVG是拉斐尔的继任者.它仅在支持SVG的浏览器中受支持,并且几乎支持SVG的所有功能.

结论

如果你做的事情又快又简单,拉斐尔是一个容易的 Select .如果要做更复杂的事情,我 Select 使用jQuery SVG,因为我可以比拉斐尔更容易地操作实际的标记.如果您想要一个非jQuery的解决方案,那么SnapSVG是一个不错的 Select .

Javascript相关问答推荐

使用Angular 17计算从生日日期起的年、月、天

使脚本兼容于其他YouTube URL格式

橡皮擦完全让画布变成白色

序列查找器功能应用默认值而不是读取响应

Phaser框架-将子对象附加到Actor

IMDB使用 puppeteer 加载更多按钮(nodejs)

了解Node.js中的EventEums和浏览器中的addEventEums之间的关系

我不知道为什么setwritten包装promise 不能像我预期的那样工作

Angular 17—每当一个布尔变量变为真时触发循环轮询,只要它保持为真

有没有可能使滑动img动画以更快的速度连续?

XSLT处理器未运行

加载背景图像时同步旋转不显示的问题

还原器未正确更新状态

Reaction Native中的范围滑块

如何创建返回不带`new`关键字的实例的类

每次重新呈现时调用useState initialValue函数

Docent.cloneNode(TRUE)不克隆用户输入

React:防止useContext重新渲染整个应用程序或在组件之间共享数据而不重新渲染所有组件

Node.js API-queryAll()中的MarkLogic数据移动

React Refs不与高阶组件(HOC)中的动态生成组件一起工作