如何新增外部程式庫

此文章說明如何在 Power BI 視覺效果中使用外部程式庫。 本文也說明如何從 Power BI 視覺效果的程式碼安裝、匯入及呼叫外部程式庫。

JavaScript 程式庫

  1. 使用套件管理員 (例如 npm 或 yarn) 來安裝外部 JavaScript 程式庫。
  2. 使用外部程式庫，將所需的模組匯入來源檔案。

注意

如果要將輸入新增至 JavaScript 程式庫，並取得 IntelliSense 與編譯時間的安全性，請確定您已安裝適當的套件。

安裝 D3 程式庫

本節提供在 Power BI 視覺效果程式碼中使用 npm 安裝 D3 連結庫和 @types/d3 套件的範例。

如需完整範例，請參閱 Power BI 視覺效果 \(英文\) 程式碼。

  1. 安裝 d3 套件與 @types/d3 套件。

    npm install d3@5 --save
npm install @types/d3@5 --save

  2. 在加以使用的檔案中匯入 d3 程式庫，例如 visual.ts。

    import * as d3 from "d3";

CSS 架構

  1. 使用任何套件管理員 (例如 npm 或 yarn) 來安裝外部 CSS 架構。
  2. 在視覺元件的 .less 檔案中，加入 import 陳述式。

安裝 Bootstrap

這個部分提供使用npm安裝Bootstrap的範例。

如需完整範例，請參閱 Power BI 視覺效果 \(英文\) 程式碼。

  1. 安裝啟動程序套件。

    npm install bootstrap --save

  2. 在 import 中包含 陳述式。

    @import (less) "node_modules/bootstrap/dist/css/bootstrap.css";

相關內容

設定環境以開發 Power BI 視覺效果

  • Last updated on