Thành phần để hiển thị bảng điều khiển Tableau ở góc cạnh, trình bao bọc của API JavaScript Tableau chính thức
Đặc trưng
- [x] Tải trang tổng quan
- [x] Làm mới dữ liệu
- [x] Hiển thị hộp thoại hoạt cảnh
- [ ] Áp dụng các bộ lọc
Cách sử dụng/Ví dụ
Sử dụng cơ bản
ứng dụng. mô-đun. ts
import { AngularTableauModule } from "angular-tableau"; @NgModule[{ declarations: [AppComponent], imports: [BrowserModule, AngularTableauModule], bootstrap: [AppComponent], }] export class AppModule {}
ứng dụng. thành phần. html
Máy chủ hoạt cảnh riêng
ứng dụng. mô-đun. ts
import { AngularTableauModule, TABLEAU_API } from "angular-tableau"; @NgModule[{ declarations: [AppComponent], imports: [BrowserModule, AngularTableauModule], providers: [ { provide: TABLEAU_API, useValue: "//private.tableau.com/javascripts/api/tableau-2.8.0.min.js", }, ], bootstrap: [AppComponent], }] export class AppModule {}
Chức năng
ứng dụng. thành phần. html
Refresh Data
ứng dụng. thành phần. ts
import { AngularTableauComponent } from "angular-tableau"; export class AppComponent { @ViewChild["dashboard1"] Dashboard1: AngularTableauCompoment; async handleRefreshButtonClick[] { console.log["Refresh data started"]; await this.Dashboard1.refreshDataAsync[]; console.log["Data refreshed"]; } }
Sự kiện
ứng dụng. thành phần. html
ứng dụng. thành phần. ts
import { AngularTableauComponent } from "angular-tableau"; export class AppComponent { @ViewChild["dashboard1"] Dashboard1: AngularTableauCompoment; async handleLoaded[] { console.log["Refresh data started"]; await this.Dashboard1.refreshDataAsync[]; console.log["Data refreshed"]; } }
Tham chiếu API
Thuộc tính
AttributeTypeDefaultDescriptionsrc
string
''Required. Url của bảng điều khiểnheight
string
'100%'Chiều cao của vùng chứa_______1_______1string
'100%'Chiều rộng của vùng chứa3
4falseHide tab
5
4falseHide toolbar
Sự kiện
EventDescription7Phát ra khi bảng điều khiển được tải lần đầu [onFirstInteractive]
Chúng ta có thể tích hợp Tableau với góc cạnh không?
Bước đầu tiên, chúng ta cần thêm tệp API Tableau bên dưới vào chỉ mục. html của ứng dụng Angular của chúng tôi . Tiếp theo, chúng ta cần thêm một div vào tệp html của thành phần để hiển thị báo cáo Tableau. Vùng chứa div này sẽ được sử dụng để chứa nội dung Tableau.
Làm cách nào để sử dụng API JavaScript trong Tableau?
Các tệp API JavaScript được đặt trên máy chủ [bao gồm Tableau Cloud và Tableau Public]. Không có bản tải xuống riêng biệt. Để sử dụng API JavaScript, bạn chỉ cần chỉ định URL cho tệp API JavaScript trong trang web của mình . Để biết thêm thông tin, hãy xem Truy cập API.
Bạn có thể sử dụng JavaScript trong Tableau không?
Tổng quan. Bạn có thể sử dụng API JavaScript của Tableau để nhúng và tích hợp trực quan hóa Tableau vào các ứng dụng web của riêng mình . Bạn có thể hiển thị trực quan hóa từ Tableau Server, Tableau Public và Tableau Cloud và tương tác theo chương trình với các chế độ xem riêng lẻ.
Tableau REST API là gì?
Với API REST của Tableau Server, bạn có thể quản lý và thay đổi Tableau Server, Tableau Cloud site và tài nguyên Prep Conductor theo chương trình, sử dụng HTTP . API cung cấp cho bạn quyền truy cập đơn giản vào chức năng đằng sau nguồn dữ liệu Tableau, dự án, sổ làm việc, người dùng trang, trang, luồng, v.v.