javascript - 使用 d3.js 和 raphael

标签 javascript jquery raphael d3.js

我很难过,因为关于 d34raphael 的文档不多工具。

我正在尝试从 d3.js 重现这个例子:http://bl.ocks.org/d/1249394/使用拉斐尔。这个想法是为了能够在不支持 svg 的 ie8 中运行它。

我最担心的是用 raphael 代码替换“g”svg 节点。

例如如何将这些statemetns转换成d34raphael:

var node = vis.selectAll("g.node")
   .data(nodes, function(d) { return d.id || (d.id = ++i); });

var nodeEnter = node.enter().append("g")
    .attr("class", "node")
    .attr("transform", function(d) { return "translate(" + source.y0 + "," + source.x0 + ")"; })
    .on("click", click);

我已经阅读了有关 d34raphael 的文档,但没有用。

感谢您的帮助。

最佳答案

拉斐尔没有使用 g 元素,但有一些集合的概念。 d34raphael 直接使用:

paper.setStart()
...
paper.setFinish().transform(["t", margins.top, margins.left]);

但这对于直接翻译 d3 代码不是很有用。我建议您展平您的数据和所有逻辑来定位您的元素,而不是让您的元素具有组的子元素。

关于javascript - 使用 d3.js 和 raphael,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11567776/

相关文章:

javascript - 从 iframe 打印 pdf 文件

javascript - jquery根据类添加href

javascript - 如何使用 keyup 事件创建复杂的公式

jquery - 将其用作背景图像后图像不太清晰

jquery - 在 AngularJS 中创建 JSONP API 并使用 jQuery 进行使用

javascript - 相对定位拉斐尔对象

css - 字体、Raphael 和 IE8

javascript - SVG 在 Safari(对于 Windows)中阻止点击事件,但在 Firefox/Chrome 中有效

javascript - 如何在不使用 :after? 的情况下在 div 上创建三 Angular 形

javascript - 使用 Google Calendar API 返回 401(未授权)