我有一张高图股票图。我的代码如下。页面加载后,工具提示会正常工作。如果更改范围选择器,退出图表后工具提示不会清除。对于为什么会发生任何见解或有关如何清除工具提示的任何建议,将不胜感激。谢谢。
我可以捕获包含元素的mouseover和mouseleave事件,但是我尝试即时重置的任何属性都是只读的,或者似乎无效。
javascript
```````````````````````````````````````````````````````
this.stockChart = new StockChart({
xAxis: {
plotLines: xPlotLines
},
yAxis: {
plotLines: [{ color: 'red', dashStyle: 'ShortDash', value: parseInt(this.sensorDetails.stressPoint), width: 2, id: 'stress' },
{ color: 'yellow', dashStyle: 'ShortDash', value: parseInt(this.sensorDetails.actionPoint), width: 2, id: 'action' }],
min: minY, max: maxY
},
**tooltip:** {
shared: true,
crosshairs: true,
useHTML: true,
shadow: false,
followPointer: true,
formatter: <any>function () {
var s = '';
if (this.points) {
s += '<span><b>' + new Date(this.points[0].x).toLocaleString() + '</b><br>'
for (let i = 0; i < this.points.length; i++) {
const series = this.points[i];
s += '<i class="fas fa-square" style="color: ' + series.color + '" ></i> ' + series.series.name + ': ' + (series.y).toFixed(2) + '<br>'
}
s += '</span>'
}
else { s = 'no points'; }
return s;
}
},
legend: {
enabled: true,
},
**rangeSelector**: {
allButtonsEnabled: true,
buttons: [
{
type: 'month',
text: 'YTD',
count: 12,
dataGrouping: {
forced: true,
units: [['minute', [1]]]
}
},
{
type: 'month',
count: 3,
text: '3 m',
dataGrouping: {
forced: true,
units: [['minute', [1]]]
}
},
{
type: 'month',
count: 1,
text: '1 m',
dataGrouping: {
forced: true,
units: [['minute', [1]]]
}
},
{
type: 'week',
count: 2,
text: '2 w',
dataGrouping: {
forced: true,
units: [['minute', [1]]]
}
},
{
type: 'week',
count: 1,
text: '1 w',
dataGrouping: {
forced: true,
units: [['minute', [1]]]
}
},
{
type: 'day',
count: 1,
text: '1 d',
dataGrouping: {
forced: true,
units: [['minute', [1]]]
}
}
],
buttonTheme: {
width: 30
},
selected: 0
},
title: {
text: 'Soil Moisture Graph'
},
series: series
});
``````````````````````````````````````````````````````
HTML
``````````````````````````````````````````````````````
<div class="grid-x margin-top align-center">
<div class="small-12 large-9 cell" id="graphContainer">
<div class="graph" id="graph" style='width: 100%;'>
<div id="chart" [chart]="stockChart"></div>
</div>
</div>
</div>
``````````````````````````````````````````````````````