gpt4 book ai didi

javascript - 在 Highstocks 中,将鼠标悬停在图表上时如何更改默认时间/日期标签?

转载 作者:行者123 更新时间:2023-12-03 05:55:25 25 4
gpt4 key购买 nike

我已经设法使用格式化程序功能更改 highcharts/highstocks 中的默认 x 轴标签,但尽管查看 API,我仍无法弄清楚如何更改悬停标题(示例:当我将鼠标悬停在列上时)对于图中的“Mark”,它显示为“Thursday ..”以及 Mark 的正确值。但我希望它的标题为“Mark”以及值)。我该如何改变这个? (我想使用 highstocks (而不是 highcharts),因为我的数据比提供的多得多)

<html>
<body>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script src="http://code.highcharts.com/stock/highstock.js"></script>
<script src="http://code.highcharts.com/modules/data.js"></script>
<div id="container"></div>
</body>
<head>

<script type="text/javascript">
var newLabels = ['Marky', 'Ricky', 'Danny', 'Terry', 'Mikey'];
$('#container').highcharts('StockChart', {
chart: {
type: 'column'
},
credits: {
enabled: false
},
xAxis: {
categories: ['Marky', 'Ricky', 'Danny', 'Terry', 'Mikey'],
labels: {
rotation: -45,
formatter: function() {
return newLabels[this.value];
}},
},
title: {
text: 'Anything But the Index'
},
series: [
{name: '1',data:[0.067028837967,0.0,0.0]},
{name: '1a',data:[0.187515270425,0.18818380744,0.0857142857143]},
{name: '1b',data:[0.31600895865,0.0,0.169987200178,0.399354014733,0.0873578570502]},
{name: '2',data:[0.0,0.0,0.0,0.0,1.0]},
{name: '3',data:[0.998898678414,1.0,1.0,0.998898678414,1.0]},
{name: '4',data:[0.0,0.0,0.0,0.0,0.3]},
{name: '6',data:[0.505930477918,0.0,0.190192368338,0.597371635879,0.285892370193]},
],
scrollbar: {
enabled: true,
},
navigator: {
series: {
type: 'areaspline',
}},

rangeSelector: {
enabled:false,
},
});
</script>
</head>
<div id="container" style="height: 400px; min-width: 310px"></div>
</html>

最佳答案

您想自定义工具提示吗?这是如何做到的。

https://jsfiddle.net/yfgpg5x2/12/

    tooltip: {
formatter: function() {
var curTickLabelString = this.points[0].series.xAxis.ticks[this.x].label.textStr;
var tooltipString = "<b>" + curTickLabelString + ":<br></b>";
var curName, curValue, curColor, curGraphic;
for (var i = 0; i < this.points.length; i++) {
curName = this.points[i].series.name;
curValue = this.points[i].y;
curColor = this.points[i].color;
curGraphic = '●';
tooltipString += '<br>'+ curGraphic +' <b style="color: ' + curColor + '">' + curName + ':</b> ' + curValue;
}
return tooltipString;
}
},

enter image description here

在此处阅读有关工具提示的更多信息:

http://api.highcharts.com/highcharts/tooltip

关于javascript - 在 Highstocks 中,将鼠标悬停在图表上时如何更改默认时间/日期标签?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39948980/

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