The Power BI team just released v1.2 of the Custom Visuals SDK. With this version you now need to reference d3 v3.5.5 yourself. d3 v4 does not work yet. I’m working with the team to get a v4 compat and sample together, but for now you can only use v3.5.5.
You can follow along with the steps below or follow along on this video:
1. Setup your Custom Viz dev env: Power BI Documentation: Use developer tools to create custom visuals
2. Create a new visual
3. Install typings https://github.com/typings/typings
4. Add d3 v3.5.5
5. Add d3 typing
6. Add files to tsconfig.json
Add "typings/index.d.ts"
to tsconfig.json
7. Add d3 reference to pbiviz.json to externalJS array
Add "node_modules/d3/d3.min.js"
to pbiviz.json
8. Copy this code to src/visual.ts
9. Start pbiviz dev server
10. Go to http://app.powerbi.com.
11. Enable Developer Settings
See this page for instructions on enabling the Developer visual in Power BI.
Power BI Documentation: Use developer tools to create custom visuals
12. Create a Report
13. Click the Custom Visual Icon.
14. You should now see your d3 visual.