📅  最后修改于: 2023-12-03 15:20:27.096000             🧑  作者: Mango
Tableau JavaScript API 是一组 JavaScript 函数和对象,用于与 Tableau Server 或 Tableau Online 交互。通过该 API,您可以创建自定义应用程序,可以在 Web 页中将 Tableau 视图和数据嵌入到您的应用程序中。
Tableau JavaScript API 包含一组 JavaScript 函数和对象,可通过在网页中包含最新的 Tableau JavaScript 文件来使用。这些文件包含与 Tableau Server 或 Tableau Online 交互的代码。您可以使用 Tableau JavaScript API 所提供的函数和对象,通过调用它们与 Tableau Server 或 Tableau Online 进行交互,例如查询工作簿或视图、更新参数或筛选器以及设置和获取工作簿或视图的属性等等。
Tableau JavaScript API 提供了几个核心对象,如 Workbook、Worksheet、View、Filter 和 Parameter 等,下面是这些对象的简单介绍:
Workbook(工作簿)是 Tableau JavaScript API 中的根对象。您可以从服务器获取 Workbook,然后获取 Worksheet 和 View。您还可以在工作簿中查找、创建、删除和保存数据源。
Worksheet(工作表)是工作簿中的一个单独的表单。每个工作表分别拥有唯一的名称。每个工作表都包含一个或多个视图,并提供一些与视图的交互性质的 API 函数。
View(视图)是一个可视化的视图端口,可以在其中查看工作表的内容。可以使用 JavaScript API 操作添加、移动和删除表单和工作表、调整通用选项、自定义和保存视图和工作表、自定义悬停信息等。
Filter(筛选器)是一个允许用户选择数据的工具。您可以使用 JavaScript API 操作添加、删除和编辑筛选器,也可以选择新的值、为筛选器设置指标等等。
Parameter(参数)是一种允许用户自定义视图以更好地解释数据的可配置选项。您可以使用 JavaScript API 操作创建、编辑和删除参数,还可以设置参数的值、类型等等。
为了更好地理解 Tableau JavaScript API 的开发方式,下面对一些常用的 API 进行简单演示。
//初始化 Tableau API
var viz, workbook, activeSheet, worksheets;
var containerDiv = document.getElementById("vizContainer");
var vizOptions = {
width: containerDiv.clientWidth,
height: containerDiv.clientHeight,
hideTabs: true,
hideToolbar: true,
onFirstInteractive: function () {
workbook = viz.getWorkbook();
activeSheet = workbook.getActiveSheet();
worksheets = workbook.getWorksheets();
console.log("Workbook Initialized");
}
};
viz = new tableau.Viz(containerDiv, url, vizOptions);
该代码段展示了如何使用 Tableau JavaScript API 做视图数据的初始化,以便在您的应用程序中嵌入 Tableau 视图。可以将代码嵌入到 HTML 页面中的
或 标签中。//获取 Workbook
workbook = viz.getWorkbook();
获取 Workbook 后,您可以进行多种操作,如获取 Worksheet、保存、切换到其他工作簿、重命名等等。
//获取 Worksheet
activeSheet = workbook.getActiveSheet();
获取 Worksheet 后,您可以查看 Worksheet 的名称、获取所有视图并启用它们、导出 Worksheet 中的数据等等。
//显示某个 Worksheet
activeSheet = workbook.getActiveSheet();
worksheet = worksheets.find(function (worksheet) { return worksheet.getName() === worksheetName; });
worksheet.activateAsync().then(function () {
console.log("Sheet Activated");
});
如果您在工作簿中有多个视图,那么您可以通过以上代码段中的 find() 方法选择要激活的视图。
//获取 Worksheet 中的 DataTable
activeSheet.getSummaryDataAsync().then(function (sumdata) {
var worksheetData = sumdata.getData();
console.log(worksheetData);
});
您可以使用上述代码段中的 getSummaryDataAsync() 方法来获取 Worksheet 包含的 DataTable。
//更改 Filter 的值
var filter = activeSheet.getFilters().get(0);
filter.setFilterAsync("Some filter value").then(function () {
console.log("Filter Changed");
});
您可以使用 setFilterAsync() 方法来更改 Filter 的值。
//获取 Parameter 的值
var parameter = workbook.findParameter(name);
var currentValue = parameter.getCurrentParameterValueAsync();
currentValue.then(function (parameter) {
console.log("Parameter: " + parameter.getName() + " value changed to " + parameter.getCurrentValue().formattedValue);
});
您可以使用 getCurrentParameterValueAsync() 方法来获取 Parameter 的值。
Tableau JavaScript API 是一个非常强大的工具,可以帮助开发人员更好地与 Tableau Server 或 Tableau Online 交互,实现数据分析和可视化。希望本文对您有所帮助。