如果范围选择器不是默认值,Highcharts工具提示不会清除

时间:2019-05-09 22:12:21

标签: highcharts tooltip

我有一张高图股票图。我的代码如下。页面加载后,工具提示会正常工作。如果更改范围选择器,退出图表后工具提示不会清除。对于为什么会发生任何见解或有关如何清除工具提示的任何建议,将不胜感激。谢谢。

我可以捕获包含元素的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>

``````````````````````````````````````````````````````

0 个答案:

没有答案