Skip to content

Latest commit

 

History

History
50 lines (39 loc) · 2.69 KB

ExtensibilityUtils.md

File metadata and controls

50 lines (39 loc) · 2.69 KB
Raw

Powerbi Extensibility Utils

PowerBI provides several tools that help to cover the main needs to build your own visual.

NPM packages

  1. DataViewUtils is a set of functions and classes in order to simplify parsing of the DataView objects for PowerBI custom visuals.
  2. ChartUtils helps to simplify development of axes, labels and legend for PowerBI custom visuals.
  3. ColorUtils is a tool to manage color manipulations for PowerBI custom visuals
  4. TypeUtils helps to use the Tooltip API for PowerBI custom visuals and extends the basic types for PowerBI custom visuals.
  5. InteractivityUtils is a set of functions and classes for implementation of cross-selection and cross-filtering for PowerBI custom visuals.
  6. FormattingUtils are interfaces for creating PowerBI custom visuals.
  7. SVGUtils is a tool for SVG manipulations for PowerBI custom visuals.

How to install

To install the package you should run the following command in the directory with your current custom visual:

npm install powerbi-visuals-utils-svgutils --save

This command installs the package and adds a package as a dependency to your package.json

Including package dependencies

After installation of the package you should include all necessary js dependencies into your project. You can find more information on each package github page.

For example here is the installation guide for SVGUtils package.

How to use

Having installed the package with all dependencies, you can use these utils in your project. Let's change the following instruction by using SVGUtils package:

  this.xAxis
    .attr('transform', 'translate(0, ' + height + ')')
    .call(xAxis);

At first, import SVGUtils module in top of your typescript file:

  import SVGUtils = powerbi.extensibility.utils.svg;

After that user can use all available module methods

  this.xAxis
    .attr('transform', SVGUtils.translate(0, height))
    .call(xAxis);

To get more information about SVGItils package, please check the following documentation