📜  tableau javascript (1)

📅  最后修改于: 2023-12-03 15:20:27.096000             🧑  作者: Mango

Tableau JavaScript

Tableau JavaScript API 是一组 JavaScript 函数和对象,用于与 Tableau Server 或 Tableau Online 交互。通过该 API,您可以创建自定义应用程序,可以在 Web 页中将 Tableau 视图和数据嵌入到您的应用程序中。

使用 Tableau JavaScript API 的好处
  • 内嵌 Tableau 的网页将带来更多的数据交互和数据分析的可能性。
  • Tableau API 提供了大量的 JavaScript 函数和对象,可以满足各种交互需求,不仅仅限于简单的图形操作。
  • Tableau API 集成简单,使用方便,适合开发人员快速接入。
  • Tableau API 可以帮助开发人员更好地在自己的应用程序中集成 Tableau 图表和数据,实现无缝连接。
Tableau JavaScript API 如何工作

Tableau JavaScript API 包含一组 JavaScript 函数和对象,可通过在网页中包含最新的 Tableau JavaScript 文件来使用。这些文件包含与 Tableau Server 或 Tableau Online 交互的代码。您可以使用 Tableau JavaScript API 所提供的函数和对象,通过调用它们与 Tableau Server 或 Tableau Online 进行交互,例如查询工作簿或视图、更新参数或筛选器以及设置和获取工作簿或视图的属性等等。

Tableau JavaScript API 的基本架构

Tableau JavaScript API 提供了几个核心对象,如 Workbook、Worksheet、View、Filter 和 Parameter 等,下面是这些对象的简单介绍:

Workbook

Workbook(工作簿)是 Tableau JavaScript API 中的根对象。您可以从服务器获取 Workbook,然后获取 Worksheet 和 View。您还可以在工作簿中查找、创建、删除和保存数据源。

Worksheet

Worksheet(工作表)是工作簿中的一个单独的表单。每个工作表分别拥有唯一的名称。每个工作表都包含一个或多个视图,并提供一些与视图的交互性质的 API 函数。

View

View(视图)是一个可视化的视图端口,可以在其中查看工作表的内容。可以使用 JavaScript API 操作添加、移动和删除表单和工作表、调整通用选项、自定义和保存视图和工作表、自定义悬停信息等。

Filter

Filter(筛选器)是一个允许用户选择数据的工具。您可以使用 JavaScript API 操作添加、删除和编辑筛选器,也可以选择新的值、为筛选器设置指标等等。

Parameter

Parameter(参数)是一种允许用户自定义视图以更好地解释数据的可配置选项。您可以使用 JavaScript API 操作创建、编辑和删除参数,还可以设置参数的值、类型等等。

Tableau JavaScript API 的具体实现

为了更好地理解 Tableau JavaScript API 的开发方式,下面对一些常用的 API 进行简单演示。

初始化 Tableau 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
workbook = viz.getWorkbook();

获取 Workbook 后,您可以进行多种操作,如获取 Worksheet、保存、切换到其他工作簿、重命名等等。

获取 Worksheet
//获取 Worksheet
activeSheet = workbook.getActiveSheet();

获取 Worksheet 后,您可以查看 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
//获取 Worksheet 中的 DataTable
activeSheet.getSummaryDataAsync().then(function (sumdata) {
    var worksheetData = sumdata.getData();
    console.log(worksheetData);
});

您可以使用上述代码段中的 getSummaryDataAsync() 方法来获取 Worksheet 包含的 DataTable。

更改 Filter 的值
//更改 Filter 的值
var filter = activeSheet.getFilters().get(0);
filter.setFilterAsync("Some filter value").then(function () {
    console.log("Filter Changed");
});

您可以使用 setFilterAsync() 方法来更改 Filter 的值。

获取 Parameter 的值
//获取 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 交互,实现数据分析和可视化。希望本文对您有所帮助。