Feature request: access to layers and subplots with stable API
Nadie ha tomado este issue todavía.
- Lenguaje dominante
- JavaScript
- Estrellas
- 18.3k
- Forks
- 2k
- Merge medio
- 2 d 12 h
- PR fusionados (30 d)
- 28
Descripción
Context
We want to display interactive SVG elements on a plotly plot in data coordinates. In order to do this, we currently use the _fullLayout "private" API in order to get a handle to
- subplots
clipId- top shape layer.
We then add a new layer for positioning interactive elements right above _fullLayout._shapeUpperLayer, as seen here:
import { select as d3_select } from 'd3-selection';
export function getInteractorLayer(plotlyPlot, plot='xy') {
// plotlyPlot is a plotly plot object, e.g. from Plotly.newPlot() or Plotly.react()
// plot is the subplot name, e.g. 'xy', 'x2y2'
const subplot = plotlyPlot._fullLayout._plots[plot];
const shapelayer = plotlyPlot._fullLayout._shapeUpperLayer;
const layer_above = d3_select(shapelayer.node().parentNode);
// create interactor layer, if not exists:
layer_above.selectAll("g.interactorlayer")
.data(["interactors"])
.enter().append("g")
.classed("interactorlayer", true);
const interactorlayer = layer_above.selectAll("g.interactorlayer");
const clipid = subplot.clipId.replace(/plot$/, '');
return { interactorlayer, subplot, clipid };
}
Request
A public interface for getting handles to subplots, the clipId, and the top shape layer (or a simple API function for creating a new top layer!)
Once we have the items above, we can create interactors on top of a plotly plot and re-render them as needed with e.g.
plotlyPlot.on('plotly_relayout', relayout);
plotlyPlot.on('plotly_afterplot', relayout);
plotlyPlot.on('plotly_relayouting', relayout);
as seen in this demo: https://bmaranville.github.io/plotly-interactors/demo.html (drag the interactors around and look at the console to see the callbacks being called with the updated state of the interactor)
Guía de contribución
Primeros pasos
- Lee el issue completo y luego la guía de contribución del proyecto.
- Comenta en el issue que vas a ocuparte — evita que dos personas hagan lo mismo.
- Haz un fork del repositorio y trabaja en una rama.
- Abre un pull request que haga referencia al número del issue.
Línea de trabajo
Comienza con el ejemplo de getInteractorLayer y los puntos de entrada plotly_relayout, plotly_afterplot y plotly_relayouting descritos en el issue. Define una alternativa pública al acceso privado a _fullLayout que exponga subplots, clipId y la capa superior de shapes, o que cree una capa superior, y verifica después que los interactores puedan posicionarse y volver a renderizarse mediante los callbacks mostrados.
Escrito por el modelo de indexación a partir del texto del issue.
Evaluación
- Stack tecnológico
- d3js, javascript
- Área
- api, data-visualization, frontend
- Tipo de issue
- Nueva funcionalidad
- Dificultad
- 5/5
- Tiempo estimado
- Más de una semana
- Estado de actividad
- Estancado
- Claridad
- Bastante claro
- Aptitud para principiantes
- 25/100