如何在使用gRaphael制作的图表中使用日期值？

Question

一个小前提:我正在节食,我正试图绘制一个减肥图表.

为此,我使用一个小的django应用程序来存储重量读数,并使用gRaphael(http://g.raphaeljs.com/)图表库来绘制报告.你可以在这里看到wip:http://www.totanus.net/weight/

这时我使用'ymd'格式在X轴上打印日期以便正确排序,但我不太满意(实际上我甚至不确定图表是否正确...)而我我想知道是否有更好的方式来呈现日期.

主要问题是:

1. 有没有办法使用"100610"或"20100610"以外的其他标签？
2. 有没有办法每n天或n-kg设置固定的x和y轴标签？
3. 你能给我一些渲染这种图表的最佳实践(我对计算我的整体趋势特别感兴趣)

预先感谢您的任何帮助!

张志贤

Answer 1

鉴于x哪个是Date对象,我能够使用以下步骤实现此目的:

1. 取最低Date值并将其getTime()方法的值缓存在变量(originX)中

2. 对于each Date(curDate),将其转换为时间偏移量originX.

   var timePassed = curDate.getTime() - originX
   

3. 情节x反对y.

上面给出了一个图表,其中标签是UTC时间的毫秒数.为了让它看起来不错,就像@Alastair所说的那样.

这是一些示例jQuery代码.(请注意,您需要提供一个formatDate()函数才能正确呈现日期)

$.each(chart.axis[0].text.items, function(i, label) {
    var old = label.attr("text");
    if(old) {
        var newLabel = formatDate(originX + x);
        if(newLabel) {
            label.attr({ text: newLabel });
        }
    }
});

我希望它能帮到你!