การเพิ่มไลบรารีภายนอกAdding external libraries

บทความนี้อธิบายวิธีการใช้ไลบรารีภายนอกในการแสดงผลด้วยภาพของ Power BIThis article describes how to use external libraries in Power BI visuals. ซึ่งรวมถึงข้อมูลเกี่ยวกับการติดตั้ง การนำเข้า และเรียกใช้ไลบรารีภายนอกจากรหัสของการแสดงผลด้วยภาพของ Power BIIt includes information about installing, importing, and calling external libraries from the Power BI visual's code.

ไลบรารี JavaScriptJavaScript libraries

  1. ติดตั้งไลบรารี JavaScript ภายนอกโดยใช้ตัวจัดการแพคเกจต่างๆ เช่น npm หรือ yarnInstall an external JavaScript library by using any package manager such as npm or yarn.
  2. นำเข้าโมดูลที่จำเป็นลงในไฟล์ต้นฉบับโดยใช้ไลบรารีภายนอกImport the required modules into the source files using the external library.

หมายเหตุ

ถ้าคุณต้องการเพิ่ม typings ไปยังไลบรารี JavaScript ของคุณและรับข้อมูลความปลอดภัยและการคอมไพล์ในขณะนี้ โปรดตรวจสอบให้แน่ใจว่าคุณได้ติดตั้งแพคเกจที่เหมาะสมIf you'd like to add typings to your JavaScript library, and get intellisense and compile-time safety, make sure that you install the appropriate package.

การติดตั้งไลบรารี d3Installing the d3 library

นี่คือตัวอย่างของการติดตั้งไลบรารี d3 และแพคเกจ@types/d3 โดยใช้ npmThis is an example of installing the d3 library and the @types/d3 package, using npm.

สำหรับตัวอย่างเต็มรูปแบบ โปรดดูรหัสการแสดงภาพ Power BIFor a full example, see the Power BI visualizations code.

  1. ติดตั้งแพคเกจ d3 และแพคเกจชนิด d3Install the d3 package and the d3 types package.

    npm install d3@5 --save
    npm install @types/d3@5 --save
    
  2. นำเข้าไลบรารีd3 ในไฟล์ที่ใช้เช่น visual.tsImport the d3 library in the files that use it, such as visual.ts.

    import * as d3 from "d3";
    

CSS frameworkCSS framework

  1. ติดตั้งไลบรารี JavaScript ภายนอกโดยใช้ตัวจัดการแพคเกจต่างๆ เช่น npm หรือ yarnInstall an external CSS framework by using any package manager such as npm or yarn.
  2. ใน.lessไฟล์ของการแสดงผลด้วยภาพ รวมถึงimportคำสั่งIn the .less file of the visual, include the import statement.

กำลังติดตั้ง bootstrapInstalling bootstrap

นี่คือตัวอย่างของการติดตั้ง bootstrap จากการใช้ npmThis is an example of installing bootstrap using npm.

สำหรับตัวอย่างเต็มรูปแบบ โปรดดูรหัสการแสดงภาพ Power BIFor a full example, see the Power BI visualizations code.

  1. ติดตั้งแพคเกจ bootstrapInstall the bootstrap package.

    npm install bootstrap --save
    
  2. รวมimportคำสั่งในvisual.lessInclude the import statement in visual.less.

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