Question

我正在使用gRaphael实现实时更新折线图，Raphael是Graphael line chart SVG库的图形扩展。

我似乎无法找到任何人做这个近实时更新项目的例子，这很好。我假设有一种方法可以使用新数据集调用图表上的刷新（无需每次都重新初始化一个全新的Raphael对象！），但其中存在问题：

在任何地方似乎都没有准确的文档。我发现了这个StackOverflow问题：https://github.com/kennyshen/g.raphael/tree/master/docs这导致了这个文档项目：{{3}}，但结果很冷。使用提供的示例，我遇到了一些错误：

示例中使用的语法r.g.linechart()不再有效（其中r是Raphael对象，我认为g是gRaphael属性）。在某个地方，有人必须切换到正确扩展Raphael对象，以便r.linechart()起作用。
传递到linechart()的参数不正确，导致再次出现未定义的错误。如果我只传入#x, #y, width, height, arrayX, arrayY参数并删除图表标签等，我可以渲染一条简单的线条。但当然我需要能够标记我的轴并提供传奇等等。

毋庸置疑，没有API文档的图书馆不会对任何人有好处，但是有些人愿意在严格阅读代码本身的基础上学习。我不是其中之一。我可能会用一个评论很好的例子，最好是使用实时更新。

所以我想问题是：

是否有人知道比我链接的文档更好的文档？
有人可以指点示例，文档失败吗？
有人可以提供linechart()将接受的参数的正确逐项列出吗？

谢谢！

为了记录，这是我到目前为止的距离：

var r = Raphael('line-chart');

// did NOT work -->
var linechart = r.g.linechart(
  10,10,300,220,[1,2,3,4,5],[10,20,15,35,30], 
  {"colors":["#444"], "symbol":"s", axis:"0 0 1 1"}
);

// worked in a limited way, rendering a plain line with no visible labels/graph -->
var linechart = r.linechart(
  10,10,300,220,[1,2,3,4,5],[10,20,15,35,30]
);

Answer 1

我仍在尝试自己学习拉斐尔，但这里是我一直使用的主要资源：http://g.raphaeljs.com/reference.html和“g”相同。

这里有一个小提琴，它几乎取消了与knockout / gRaphael的更新线图，不是最好的解决方案，但它的想法是：http://jsfiddle.net/kcar/mHG2q/

只是一个注意事项，直到我将阅读与试验/错误（有很多错误）相结合，我才开始学习它，所以玩小提琴，看看事情是如何变化的。

但它的基本代码如下：

//constructor
var lines = r.linechart(10, 10, width, height, xVals, yVals, { nostroke: false, axis: "0 0 1 1", symbol: "circle", smooth: true })
    .hoverColumn(function () {  //this function sets the hover tag effect
        this.tags = r.set();

    for (var i = 0, ii = this.y.length; i < ii; i++) {
        this.tags.push(r.tag(this.x, this.y[i], this.values[i], 160, 10).insertBefore(this).attr([{ fill: "#fff" }, { fill: this.symbols[i].attr("fill") }]));
        }
    }, function () {
        this.tags && this.tags.remove();
        });

lines.symbols.attr({ r: 3 }); //this adjusts size of the point symbols

Answer 2

有一个fork in GitHub that is working on the documentation and examples.

您需要download代码并从您的计算机上查看。这是一项正在进行中的工作，但它比官方g.Raphael页面中找到的更多。

我还找到了this小帖子，其中有一些例子。

Graphael文档，最近的样本等

2 个答案: