Compartir a través de

Incorporación de un menú contextual al objeto visual de Power BI

  • Artículo

Todos los objetos visuales de Power BI pueden mostrar un menú contextual. El menú contextual permite realizar varias operaciones en el objeto visual, como analizarlo, resumirlo o copiarlo. Al hacer clic con el botón derecho en cualquier lugar dentro de la ventanilla de un objeto visual (o mantener pulsado en el caso de los dispositivos táctiles), se muestra el menú contextual. Hay dos modos de menús contextuales para cada objeto visual. El modo que se muestra depende de dónde haga clic dentro del objeto visual:

  • Llame al menú contextual en un espacio vacío para ver el menú contextual básico del objeto visual.
  • Llame al menú contextual en un punto de datos específico para opciones agregadas que se pueden aplicar a ese punto de datos. En este caso, el menú contextual también contiene las opciones Mostrar punto de datos como tabla, Incluir y Excluir, que aplicarán el filtro correspondiente a ese punto de datos.

Procedimientos para agregar un menú contextual

Use selectionManager.showContextMenu() con parámetros selectionId y una posición (como un objeto {x:, y:}) a fin de que Power BI muestre un menú contextual para el objeto visual.

Nota

  • selectionManager.showContextMenu() está disponible en la versión 2.2.0 de la API de Objetos visuales. Para averiguar qué versión usa, compruebe apiVersion en el archivo pbiviz.json.
  • Todos los objetos visuales publicados en AppSource deben admitir los dos modos ContextMenu (espacio vacío y punto de datos).

En el ejemplo siguiente se muestra cómo agregar un menú contextual a un objeto visual. El código se toma del archivo barChart.ts, que forma parte del objeto visual BarChart de ejemplo:

constructor(options: VisualConstructorOptions) {
        ...
        this.handleContextMenu();
    }

private handleContextMenu() {
        this.rootSelection.on('contextmenu', (event: PointerEvent, dataPoint) => {
            this.selectionManager.showContextMenu(dataPoint ? dataPoint: {}, {
                x: mouseEvent.clientX,
                y: mouseEvent.clientY
            });
            mouseEvent.preventDefault();
        });
    }

Pasos siguientes

¿Tiene más preguntas? Pregunte a la comunidad de Power BI