plotly / plotly/plotly.js

disable default selection of button in range selector buttons

Abierto
#4,709 6 comentarios 13 reacciones 0 asignados Ver en GitHub

Nadie ha tomado este issue todavía.

feature P3
Lenguaje dominante
JavaScript
Estrellas
18.3k
Forks
2k
Merge medio
2 d 12 h
PR fusionados (30 d)
28

Descripción

Hello all,

Right now, enabling the use of buttons in layout.xaxis.rangeselector makes it such that the button 'all' is always selected by default, no matter where it is positioned in the list of buttons. If the button 'all' is not present, the display is still rendered as if it was selected by default.

May we add a default (boolean) property inside a button to know which should be selected by default when first displaying the graph ? This could help to focus on a key point of the data, while allowing the user to zoom out by clicking the 'all' button or by double-clicking on the graph.
This property would be set to false by default, and if no buttons show a true value for this property, then the usual 'all' display shall be rendered.

Example :
Usual display

var layout = {
xaxis: {
            autorange: true,
            rangeselector: {
                buttons: [
                    {
                        count: 1,
                        label: '1m',
                        step: 'month',
                        stepmode: 'backward'
                    },
                    {
                        count: 6,
                        label: '6m',
                        step: 'month',
                        stepmode: 'backward'
                    },
                    {   
                        step: 'all'
                    }
                ]
            },
            rangeslider: {autorange: true},
            type: 'date'
        }
};

In the second case, when loading the page, we already have the 6 months zoom.
6 months button selected by default

var layout = {
        xaxis: {
            autorange: true,
            rangeselector: {
                buttons: [
                    {
                        count: 1,
                        label: '1m',
                        step: 'month',
                        stepmode: 'backward'
                    },
                    {
                        count: 6,
                        label: '6m',
                        step: 'month',
                        stepmode: 'backward',
                        default: true
                    },
                    {   
                        step: 'all'
                    }
                ]
            },
            rangeslider: {autorange: true},
            type: 'date'
        }
};

Guía de contribución

Abrir la guía de contribución

Primeros pasos

  1. Lee el issue completo y luego la guía de contribución del proyecto.
  2. Comenta en el issue que vas a ocuparte — evita que dos personas hagan lo mismo.
  3. Haz un fork del repositorio y trabaja en una rama.
  4. Abre un pull request que haga referencia al número del issue.

Línea de trabajo

Comienza con el manejo de los botones de xaxis.rangeselector descrito en el issue y sigue cómo se elige el rango seleccionado inicialmente. El trabajo estará terminado cuando un botón con default: true controle el rango inicial, mientras que el comportamiento existente de “all” siga siendo el fallback cuando ningún botón esté marcado como predeterminado.

Escrito por el modelo de indexación a partir del texto del issue.

Evaluación

Stack tecnológico
javascript
Área
data-visualization
Tipo de issue
Nueva funcionalidad
Dificultad
4/5
Tiempo estimado
3-5 días
Estado de actividad
Estancado
Claridad
Bastante claro
Aptitud para principiantes
35/100

Recibe los nuevos issues en tu correo

Un resumen breve de issues de GitHub para principiantes.