从 0 开始造 PowerBI 可视化对象

1.安装NodeJs(注意版本至少10.0+),注意和你的系统版本匹配(我的win10x64),官网下载一路傻瓜式next,,,
2.命令行或者powershell里面均可,使用国内镜像下载powerbi可视化构造工具包:
npm config set registry https://registry.npm.taobao.org
3.开始下载全局安装:
npm i -g powerbi-visuals-tools
稍微有些安装等待时间,大概安装如下图所示:
file
4.然后继续命令行生成安装证书:
pbiviz --install-cert
很多人死在这一步,有些报错可能需要安装OpenSSL,自己百度搞定,,,
此时会生成一个证书密码注意保留,下面界面配置时要填写,,,
file
5.然后继续命令行(你没看错,和上面那句命令一样)安装证书:
pbiviz --install-cert
进入正式界面配置导入过程
参考:https://blog.csdn.net/weixin_39835147/article/details/110843967
https://docs.microsoft.com/zh-cn/power-bi/developer/visuals/environment-setup?tabs=windows#set-up-power-bi-service-for-developing-a-visual
6.然后顺便配置下在线版app.powerbi.com启用开发者模式(设置-设置-常规):
file
国内版的进世纪互联那个网址配置启用,,,
7.此时命令行继续输入
pbiviz
file

得到该工具的使用提示信息,从上图可以看到,初始化生成一个CircleCard的可视化对象只需命令:
pbiviz new CircleCard
file
从字面上猜测package命令用于最后的打包,-v查看工具版本信息,-h提示工作操作帮助信息,,,
start你也可能会出错,VS环境有没有?
导航至指定项目目录
cd CircleCard
使用命令行调用Visual Studio Code
code .
其实就是在这个编辑器里面去编辑设置项目中的部分文件对象的代码。
命令行启动视觉对象的开发人员服务器:
pbiviz start
将会开始编译visual code的打开项目
file
file
参考:https://docs.microsoft.com/zh-cn/power-bi/developer/visuals/
下面正式开始撸,,,,,,
—————————————————————————————————————————————————
关于TypeScript:
根据官网提供的实例你会发现上来就直接让你改ts后缀文件,简直扯淡,你想知道他为什么这么改、改的啥玩意儿,你就得学TypeScript,了解它的对象、方法属性。其实就pbiviz对象改造而言,你目前不需要太深入的东西。










*

借轮子造对象(你不是觉得人家echarts、HigthChart、D3干得漂亮,直接拿过来用)安装对应库依赖项:
npm i d3@^5.0.0 --save
npm i @types/d3@^5.0.0 --save
npm i core-js@3.2.1 --save
npm i powerbi-visuals-api --save-dev







最后打包生成可供本地导入PowerBI Desktop文档的可视化对象.pbiviz文件:

pbiviz package

打包好的.pbiviz文件在你的初始化启动的项目的 dist 文件夹下面。
注意:先cd到你的项目根目录下,根目录下有个pbiviz.json文件,该填写完整的信息填完整,否则打包会报错:
file
file
该包包含了将自定义视觉对象导入到 Power BI 服务或 Power BI Desktop 报表所需的所有内容。
本地用这个打包好的可视化对象不用说了吧,在你Power BI Desktop导入市场可视化对象包那个位置点一点,
file
参考:
https://docs.microsoft.com/zh-cn/power-bi/developer/visuals/custom-visual-develop-tutorial-format-options
——————————————————————————————————————————————————
下面完整实例来一面,,,

另外关于echarts和highcharts、D3案例源码喜欢哪个搞哪个:
https://echarts.apache.org/examples/zh/index.html
https://www.highcharts.com.cn/demo/highcharts/
https://bl.ocks.org/mbostock
另一个可以制作PBIVIZ可视化对象的工具也可以参考下:
https://github.com/Microsoft/charticulator

道高一尺 魔高一丈
https://pbihub.cn/users/44
M与DAX的恩怨纠葛