2

我正在尝试使用 DyGraphs 来绘制股票数据。它在绘制和缩放数据方面做得很好。但我的数据有缺口,因为股票在假期不交易。我不想在 x 轴上显示周六和周日。我想在 google 财务上有这样的图表,其中 x 轴跳过周六和周日(没有数据的日期)。那可能吗?如果我使用绘图仪选项,我能达到这个结果吗?

ps 我不介意图表是否放大到小时或分钟级别。

4

2 回答 2

4

多年以后,但我有一个简单的解决方案。

这是我使用的数据:https ://pastebin.com/kbT6gY2u

它被格式化为显示为烛台(日期、打开、关闭、高、低),因为我使用在这里找到的绘图仪:http: //dygraphs.com/tests/plotters.html但是我的解决方案将使用默认绘图仪。

原理是这样的:

  • 将数据中的每个日期推送到一个数组,并用它的索引替换日期。这将消除数据中的所有空白,这样您就可以拥有一张连续的图表。
  • 创建自定义axisLabelFormatter,将索引再次转换为X轴上的日期
  • 创建自定义 valueFormatter 以在图例/鼠标上再次将索引转换为日期

代码示例(使用 underscore.js 和 moment.js 代码清晰)

var dateIndex   = [];
var data    = _.map(data, function(line, n) {
    dateIndex.push(line[0]); // Save the date to the array
    line[0] = dateIndex.length-1; // Replace the date by the index of the date in the array
    return line;
});
var g = new Dygraph(element, data, {
    axes: {
        x: {
            valueFormatter: function (val, opts, series_name, dygraph) {
                // val is the date, which we have rewritten to the array's index.
                // So here we can exchange it back for the actual date, and format it
                return moment(dateIndex[val]).format("dddd, MMM Do YYYY, h:mm a");
            },
            axisLabelFormatter: function (val, granularity, opts, dygraph) {
                return moment(dateIndex[val]).format("MMM DD");
            }
        }
    }
});
于 2017-04-29T05:00:56.583 回答
1

我长期以来一直认为,也许我们可以从 Dygraphs 中抽象出足够多的东西,让轴不仅仅由线性与对数定义,但问题是它很容易变得低效。Dygraphs 速度很快,有时我们会保留一些功能以保持这种状态。但任何想法都会受到欢迎。

于 2013-08-04T18:37:58.710 回答