【问题标题】:Scripting SVG脚本 SVG
【发布时间】:2010-09-07 04:41:18
【问题描述】:

我正在考虑开发一个类似于 stackoverflow 的网站,但答案也可能包含图纸(在本例中为示意图)。我想在答案表格中有一个区域,他们可以在不需要特殊插件等的情况下制作这个示意图。

  1. 我们是否已经到了 SVG 已经或应该很快达到临界质量(1-2 年)的地步,以便设计一个以脚本运行 SVG 作为主要功能的网站是合理的(即,需要 Firefox 或其他 SVG/AJAX 兼容浏览器)?
  2. 有哪些学习跨平台 SVG 脚本(可能是 javascript)的好资源?

-亚当·戴维斯

【问题讨论】:

    标签: javascript ajax svg


    【解决方案1】:

    Raphael 看起来是对跨浏览器矢量图形问题的一个有趣的尝试。

    【讨论】:

      【解决方案2】:

      很遗憾,我没有答案,但我确实提供了三个您可以查看的项目的指针。

      第一个是 Sun Labs 的 Dan Ingalls(是的,the Dan Ingalls)Lively Kernel。它是基于 SVG 的 JavaScript 中 Smalltalk 虚拟世界的实现。更准确地说,它是 Squeak Smalltalk 在 JavaScript 中的 Morphic GUI 框架的实现,使用 SVG 和 JavaScript 中 Squeak Smalltalk 的(部分)端口。

      或者,如果您不是 Smalltalker 并且以上内容对您没有意义:它是一个操作系统,用 JavaScript 编写,JavaScript 解释器作为 CPU,SVG 作为显卡,浏览器作为计算机.

      当涉及到 JavaScript 和 SVG 时,这几乎是极端的。它只完全在 Safari 3 中工作,部分在 Firefox 3 中工作,尽管 Internet Explorer 也有一个实验性端口。

      第二个项目是 John Resig 的 Processing.js 将处理可视化语言移植到 JavaScript。正是由于您提到的问题,它使用 <canvas> 元素而不是 SVG。然而,这个仅适用于 Firefox 3。

      第三个是无用泡菜的Real-Time 3D in JavaScript。它使用 JavaScript、DOM 和 CSS,没有 SVG 或 <canvas> 或 Flash 或其他任何东西。 而且它几乎可以移植到任何浏览器,包括 Internet Explorer 7 及更高版本。做 2D 应该比这更容易。

      在这三个项目之间,您应该能够找到一些灵感,并且还可以找到一些尝试使用 JavaScript 和 SVG 或 JavaScript 和图形来突破极限的人,他们可以告诉您哪些有效,哪些无效。

      结论:做跨浏览器 SVG 或跨浏览器 <canvas> 几乎是不可能的,但有点疯狂,跨浏览器图形 没有 SVG 或 <canvas> 是可能的。

      【讨论】:

      • code.google.com/p/explorercanvas 是一个允许在 IE 上使用画布的修复程序。我已经将它与 MS IE 条件标签一起使用,效果很好。
      • 我差不多一年前写了这个答案,从那以后就没有关注过演变。随意编辑!
      【解决方案3】:

      SVGWeb 是一个脚本,它使用 Flash 向 IE 添加近乎原生的 SVG 功能。所有其他主流浏览器都支持 SVG。

      http://code.google.com/p/svgweb/

      【讨论】:

        【解决方案4】:

        1/ 可能永远不会——如果 IE 想要添加它,那么我会想要的,尽管它现在已经这样做了;但是有使用SilverLightGecko 提供渲染的解决方法。另一方面,有可用的跨浏览器图形 API。我使用 XULRunner 和 SVG 完成了较大的前端,但在 web 上没有任何东西必须迎合 IE。

        2/ 我最常提到的两个是 SVG pages on mozilla.org 和这个 SVG DOM reference 。我所有的 SVG 链接都在这里 delicious

        http://www.bpel4chor.org/editor/ 现有一位编辑;此外,如果您想要的只是所有弧线都在网格上的示意图,那么您可以使用没有 SVG 的 div 和图像很好地做到这一点。或者你可以直接去lo-fi route

        【讨论】:

          【解决方案5】:

          正如@jwmittag 提到的<canvas> 是一个选项。

          它适用于 Saffari 和 Firefox 3、Opera 9 和 people are developing support for IE

          您可以轻松捕获与当前工具和属性相关的鼠标点击。 在每个页面显示上重绘画布。

          我刚刚使用<canvas> 完成了一个项目,它是一个简单且非常强大的 API,特别是如果您曾经做过任何 OpenGL 或 Cairo 工作。

          祝你好运,听起来是个很酷的项目。

          【讨论】:

            猜你喜欢
            • 2010-09-19
            • 2012-12-07
            • 2020-04-21
            • 2012-02-06
            • 2018-01-11
            • 2012-06-03
            • 1970-01-01
            • 1970-01-01
            • 1970-01-01
            相关资源
            最近更新 更多