plotly / plotly/react-plotly.js

[Question] How to tell which point is clicked on when using onClick Event with multiple traces?

Aberta
#165 2 comentários 0 reações 0 responsáveis Ver no GitHub

Ninguém assumiu esta issue ainda.

Linguagem predominante
JavaScript
Estrelas
1.1k
Forks
138
Merge médio
3d 2h
PRs com merge (30d)
4

Descrição

I have setup a react application where I am using createPlotComponent to create an instance of an graph that I can interact with and I am controlling it using react-chart-editor


constructor() {
    this.PlotComponent =  createPlotComponent(plotly)
}
<this.PlotComponent
         ...data ,frames etc
         onClick={(e) => {
         console.log(e)
  }}/>

The problem I am having is that when I have multiple traces on my graph, I want to determine which trace I am clicking. At the moment the event from onClick exposes the points (an array of all of the points clicked) and a MouseEvent which shows information about the point on the graph that is clicked. Is there any way to get specifically the information about the one point that is clicked on?

There might be a way to determine which point is clicked by using the mouse event and matching up the position of the mouse click on the graph with the position of the point on the graph. However, there doesn't seem to access the position of the points on the graph in terms of their coordinates

Guia de contribuição

Nenhum guia de contribuição indexado para este repositório

Primeiros passos

  1. Leia a issue inteira e depois o guia de contribuição do projeto.
  2. Comente na issue dizendo que vai assumir — evita que duas pessoas façam o mesmo trabalho.
  3. Faça um fork do repositório e trabalhe em uma branch.
  4. Abra um pull request que referencie o número da issue.

Direção de pesquisa

Comece pelo uso de createPlotComponent e pelo callback onClick mostrados na issue; em seguida, inspecione o array event.points e o MouseEvent produzido para vários traces. Determine se os dados de evento existentes identificam o trace e o ponto selecionados; considera-se concluído quando uma forma confiável de distinguir o ponto clicado for documentada ou exposta.

Escrita pelo modelo de indexação a partir do texto da issue.

Avaliação

Stack de tecnologia
javascript, react
Domínio
data-visualization, frontend
Tipo de issue
Funcionalidade
Dificuldade
3/5
Tempo estimado
1-2 dias
Status de atividade
Estagnada
Clareza
Razoavelmente clara
Facilidade para iniciantes
25/100

Receba novas issues na sua caixa de entrada

Um resumo curto de issues do GitHub para quem está começando.