Graph 如何在Raphael js图表上添加X轴和Y轴标签

我正在尝试使用Raphael.js对数据进行一些很好的绘图，之后我意识到js有一些限制，我正在尝试解决这些限制

有人知道如何动态缩放y轴值吗？因为我已经意识到，一旦值超过>500，图形就根本不会出现，只有轴在一条线的最边缘处出现绘图（即超过限制）

第二，有没有办法向图形中添加图例或轴标签？或者必须将图形标签单独编码为html

---

非常感谢！！！这是一个外观很好的工具，但似乎很无用……

图表g.bar.js没有绘制轴的选项。但是，如果查看g.line.js内部，在第98-117行（当前）周围有一段代码用于绘制轴：

    var allx = Array.prototype.concat.apply([], valuesx),
        ally = Array.prototype.concat.apply([], valuesy),
        xdim = chartinst.snapEnds(Math.min.apply(Math, allx), Math.max.apply(Math, allx), valuesx[0].length - 1),
        minx = xdim.from,
        maxx = xdim.to,
        ydim = chartinst.snapEnds(Math.min.apply(Math, ally), Math.max.apply(Math, ally), valuesy[0].length - 1),
        miny = ydim.from,
        maxy = ydim.to,
        kx = (width - gutter * 2) / ((maxx - minx) || 1),
        ky = (height - gutter * 2) / ((maxy - miny) || 1);

    var axis = paper.set();

    if (opts.axis) {
        var ax = (opts.axis + "").split(/[,\s]+/);
        +ax[0] && axis.push(chartinst.axis(x + gutter, y + gutter, width - 2 * gutter, minx, maxx, opts.axisxstep || Math.floor((width - 2 * gutter) / 20), 2, paper));
        +ax[1] && axis.push(chartinst.axis(x + width - gutter, y + height - gutter, height - 2 * gutter, miny, maxy, opts.axisystep || Math.floor((height - 2 * gutter) / 20), 3, paper));
        +ax[2] && axis.push(chartinst.axis(x + gutter, y + height - gutter, width - 2 * gutter, minx, maxx, opts.axisxstep || Math.floor((width - 2 * gutter) / 20), 0, paper));
        +ax[3] && axis.push(chartinst.axis(x + gutter, y + height - gutter, height - 2 * gutter, miny, maxy, opts.axisystep || Math.floor((height - 2 * gutter) / 20), 1, paper));
    }

---

这可以有效地复制并粘贴到g.bar.js中的函数VBarchart中，为您提供轴选项。需要对x和y位置进行一些调整，并且maxy可能应该设置为opts.total以获得正确的缩放-是的，您需要对其进行一些调整，但它确实起作用。

图表g.bar.js没有绘制轴的选项。但是，如果查看g.line.js内部，在第98-117行（当前）周围有一段代码用于绘制轴：

    var allx = Array.prototype.concat.apply([], valuesx),
        ally = Array.prototype.concat.apply([], valuesy),
        xdim = chartinst.snapEnds(Math.min.apply(Math, allx), Math.max.apply(Math, allx), valuesx[0].length - 1),
        minx = xdim.from,
        maxx = xdim.to,
        ydim = chartinst.snapEnds(Math.min.apply(Math, ally), Math.max.apply(Math, ally), valuesy[0].length - 1),
        miny = ydim.from,
        maxy = ydim.to,
        kx = (width - gutter * 2) / ((maxx - minx) || 1),
        ky = (height - gutter * 2) / ((maxy - miny) || 1);

    var axis = paper.set();

    if (opts.axis) {
        var ax = (opts.axis + "").split(/[,\s]+/);
        +ax[0] && axis.push(chartinst.axis(x + gutter, y + gutter, width - 2 * gutter, minx, maxx, opts.axisxstep || Math.floor((width - 2 * gutter) / 20), 2, paper));
        +ax[1] && axis.push(chartinst.axis(x + width - gutter, y + height - gutter, height - 2 * gutter, miny, maxy, opts.axisystep || Math.floor((height - 2 * gutter) / 20), 3, paper));
        +ax[2] && axis.push(chartinst.axis(x + gutter, y + height - gutter, width - 2 * gutter, minx, maxx, opts.axisxstep || Math.floor((width - 2 * gutter) / 20), 0, paper));
        +ax[3] && axis.push(chartinst.axis(x + gutter, y + height - gutter, height - 2 * gutter, miny, maxy, opts.axisystep || Math.floor((height - 2 * gutter) / 20), 1, paper));
    }

---

这可以有效地复制并粘贴到g.bar.js中的函数VBarchart中，为您提供轴选项。需要对x和y位置进行一些调整，maxy可能应该设置为opts.total以正确缩放-是的，您需要用它四处放屁一点，但它确实有效。

感谢您的提示！被它或信息的缺乏所迷惑，转而使用海图，效果也很好@斯蒂芬班德：你能详细说明一下这些小调整吗。。我试图把它复制到提到的文件中。但是不起作用。。你能帮忙吗。感谢you@stephband：或任何演示？自从两年前我写下这个答案以来，我就没有使用过拉斐尔，我想从那时起它已经改变了很多，所以答案已经过时了。抱歉。@Stephenband在gRaphael中使用了2年之后，仍然没有轴支持条形图。谢谢Stephenband的提示！被它或信息的缺乏所迷惑，转而使用海图，效果也很好@斯蒂芬班德：你能详细说明一下这些小调整吗。。我试图把它复制到提到的文件中。但是不起作用。。你能帮忙吗。感谢you@stephband：或任何演示？自从两年前我写下这个答案以来，我就没有使用过拉斐尔，我想从那时起它已经改变了很多，所以答案已经过时了。抱歉。@Stephael经过2年的漫长xD后，gRaphael中的条形图仍然没有轴支持