Как реализовать совместное перекрестие в пользовательском плагине — Grafana

#reactjs #typescript #grafana

Вопрос:

Я пытаюсь реализовать пользовательскую подсказку в своем плагине панели с функцией общего перекрестия, но мне нужно явно указать положение курсора во времени (в качестве значения), и я не могу найти никакой информации в официальной документации.

Ответ №1:

Хорошо, после нескольких часов поиска я нашел решение, поэтому я пишу это здесь для дальнейшего использования.

 componentDidMount(){
   this.props.eventBus.getStream(DataHoverEvent).subscribe((data)=>{
      //Now you can access the current row index (data.payload.rowIndex)
      console.log(data.payload.rowIndex);
   });
}
 

Полный компонент React-это

 
import React, { PureComponent } from 'react';
import { PanelProps, DataHoverEvent } from '@grafana/data';

export class CustomPanel extends PureComponent<PanelProps>{

  constructor(props){
    super(props);
  }

  componentDidMount(){
    this.props.eventBus.getStream(DataHoverEvent).subscribe((data)=>{
      //Now you can access the current row index (data.payload.rowIndex)
      console.log(data.payload.rowIndex);
    });
  }
  
  render(){
    return (
      <div></div>
    );
  }
}
 

Надеюсь, это кому-нибудь пригодится!