3

Highcharts 在自动格式化 x 轴和工具提示中的日期方面做得很好。不幸的是,我需要一个自定义函数来格式化我的 y 值,并且/plotOptions/line/tooltip/pointFormat只接受格式字符串而不接受函数,所以我必须设置/tooltip/formatter。如何获取 x 轴上显示的格式化日期(例如 Oct'13 或 20. Oct)?我似乎无法point.key从那里访问,只有原始的毫秒值。

http://jsfiddle.net/9Fke4/

4

4 回答 4

1

您可以使用dateFormat()

    tooltip: {
        formatter: function() {
           return '<b>' + Highcharts.dateFormat('%b\' %d',this.x) + ':</b> ' + this.y;
        }
    },

http://jsfiddle.net/9Fke4/1/

于 2013-10-18T09:03:14.213 回答
1

FWIW,这在Github上的 Highcharts 问题中得到了回答

formatter: function() {
                var tooltip = this.series.chart.tooltip,
                    item = this.point.getLabelConfig(),
                    header = this.series.chart.tooltip.tooltipFooterHeaderFormatter(item);

                return header + this.y;
            }

对应的小提琴:

http://jsfiddle.net/9Fke4/12/

如果您使用的是共享系列:

tooltip: {
        formatter: function (tooltip) {
          var header,
              s = [];

          $.each(this.points, function(i, point) {
            if(header == null) {
              var config = point.point.getLabelConfig();
              header = tooltip.tooltipFooterHeaderFormatter(config);
            }
            s.push(point.y);
          });

          return header + s.reverse().join('<br>');
        },
        shared: true
      }
于 2017-07-26T23:02:52.620 回答
0

使用将原始毫秒转换为日期对象

var currentDate = new Date (tome in milliseconds)

在您定义的tootip/formatter 函数中。

这将使您可以很好地控制日期。您可以使用 currentDate.getMonth()、getDate()、getDay() 等方法从该日期获取您想要的信息。

使用上述信息构建一个字符串并返回。

我希望这能帮到您。

于 2013-10-18T06:20:57.433 回答
0

我最终得到的解决方案是预先格式化 y 值并将它们存储为系列数据的一部分;headerFormat然后可以从工具提示和中引用预格式化的值pointFormat,它们可以与 一起使用{point.key},其中包含自动格式化的日期(并且在提供自定义工具提示时不可用formatter):

http://jsfiddle.net/uG3sv/

于 2013-10-24T20:06:51.497 回答