The Microsoft Power BI visuals project provides high quality data visualizations that you can use to extend Power BI. The project contains over 20 visualization types, the framework to run them, and the testing infrastructure that enables you to build high quality visualizations. The framework provides all the interfaces you need to integrate fully with Power BI's selection, filtering, and other UI experiences. The code is written in TypeScript so it's easier to build and debug. Everything compiles down to JavaScript and runs in modern web browsers. The visuals are built using D3 but you can use your favorite technology like WebGL, Canvas, or SVG. This gives you everything you need to build custom visualizations for Power BI.
- Source code of all the visuals used in Power BI.
- A Playground app to help you try out the existing visuals, and experiment with the ones you have created.
To build the library and run the sample application you will need:
- Git
- Node.js
- Recommended IDE - Visual Studio Community 2015 (Free for use)
- Be sure to install the "Microsoft Web Developer Tools" optional feature. To install, go to Add/Remove Programs, right-click on Visual Studio, select Change, then Modify. Check the "Microsoft Web Developer Tools" checkbox and finish the install.
- You can install VSIX Package and use Visual Studio Template from it to create new Visual.
In order to build the Power BI visuals, ensure that you have Git and Node.js installed.
Clone a copy of the repo:
git clone https://github.com/Microsoft/PowerBI-visuals.git
Change to the PowerBI-visuals directory:
cd PowerBI-visuals
Install dev dependencies:
npm install # This command will install Gulp and all necessary modules
There are many ways in which you can contribute to Power BI visuals:
- You can contribute fixes and new visuals to this repo, read the contribution guildelines.
- Submit bugs by opening a GitHub Issue here.
- Contribute to discussions on StackOverflow.
- Follow the Power BI Developer blog for updates.
- Follow Power BI on Twitter @mspowerbi.
- Getting started
- API specification
- Power BI visuals playground (see our visuals live in action)
- Power BI Homepage
Make sure you first follow the Prerequisites & Onetime Setup
To run sample app:
-
Open
src\PowerBIVisuals.slnin Visual Studio then undersrc\Clients\PowerBIVisualsPlayground, right click onindex.htmlfile and select 'Set As Start Page'. -
Right click on the project root folder then select 'Property Pages'. In the window opened select 'Build' and then in 'Before running startup page' select 'No Build'.
-
Task runner should have kicked off an incremental build task, which will build each time you make changes. NOTE: Sometimes the task runner might kick off two of these tasks at the same time, just close one of them.
-
Ctrl + F5 to launch the Playground.
Make sure you first follow the Prerequisites & Onetime Setup
To run sample app:
- Build the project
gulp build
- Run gulp task
gulp run:playground
Use the following commands to build and test:
gulp build # Build Power BI visuals into `build` folder
gulp test # Run unit tests (requires 'PhantomJS', see below)
You will also need to do the following to run unit tests:
Install PhantomJS (PhantomJS is a headless WebKit scriptable with a JavaScript API. It has fast and native support for various web standards: DOM handling, CSS selector, JSON, Canvas, and SVG.).
For Windows OS PhantomJS will be installed when you call gulp test command. Also you can install PhantomJS using this command:
gulp install:phantomjs
As result, local version of the PhantomJS will be downloaded and installed into the project. For other OS you have to install PhantomJS manually.
Copyright (c) 2015 Microsoft
See the LICENSE file for license rights and limitations (MIT).