gpt4 book ai didi

highcharts - 股票图表 - 未显示格式化的工具提示和前缀或后缀

转载 作者:行者123 更新时间:2023-12-02 01:09:48 26 4
gpt4 key购买 nike

我正在使用股票图表来显示趋势数据。在后端,我得到了 valueSuffix 应该是什么(或 valuePrefix 视情况而定)。我也在格式化工具提示中的日期显示。以下是系列声明的重要部分:

...
name: 'Wages',
tooltip: {
valuePrefix: '$',
valueDecimals: 0
},
...

这是工具提示格式化程序:

...
tooltip: {
formatter: function () {
var s = '<b>';
if (Highcharts.dateFormat('%b', this.x) == 'Jan') {
s = s + 'Q1';
}
if (Highcharts.dateFormat('%b', this.x) == 'Apr') {
s = s + 'Q2';
}
if (Highcharts.dateFormat('%b', this.x) == 'Jul') {
s = s + 'Q3';
}
if (Highcharts.dateFormat('%b', this.x) == 'Oct') {
s = s + 'Q4';
}
s = s + ' ' + Highcharts.dateFormat('%Y', this.x) + '</b>';
$.each(this.points, function (i, point) {
s += '<br/><span style="color: ' + point.series.color + '">' + point.series.name + ':</span>' + point.y;
});
return s;
}
}
...

Example jsFiddle.

如果您注意到美元符号的前缀未显示在工资系列中。我不太确定我在这里遗漏了什么。

最佳答案

解决方法是将标签格式和值格式分解为不同的部分。参见示例 jsFiddle .

设置 chart.tooltip 如下:

...
tooltip: {
headerFormat: '<b>{point.key}</b><br>',
xDateFormat: '%Q'
},
...

在 xAxis 上,我将标签格式化程序替换为:

...
format: '{value: %Q}'
...

在系列中,我保持后缀/前缀/小数相同:

...
tooltip: {
valuePrefix: '$',
valueDecimals: 0
},
...

当我发现您可以设置自己的日期格式标签时,发生了巨大的变化。我为 Quarters 创建了一个(这是我为之编写的原始繁琐代码):

Highcharts.dateFormats = {
Q: function (timestamp) {
var date = new Date(timestamp);
var y = date.getFullYear();
var m = date.getMonth() + 1;
if (m <= 3) str = "Q1 " + y;
else if (m <= 6) str = "Q2 " + y;
else if (m <= 9) str = "Q3 " + y;
else str = "Q4 " + y;
return str;
}
};

我现在得到了显示正确标签的工具提示。

关于highcharts - 股票图表 - 未显示格式化的工具提示和前缀或后缀,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18703739/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com